edit | blame | history | raw

ExampleBlcPage 代码

import React, {Component} from 'react'
import './ExampleDrawPage.css'
import {GIS} from "../iclient3d-plot-diy";

;
import {Button} from "antd";

export default class ExampleBlcPage extends Component {

    constructor(props) {
        super(props);
        this.state = {
            htmlString: '<h3>正在加载中...</h3>',
        };
    }

    options = [
        {
            "bz": true,
            "bzlx": "simple",
            "jbwb": "R:00017",
            "type": "2002",
            "code": "draw_primitive_1000_",
            "useModify": false,
            "lon": 102.73181802939419,
            "lat": 30.982754659441543,
            "height": 0
        },
        {
            "bz": true,
            "bzlx": "detail",
            "jbwb": "R:00017",
            "type": "2002",
            "xbwb": "17/10/2019\n16:45:8\n9260.00-10400.00MHZ",
            "code": "draw_primitive_1001_",
            "useModify": false,
            "lon": 102.74521918551825,
            "lat": 30.982390144247127,
            "height": 0
        }
    ]

    componentDidMount() {
        this.showData();

        fetch('./example/ExampleBlcPage.md')
            .then(response => response.text())
            .then(mdText => {
                this.setState({htmlString: window.marked.parse(mdText)});
            });
        //监听拨盘事件
    }

    showData() {
        this.mapFunction.mapApiService.showDrawDatas(this.options);
    }

    setCameraHeightByScale(scale) {
        this.mapFunction.setScale(scale);
    }

    render() {
        return (
            <div className={"example_draw_container"}>
                <h3>切换比例尺</h3>
                <div className={"map_wrapper"}>
                    <GIS refs={
                        e => {
                            this.mapFunction = e
                        }
                    }
                         plotUrl={this.state.plotUrl}
                         mapRef={this}
                         showDefaultLayer={true}
                    />
                </div>
                <Button type="primary" onClick={() => this.setCameraHeightByScale(50)}>1:50</Button>
                <Button type="primary" onClick={() => this.setCameraHeightByScale(2500)}>1:2500</Button>
                <Button type="primary" onClick={() => this.setCameraHeightByScale(10000)}>1:10000</Button>
                <Button type="primary" onClick={() => this.setCameraHeightByScale(50000)}>1:50000</Button>
                <div className={"code_wrapper"}>
                    <div dangerouslySetInnerHTML={{__html: this.state.htmlString}}></div>
                </div>
            </div>
        )
    }
}