import React, {Component} from 'react'
|
import './ExampleDrawPage.css'
|
import {GIS} from "iclient3d-plot-diy";
|
import {Button} from "antd";
|
|
export default class ExampleDynamicDlcPage extends Component {
|
|
constructor(props) {
|
super(props);
|
this.state = {
|
htmlString: '<h3>正在加载中...</h3>',
|
};
|
}
|
|
options = [
|
{
|
"bz": true,
|
"bzlx": "simple",
|
"jbwb": "R:00017",
|
"type": "2002",
|
"useModify": false,
|
"lon": 102.73181802939419,
|
"lat": 30.982754659441543,
|
"height": 0,
|
iconSizes: [[40, 40], [30, 30], [20, 20], [15, 15], [8, 8]]
|
}
|
]
|
|
componentDidMount() {
|
|
fetch('./example/ExampleDynamicDlcPage.md')
|
.then(response => response.text())
|
.then(mdText => {
|
this.setState({htmlString: window.marked.parse(mdText)});
|
});
|
|
this.showData();
|
}
|
|
showData() {
|
this.mapFunction.mapApiService.showDrawDatas(this.options);
|
}
|
|
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}
|
iconScales={[[0, 100000], [100000, 500000], [500000, 1000000], [1000000, 2000000], [2000000, 20000000]]}
|
/>
|
</div>
|
<Button type="primary" onClick={() => this.mapFunction.mapApiService.enableTilt()}>启用旋转和倾斜
|
</Button>
|
<Button type="primary" onClick={() => this.mapFunction.mapApiService.disableTilt()}>禁用旋转和倾斜
|
</Button>
|
<div className={"code_wrapper"}>
|
<div dangerouslySetInnerHTML={{__html: this.state.htmlString}}></div>
|
</div>
|
</div>
|
)
|
}
|
}
|
