From ebab191767e28d8c3cb24f8c376c67fa69709c8c Mon Sep 17 00:00:00 2001
From: sbjw <sbjw.happy@163.com>
Date: Tue, 09 Dec 2025 07:52:37 +0000
Subject: [PATCH] add
---
public/example/Example2DDrawUpdatePage.md | 142 +++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 142 insertions(+), 0 deletions(-)
diff --git a/public/example/Example2DDrawUpdatePage.md b/public/example/Example2DDrawUpdatePage.md
new file mode 100644
index 0000000..bd509a3
--- /dev/null
+++ b/public/example/Example2DDrawUpdatePage.md
@@ -0,0 +1,142 @@
+
+### Example2DDrawUpdatePage ����
+
+```jsx
+import React, {Component} from 'react'
+import './ExampleDrawPage.css'
+import {GIS} from "iclient3d-plot-diy";
+
+import {Button} from "antd";
+
+export default class Example2DDrawUpdatePage extends Component {
+
+
+ optionObjs = {
+ "Ŀ����Ŀ": {
+ code: '123',
+ type: "2002",
+ xz: true,
+ xzColor: '#00ff00',
+ xx: true,
+ xxColor: '#ff0000',
+ iconColor: '#dddddd',
+ returnHeight: true,
+ useModify: false,
+ lon: 102.23554539488224,
+ lat: 31.005068100060593,
+ height: 0,
+ points: []
+ },
+ }
+ line_star
+ drawOps = [];
+
+ constructor(props) {
+ super(props);
+ this.state = {
+ htmlString: '<h3>���ڼ�����...</h3>',
+ plotText: ''
+ };
+ }
+
+ componentDidMount() {
+ fetch('./example/Example2DDrawUpdatePage.md')
+ .then(response => response.text())
+ .then(mdText => {
+ this.setState({htmlString: window.marked.parse(mdText)});
+ });
+ this.showOptions();
+
+ let index = 0;
+ let f = () => {
+ index++;
+ this.mapFunction.mapApiService.updateDraw('123', {
+ lon: 102.23554539488224,
+ lat: 31.005068100060593,
+ height: index * 1000
+ })
+ let dd = this.mapFunction.mapApiService.exportDraw('123');
+ this.setState({
+ plotText : JSON.stringify(dd)
+ });
+ if (index < 10) {
+ setTimeout(f, 1000)
+ }
+ }
+ f();
+ }
+
+ showOptions = () => {
+ if (this.mapFunction) {
+ let options = [];
+ for (let key in this.optionObjs) {
+ options.push(this.optionObjs[key]);
+ }
+ this.mapFunction.mapApiService.showDrawDatas(options);
+ }
+ };
+
+
+ async draw(option) {
+ option = JSON.parse(JSON.stringify(option));
+ option.useModify = true;
+ delete option.points;
+ delete option.lon;
+ delete option.lat;
+ delete option.height;
+ let p = await this.mapFunction.mapApiService.draw(option);
+ p.drawEnd.subscribe(value => {
+ // alert(p.export());
+ })
+ this.drawOps.push(p);
+ }
+
+ export() {
+ let op = [];
+ let draws = this.mapFunction.mapApiService.getAllDraw();
+ for (let d of draws) {
+ let dd = this.mapFunction.mapApiService.exportDraw(d.code);
+ if (dd) {
+ op.push(dd);
+ }
+ }
+ console.log(op);
+ }
+
+ render() {
+ let buttons = [];
+ let obs = JSON.parse(JSON.stringify(this.optionObjs));
+ for (let key in obs) {
+ let option = obs[key];
+ buttons.push(<Button type="primary" onClick={this.draw.bind(this, option)} key={key}>{key}</Button>);
+ }
+
+ return (
+ <div className={"example_draw_container"}>
+ <h3>�������/չʾ���еľ�������</h3>
+ <div className={"map_wrapper"}>
+ <GIS refs={
+ e => {
+ this.mapFunction = e
+ }
+ }
+ useSvgIcon={true}
+ iconScales={[[0, 2000], [2000, 10000], [10000, 5000000]]}
+ plotUrl={this.state.plotUrl}
+ mapRef={this}
+ map2D={true}
+ showDefaultLayer={false}
+ />
+ </div>
+ {this.state.plotText}
+ <div className={"code_wrapper"}>
+ <div dangerouslySetInnerHTML={{__html: this.state.htmlString}}></div>
+ </div>
+ </div>
+ )
+ }
+}
+
+
+
+```
--
Gitblit v1.9.3