使用50版本

sbjw

18 hours ago 6f475ec20efbbb91d5d3d012284eeaa5b0a0bab0

使用50版本

 package.json

@@ -20,7 +20,7 @@
        "@turf/turf": "^7.2.0",
        "antd": "^4.24.16",
        "echarts": "^5.6.0",
        "iclient3d-plot-diy": "^1.0.49",
        "iclient3d-plot-diy": "^1.0.50",
        "iclient3d-plot-diy-attachment": "^1.0.2",
        "jquery": "^3.7.1",
        "react-draggable": "^3.3.2",

 public/example/ExampleDrawDy2Page.md

New file
@@ -0,0 +1,619 @@

### ExampleDrawDy2Page 代码

```jsx
import React, {Component} from 'react'
import './ExampleDrawPage.css'
import {GIS} from "iclient3d-plot-diy";
import {Button, Input} from "antd";
import {timer} from "rxjs";


export default class ExampleDrawDy2Page extends Component {


    optionObjs = {
        "目标简标": {
            allowPicking: false,
            code: '123123',
            bz: true,
            bzColor: '#e000ff',
            bzLineColor: '#ff0000',
            bzlx: 'simple',
            jbwb: 'R:00017',
            type: "2002",
            returnHeight: true,
            useModify: false,
            lon: 102.73054539488224, lat: 31.005468100060593, height: 0,
            points: [],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "目标醒目": {
            allowPicking: false,
            bz: true,
            bzColor: '#0000FF',
            bzLineColor: '#000000',
            bzlx: 'simple',
            jbwb: 'R:00017',
            xz: true,
            xzColor: '#00ff00',
            xx: true,
            xxColor: '#ff0000',
            type: "2002",
            iconColor: '#dddddd',
            returnHeight: true,
            useModify: false,
            lon: 102.73554539488224, lat: 31.005068100060593, height: 0,
            points: []
        },
        "目标详标": {
            allowPicking: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'R:00017',
            xbwb: "17/10/2019\n16:45:8\n9260.00-10400.00MHZ",
            type: "2002",
            useModify: false,
            lon: 102.70054539488224, lat: 31.000468100060593, height: 0,
            points: [],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行简标": {
            allowPicking: false,
            bz: true,
            bzlx: 'simple',
            jbwb: "P:00019",
            type: "2010",
            useModify: false,
            lon: 102.76054539488224, lat: 31.000468100060593, height: 0,
            points: [{lon: 102.76554539488224, lat: 31.000468100060593, height: 0}, {
                lon: 102.76904539488224,
                lat: 30.992468100060593,
                height: 0
            }],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行详标": {
            allowPicking: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'P:00019',
            xbwb: "F16-1\n美国\n16:45:56\nR:00019\nC:00019",
            type: "2010",
            useModify: false,
            lon: 102.73054539488224, lat: 31.001068100060593, height: 0,
            points: [
                {lon: 102.73554539488224, lat: 31.001068100060593, height: 0},
                {lon: 102.73904539488224, lat: 30.992468100060593, height: 0}
            ],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗侦察区域": {
            allowPicking: false,
            type: "lddkzcqy",
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.72004539488224, lat: 31.001068100060593, height: 0,
            useModify: false,
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗干扰波束": {
            allowPicking: false,
            type: 'lddkgrps',
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.72004539488224, lat: 30.991068100060593, height: 0,
            useModify: false,
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗测向线": {
            allowPicking: false,
            type: "lddkcxx",
            kcwb: "10110",
            kcgls: 1,
            kcjd: 30,
            useModify: false,
            lon: 102.76054539488224, lat: 31.011068100060593, height: 0,
            points: []
        },
        "雷达对抗关系": {
            allowPicking: false,
            type: "lddkgx",
            kcwb: "10110",
            kcgls: 1,
            kcjd: 30,
            useModify: false,
            lon: 102.78054539488224,
            lat: 31.015068100060593,
            height: 0,
            points: []
        },
        "雷达对目标探测": {
            allowPicking: false,
            type: "lddmbtc",
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.71004539488224, lat: 30.990068100060593, height: 0,
            useModify: false,
        },
        "通信对抗侦察区域": {
            allowPicking: false,
            type: "txdkzcqy",
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.69804539488224, lat: 30.990068100060593, height: 0,
            useModify: false,
        },
        "通信对抗干扰波束": {
            allowPicking: false,
            type: "txdkgrps",
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.76004539488224, lat: 30.991068100060593, height: 0,
            useModify: false,
        },
        "通信对抗测向线": {
            allowPicking: false,
            type: "txdkcxx",
            kcgls: 1,
            kcjd: 30,
            kcwb: "10110",
            useModify: false,
            lon: 102.76854539488224, lat: 31.009068100060593, height: 0,
            points: []
        },
        "通信畅通区域": {
            allowPicking: false,
            type: 'txctqy',
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.71504539488224, lat: 30.980068100060593, height: 0,
            useModify: false,
        },
        "通信网标绘": {
            type: "txw",
            allowPicking: false,
            useModify: false,
            lon: 102.70854539488224, lat: 31.0098468100060593, height: 0,
            points: []
        },
        "光电对抗侦察区域": {
            type: 'gddkzcqy',
            allowPicking: false,
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.69054539488224, lat: 31.0098468100060593, height: 0,
            useModify: false,
        },
        "光电有源对抗干扰波束": {
            allowPicking: false,
            type: 'gdyydkgrbs',
            kcgls: 1,
            kcjd: 30,
            lon: 102.67054539488224, lat: 31.0098468100060593, height: 0,
            useModify: false,
        },
        "漫反射干扰区域": {
            allowPicking: false,
            type: 'mfsgrqy',
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.67054539488224, lat: 31.0028468100060593, height: 0,
            useModify: false,
        },
        '烟幕形成区域': {
            allowPicking: false,
            type: 'ymxcqy',
            points: [{lon: 102.64984, lat: 30.99237, height: 0},
                {lon: 102.66012682459443, lat: 30.995109020954718, height: 0},
                {lon: 102.67126799815856, lat: 30.98766239848537, height: 0},
                {lon: 102.64984, lat: 30.983747593478107, height: 0},
                {lon: 102.64984, lat: 30.99237, height: 0}],
            useModify: false,
        },
        "掩护区域": {
            allowPicking: false,
            type: 'yhqy',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.65927322610115, lat: 31.01540811637356, height: 0},
                {lon: 102.66192135373299, lat: 31.005988487769518, height: 0},
                {lon: 102.64755620178961, lat: 31.00246196283815, height: 0},
                {lon: 102.642853926199, lat: 31.012509646376447, height: 0}],
            useModify: false,
        },
        "协同关系": {
            allowPicking: false,
            type: 'xtgx',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.66192135373299, lat: 31.005988487769518, height: 0}],
            useModify: false,
        },
        "干扰线": {
            allowPicking: false,
            type: 'grx',
            points: [{lon: 102.732420985008, lat: 30.97556325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97504986175468, height: 0}],
            useModify: false
        },
        "预警线": {
            allowPicking: false,
            type: 'yjx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97956325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.98004986175468, height: 0}]
        },
        "目标分配线": {
            allowPicking: false,
            type: 'mbfpx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97756325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97804986175468, height: 0}]
        },

        "干扰关系线": {
            type: "grgxx",
            color: '#ffff00',
            useModify: false,
            points: [{
                lon: 104.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },

        "单色线": {
            type: "line",
            bklx: 'solid',
            bkkd: 4,
            color: '#64c324',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "双色线": {
            type: "line",
            bklx: 'double',
            bkkd: 4,
            color: '#ff0000',
            color2: '#0000ff',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "通信抗测向线2": {
            type: "txdkcxx2",
            kcjd: 120,
            kcgls: 10,
            kcwb: '123123',
            color: '#0059FFA3',
            lon: 103.73554539488224,
            lat: 31.005068100060593,
            height: 0,
            useModify: false,
            points: []
        },
        "团指任务分界线": {
            type: "tzrwfjx",
            color: '#D5013A',
            useModify: false,
            points: [{
                lon: 102.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "连指任务分界线": {
            type: "lzrwfjx",
            color: '#D5013A',
            useModify: false,
            points: [{
                lon: 102.45554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.45554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "干扰波束": {
            type: "grbs",
            color: '#D5013A',
            useModify: false,
            lon: 102.23554539488224,
            lat: 31.005068100060593,
            height: 0,
            qsjd: 30,
            zzjd: 130,
            bj: 100
        }
    }

    drawOps = [];
    timer = null;

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

    componentDidMount() {
        fetch('./example/ExampleDrawDyPage.md')
            .then(response => response.text())
            .then(mdText => {
                this.setState({htmlString: window.marked.parse(mdText)});
            });
    }


    async draw(option) {
        this.closeUpdate();
        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);
    }

    arr2;

    startTimer() {
        if (this.timer) {
            clearInterval(this.timer);
            this.timer = null;
        }

        let arr = [];
        let index = 0;
        for (let key in this.optionObjs) {
            if (!this.optionObjs[key].code) {
                this.optionObjs[key].code = this.optionObjs[key].type + (index++);
            }
            arr.push(this.optionObjs[key]);
            // if (this.optionObjs[key] && this.optionObjs[key].lat) {
            //     arr.push(this.optionObjs[key]);
            // }
        }
        let arr2 = [];
        for (let i = 0; i < parseInt(this.state.drawCount + ''); i++) {
            let index = i % arr.length;
            let option = JSON.parse(JSON.stringify(arr[index]));
            option.lat = arr[index].lat + i * 0.0001;
            option.lon = arr[index].lon + i * 0.0001;
            option.code = option.type + i;
            arr2.push(option);
        }
        this.mapFunction.mapApiService.showDrawDatas(arr2);
        this.arr2 = arr2;

        let i = 0;
        this.timer = setInterval(() => {
            i++;
            for (let one of arr2) {
                let option;
                if (one && one.lat) {
                    // 表示航迹
                    if (one.points && one.points.length > 0) {
                        option = Object.assign({}, one);
                        one.points.push({
                            lat: one.lat,
                            lon: one.lon,
                            height: one.height,
                        });
                        one.lat = one.lat + 0.0001;
                        one.lon = one.lon + 0.0001;

                        option = one;
                    } else {
                        one.lat = one.lat + 0.0001;
                        option = one;
                        // option = {
                        //     lat: one.lat,
                        //     lon: one.lon + i * 0.0001,
                        //     height: one.height,
                        //     allowPicking: one.allowPicking,
                        // }
                    }
                } else if (one && one.points) {
                    one.points = one.points.map(point => {
                        return {
                            lat: point.lat,
                            lon: point.lon + i * 0.0001,
                            height: point.height,
                        }
                    })
                    option = one;
                }


                if (i % 10 == 0) {
                    this.mapFunction.mapApiService.removeDraw(one.code);
                    this.mapFunction.mapApiService.showDrawDatas([one]);
                } else {
                    this.mapFunction.mapApiService.updateDraw(one.code, option);
                }
            }
        }, parseInt(this.state.rate + '') || 1000);
    }

    stopTimer() {
        if (this.timer) {
            clearInterval(this.timer);
            this.timer = null;
        }
        if (this.arr2) {
            for (let one of this.arr2) {
                this.mapFunction.mapApiService.removeDraw(one.code);
            }
            this.arr2 = null;
        }
    }


    updateOption(i) {
        for (let d of this.drawOps) {
            let dd = d.export();

            let op = {};
            if (dd.jbwb) {
                op.jbwb = '更新' + i;
            }
            if (dd.bj) {
                op.bj = dd.bj + 0.01;
            }
            if (dd.kcwb) {
                op.kcwb = '更新' + i;
            }

            if (dd.lon && dd.lat) {
                dd.lon = dd.lon + 0.001;
                dd.lat = dd.lat + 0.0001;
                op.lon = dd.lon;
                op.lat = dd.lat;
            }

            if (dd.points) {
                op.points = dd.points;
                for (let point of op.points) {
                    point.lon = point.lon + 0.001;
                    point.lat = point.lat + 0.0001;
                }
            }
            this.mapFunction.mapApiService.updateDraw(d.code, op);
        }
    }

    changSize() {
        if (this.timer) {
            clearInterval(this.timer);
            this.timer = null;
        }
        let i = 10;
        let draws = this.mapFunction.mapApiService.drawPlotObjs;
        this.timer = setInterval(() => {
            i = i + 1;
            for (let key in draws) {
                let d = draws[key];
                this.mapFunction.mapApiService.dyPlotService.changSize(d, i, i);
            }
        }, 1000);
    }

    changColor() {
        this.mapFunction.mapApiService.dyPlotService.changeLineColor("#00FFE5");
    }

    setDrawScaleOptions() {
        let options = [
            {
                scales: [0, 50],
                width: 20,
                height: 20
            },
            {
                scales: [50, 500],
                width: 32,
                height: 32
            },
            {
                scales: [500, 10000],
                width: 64,
                height: 64
            }
        ]
        this.mapFunction.mapApiService.setDrawScaleOptions(options);
        alert('设置成功！')
    }

    render() {
        return (
            <div className={"example_draw_container"}>
                <h3>军标绘制/展示已有的军标数据</h3>
                <div className={"map_wrapper"}>
                    <GIS refs={
                        e => {
                            this.mapFunction = e
                        }
                    }
                         map2_5D={true}
                         useSvgIcon={true}
                         iconScales={[[0, 2000], [2000, 10000], [10000, 5000000]]}
                         plotUrl={this.state.plotUrl}
                         mapRef={this}
                         showDefaultLayer={true}
                    />
                </div>

                <p>

                    <span>条数：</span>
                    <Input
                        style={{width: '100px', display: 'inline-block'}}
                        placeholder={'请输入条数'}
                        defaultValue={this.state['drawCount']}
                        onChange={(v) => this.setState({drawCount: v.target.value})}
                    />
                </p>
                <p>

                    <span>频率（ms）：</span>
                    <Input
                        style={{width: '100px', display: 'inline-block'}}
                        placeholder={'请输入频率（ms）'}
                        defaultValue={this.state['rate']}
                        onChange={(v) => this.setState({rate: v.target.value})}
                    />
                    <br/>
                </p>
                <Button type="primary" onClick={this.startTimer.bind(this)}>开始</Button>
                <Button type="primary" onClick={this.stopTimer.bind(this)}>结束</Button>
                <div className={"code_wrapper"}>
                    <div dangerouslySetInnerHTML={{__html: this.state.htmlString}}></div>
                </div>
            </div>
        )
    }
}



```

 public/example/ExampleDrawDyPage.md

New file
@@ -0,0 +1,614 @@

### ExampleDrawDyPage 代码

```jsx
import React, {Component} from 'react'
import './ExampleDrawPage.css'
import {GIS} from "iclient3d-plot-diy";
import {Button, Input} from "antd";
import {timer} from "rxjs";


export default class ExampleDrawDyPage extends Component {


    optionObjs = {
        "目标简标": {
            allowPicking: false,
            code: '123123',
            bz: true,
            bzColor: '#e000ff',
            bzLineColor: '#ff0000',
            bzlx: 'simple',
            jbwb: 'R:00017',
            text: '123',
            showText: true,
            type: "2002",
            useModify: false,
            lon: 102.73054539488224, lat: 31.005468100060593, height: 0,
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "目标醒目": {
            allowPicking: false,
            bz: true,
            bzColor: '#0000FF',
            bzLineColor: '#000000',
            bzlx: 'simple',
            jbwb: 'R:00017',
            xz: true,
            xzColor: '#00ff00',
            xx: true,
            xxColor: '#ff0000',
            type: "2002",
            iconColor: '#dddddd',
            returnHeight: true,
            useModify: false,
            lon: 102.73554539488224, lat: 31.005068100060593, height: 0,
            points: []
        },
        "目标详标": {
            allowPicking: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'R:00017',
            xbwb: "17/10/2019\n16:45:8\n9260.00-10400.00MHZ",
            type: "2002",
            useModify: false,
            lon: 102.70054539488224, lat: 31.000468100060593, height: 0,
            points: [],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行简标": {
            allowPicking: false,
            bz: true,
            bzlx: 'simple',
            jbwb: "P:00019",
            type: "2010",
            useModify: false,
            lon: 102.76054539488224, lat: 31.000468100060593, height: 0,
            points: [{lon: 102.76554539488224, lat: 31.000468100060593, height: 0}, {
                lon: 102.76904539488224,
                lat: 30.992468100060593,
                height: 0
            }],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行详标": {
            allowPicking: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'P:00019',
            xbwb: "F16-1\n美国\n16:45:56\nR:00019\nC:00019",
            type: "2010",
            useModify: false,
            lon: 102.73054539488224, lat: 31.001068100060593, height: 0,
            points: [{lon: 102.73554539488224, lat: 31.001068100060593, height: 0}, {
                lon: 102.73904539488224,
                lat: 30.992468100060593,
                height: 0
            }],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗侦察区域": {
            allowPicking: false,
            type: "lddkzcqy",
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.72004539488224, lat: 31.001068100060593, height: 0,
            useModify: false,
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗干扰波束": {
            allowPicking: false,
            type: 'lddkgrps',
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.72004539488224, lat: 30.991068100060593, height: 0,
            useModify: false,
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗测向线": {
            allowPicking: false,
            type: "lddkcxx",
            kcwb: "10110",
            kcgls: 1,
            kcjd: 30,
            useModify: false,
            lon: 102.76054539488224, lat: 31.011068100060593, height: 0,
            points: []
        },
        "雷达对抗关系": {
            allowPicking: false,
            type: "lddkgx",
            kcwb: "10110",
            kcgls: 1,
            kcjd: 30,
            useModify: false,
            lon: 102.78054539488224,
            lat: 31.015068100060593,
            height: 0,
            points: []
        },
        "雷达对目标探测": {
            allowPicking: false,
            type: "lddmbtc",
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.71004539488224, lat: 30.990068100060593, height: 0,
            useModify: false,
        },
        "通信对抗侦察区域": {
            allowPicking: false,
            type: "txdkzcqy",
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.69804539488224, lat: 30.990068100060593, height: 0,
            useModify: false,
        },
        "通信对抗干扰波束": {
            allowPicking: false,
            type: "txdkgrps",
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.76004539488224, lat: 30.991068100060593, height: 0,
            useModify: false,
        },
        "通信对抗测向线": {
            allowPicking: false,
            type: "txdkcxx",
            kcgls: 1,
            kcjd: 30,
            kcwb: "10110",
            useModify: false,
            lon: 102.76854539488224, lat: 31.009068100060593, height: 0,
            points: []
        },
        "通信畅通区域": {
            allowPicking: false,
            type: 'txctqy',
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.71504539488224, lat: 30.980068100060593, height: 0,
            useModify: false,
        },
        "通信网标绘": {
            type: "txw",
            allowPicking: false,
            useModify: false,
            lon: 102.70854539488224, lat: 31.0098468100060593, height: 0,
            points: []
        },
        "光电对抗侦察区域": {
            type: 'gddkzcqy',
            allowPicking: false,
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.69054539488224, lat: 31.0098468100060593, height: 0,
            useModify: false,
        },
        "光电有源对抗干扰波束": {
            allowPicking: false,
            type: 'gdyydkgrbs',
            kcgls: 1,
            kcjd: 30,
            lon: 102.67054539488224, lat: 31.0098468100060593, height: 0,
            useModify: false,
        },
        "漫反射干扰区域": {
            allowPicking: false,
            type: 'mfsgrqy',
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.67054539488224, lat: 31.0028468100060593, height: 0,
            useModify: false,
        },
        '烟幕形成区域': {
            allowPicking: false,
            type: 'ymxcqy',
            points: [{lon: 102.64984, lat: 30.99237, height: 0},
                {lon: 102.66012682459443, lat: 30.995109020954718, height: 0},
                {lon: 102.67126799815856, lat: 30.98766239848537, height: 0},
                {lon: 102.64984, lat: 30.983747593478107, height: 0},
                {lon: 102.64984, lat: 30.99237, height: 0}],
            useModify: false,
        },
        "掩护区域": {
            allowPicking: false,
            type: 'yhqy',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.65927322610115, lat: 31.01540811637356, height: 0},
                {lon: 102.66192135373299, lat: 31.005988487769518, height: 0},
                {lon: 102.64755620178961, lat: 31.00246196283815, height: 0},
                {lon: 102.642853926199, lat: 31.012509646376447, height: 0}],
            useModify: false,
        },
        "协同关系": {
            allowPicking: false,
            type: 'xtgx',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.66192135373299, lat: 31.005988487769518, height: 0}],
            useModify: false,
        },
        "干扰线": {
            allowPicking: false,
            type: 'grx',
            points: [{lon: 102.732420985008, lat: 30.97556325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97504986175468, height: 0}],
            useModify: false
        },
        "预警线": {
            allowPicking: false,
            type: 'yjx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97956325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.98004986175468, height: 0}]
        },
        "目标分配线": {
            allowPicking: false,
            type: 'mbfpx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97756325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97804986175468, height: 0}]
        },

        "干扰关系线": {
            type: "grgxx",
            color: '#ffff00',
            useModify: false,
            points: [{
                lon: 104.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },

        "单色线": {
            type: "line",
            bklx: 'solid',
            bkkd: 4,
            color: '#64c324',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "双色线": {
            type: "line",
            bklx: 'double',
            bkkd: 4,
            color: '#ff0000',
            color2: '#0000ff',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "通信抗测向线2": {
            type: "txdkcxx2",
            kcjd: 120,
            kcgls: 10,
            kcwb: '123123',
            color: '#0059FFA3',
            lon: 103.73554539488224,
            lat: 31.005068100060593,
            height: 0,
            useModify: false,
            points: []
        },
        "团指任务分界线": {
            type: "tzrwfjx",
            color: '#D5013A',
            useModify: false,
            points: [{
                lon: 102.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "连指任务分界线": {
            type: "lzrwfjx",
            color: '#D5013A',
            useModify: false,
            points: [{
                lon: 102.45554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.45554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "干扰波束": {
            type: "grbs",
            color: '#D5013A',
            useModify: false,
            lon: 102.23554539488224,
            lat: 31.005068100060593,
            height: 0,
            qsjd: 30,
            zzjd: 130,
            bj: 100
        }
    }

    drawOps = [];
    timer = null;

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

    componentDidMount() {
        fetch('./example/ExampleDrawDyPage.md')
            .then(response => response.text())
            .then(mdText => {
                this.setState({htmlString: window.marked.parse(mdText)});
            });
    }


    async draw(option) {
        this.closeUpdate();
        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);
    }

    arr2;

    startTimer() {
        if (this.timer) {
            clearInterval(this.timer);
            this.timer = null;
        }

        let arr = [];
        let index = 0;
        for (let key in this.optionObjs) {
            if (!this.optionObjs[key].code) {
                this.optionObjs[key].code = this.optionObjs[key].type + ( index ++ );
            }
            arr.push(this.optionObjs[key]);
            // if (this.optionObjs[key] && this.optionObjs[key].lat) {
            //     arr.push(this.optionObjs[key]);
            // }
        }
        let arr2 = [];
        for (let i = 0; i < parseInt(this.state.drawCount + ''); i++) {
            let index = i % arr.length;
            let option = JSON.parse(JSON.stringify(arr[index]));
            option.lat = arr[index].lat + i * 0.0001;
            option.lon = arr[index].lon + i * 0.0001;
            option.code = option.type + i;
            arr2.push(option);
        }
        this.mapFunction.mapApiService.showDrawDatas(arr2);
        this.arr2 = arr2;

        let i = 0;
        this.timer = setInterval(() => {
            i++;
            for (let one of arr2) {
                let option;
                if (one && one.lat) {
                    // 表示航迹
                    if (one.points) {
                        option = {
                            points: one.points.map(point => {
                                return {
                                    lat: point.lat,
                                    lon: point.lon + i * 0.0001,
                                    height: point.height,
                                }
                            }),
                            allowPicking: one.allowPicking,
                        }
                    } else {
                        option = {
                            lat: one.lat,
                            lon: one.lon + i * 0.0001,
                            height: one.height,
                            allowPicking: one.allowPicking,
                        }
                    }
                } else if (one && one.points) {
                    option = {
                        points: one.points.map(point => {
                            return {
                                lat: point.lat,
                                lon: point.lon + i * 0.0001,
                                height: point.height,
                            }
                        }),
                        allowPicking: one.allowPicking,
                    }
                }

                this.mapFunction.mapApiService.updateDraw(one.code, option);
            }
        }, parseInt(this.state.rate + '') || 1000);
    }

    stopTimer() {
        if (this.timer) {
            clearInterval(this.timer);
            this.timer = null;
        }
        if (this.arr2) {
            for (let one of this.arr2) {
                this.mapFunction.mapApiService.removeDraw(one.code);
            }
            this.arr2 = null;
        }
    }


    updateOption(i) {
        for (let d of this.drawOps) {
            let dd = d.export();

            let op = {};
            if (dd.jbwb) {
                op.jbwb = '更新' + i;
            }
            if (dd.bj) {
                op.bj = dd.bj + 0.01;
            }
            if (dd.kcwb) {
                op.kcwb = '更新' + i;
            }

            if (dd.lon && dd.lat) {
                dd.lon = dd.lon + 0.001;
                dd.lat = dd.lat + 0.0001;
                op.lon = dd.lon;
                op.lat = dd.lat;
            }

            if (dd.points) {
                op.points = dd.points;
                for (let point of op.points) {
                    point.lon = point.lon + 0.001;
                    point.lat = point.lat + 0.0001;
                }
            }
            this.mapFunction.mapApiService.updateDraw(d.code, op);
        }
    }

    changSize() {
        if (this.timer) {
            clearInterval(this.timer);
            this.timer = null;
        }
        let i = 10;
        let draws = this.mapFunction.mapApiService.drawPlotObjs;
        this.timer = setInterval(() => {
            i = i + 1;
            for (let key in draws) {
                let d = draws[key];
                this.mapFunction.mapApiService.dyPlotService.changSize(d, i, i);
            }
        }, 1000);
    }

    changColor() {
        this.mapFunction.mapApiService.dyPlotService.changeLineColor("#00FFE5");
    }

    setDrawScaleOptions() {
        let options = [
            {
                scales: [0, 50],
                width: 20,
                height: 20
            },
            {
                scales: [50, 500],
                width: 32,
                height: 32
            },
            {
                scales: [500, 10000],
                width: 64,
                height: 64
            }
        ]
        this.mapFunction.mapApiService.setDrawScaleOptions(options);
        alert('设置成功！')
    }

    render() {
        return (
            <div className={"example_draw_container"}>
                <h3>军标绘制/展示已有的军标数据</h3>
                <div className={"map_wrapper"}>
                    <GIS refs={
                        e => {
                            this.mapFunction = e
                        }
                    }
                         map2_5D={true}
                         useSvgIcon={true}
                         iconScales={[[0, 2000], [2000, 10000], [10000, 5000000]]}
                         plotUrl={this.state.plotUrl}
                         mapRef={this}
                         showDefaultLayer={true}
                    />
                </div>

                <p>

                    <span>条数：</span>
                    <Input
                        style={{width: '100px', display: 'inline-block'}}
                        placeholder={'请输入条数'}
                        defaultValue={this.state['drawCount']}
                        onChange={(v) => this.setState({drawCount: v.target.value})}
                    />
                </p>
                <p>

                    <span>频率（ms）：</span>
                    <Input
                        style={{width: '100px', display: 'inline-block'}}
                        placeholder={'请输入频率（ms）'}
                        defaultValue={this.state['rate']}
                        onChange={(v) => this.setState({rate: v.target.value})}
                    />
                    <br/>
                </p>
                <Button type="primary" onClick={this.startTimer.bind(this)}>开始</Button>
                <Button type="primary" onClick={this.stopTimer.bind(this)}>结束</Button>
                <div className={"code_wrapper"}>
                    <div dangerouslySetInnerHTML={{__html: this.state.htmlString}}></div>
                </div>
            </div>
        )
    }
}



```

 public/example/ExampleDrawPage.md

@@ -14,7 +14,9 @@

    optionObjs = {
        "目标简标": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            code: '123123',
            bz: true,
            bzlx: 'simple',
@@ -27,7 +29,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "目标详标": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'R:00017',
@@ -39,7 +43,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行简标": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bz: true,
            bzlx: 'simple',
            jbwb: "P:00019",
@@ -54,7 +60,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行详标": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'P:00019',
@@ -70,7 +78,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗侦察区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "lddkzcqy",
            bj: 1,
            qsjd: 30,
@@ -80,7 +90,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗干扰波束": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'lddkgrps',
            bj: 1,
            qsjd: 30,
@@ -90,7 +102,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗测向线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "lddkcxx",
            kcwb: "10110",
            kcgls: 1,
@@ -100,7 +114,9 @@
            points: []
        },
        "雷达对抗关系": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "lddkgx",
            kcwb: "10110",
            kcgls: 1,
@@ -112,7 +128,9 @@
            points: []
        },
        "雷达对目标探测": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "lddmbtc",
            bj: 0.5,
            qsjd: 0,
@@ -121,7 +139,9 @@
            useModify: false,
        },
        "通信对抗侦察区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "txdkzcqy",
            bj: 0.5,
            qsjd: 0,
@@ -130,7 +150,9 @@
            useModify: false,
        },
        "通信对抗干扰波束": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "txdkgrps",
            bj: 1,
            qsjd: 30,
@@ -139,7 +161,9 @@
            useModify: false,
        },
        "通信对抗测向线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "txdkcxx",
            kcgls: 1,
            kcjd: 30,
@@ -149,7 +173,9 @@
            points: []
        },
        "通信畅通区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'txctqy',
            bj: 0.5,
            qsjd: 0,
@@ -159,14 +185,18 @@
        },
        "通信网标绘": {
            type: "txw",
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            useModify: false,
            lon: 102.70854539488224, lat: 31.0098468100060593, height: 0,
            points: []
        },
        "光电对抗侦察区域": {
            type: 'gddkzcqy',
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
@@ -174,7 +204,9 @@
            useModify: false,
        },
        "光电有源对抗干扰波束": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'gdyydkgrbs',
            kcgls: 1,
            kcjd: 30,
@@ -182,7 +214,9 @@
            useModify: false,
        },
        "漫反射干扰区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'mfsgrqy',
            bj: 1,
            qsjd: 30,
@@ -191,7 +225,9 @@
            useModify: false,
        },
        '烟幕形成区域': {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'ymxcqy',
            points: [{lon: 102.64984, lat: 30.99237, height: 0},
                {lon: 102.66012682459443, lat: 30.995109020954718, height: 0},
@@ -201,7 +237,9 @@
            useModify: false,
        },
        "掩护区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'yhqy',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.65927322610115, lat: 31.01540811637356, height: 0},
@@ -211,35 +249,45 @@
            useModify: false,
        },
        "协同关系": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'xtgx',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.66192135373299, lat: 31.005988487769518, height: 0}],
            useModify: false,
        },
        "干扰线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'grx',
            points: [{lon: 102.732420985008, lat: 30.97556325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97504986175468, height: 0}],
            useModify: false
        },
        "预警线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'yjx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97956325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.98004986175468, height: 0}]
        },
        "目标分配线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'mbfpx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97756325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97804986175468, height: 0}]
        },
        "目标醒目": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bz: true,
            xz: true,
            bzlx: 'simple',
@@ -441,6 +489,7 @@
                            this.mapFunction = e
                        }
                    }
                         map2_5D={true}
                         useSvgIcon={true}
                         iconScales={[[0, 2000], [2000, 10000], [10000, 5000000]]}
                         plotUrl={this.state.plotUrl}

 public/example/ExampleFlyPage.md

@@ -81,10 +81,12 @@
            "code": "ccccc",
            "bzlx": "simple",
            "jbwb": "R:00017",
            "xbwb": "R:00017312312\n123123",
            "type": "2010",
            "useModify": false,
            "lon": arr[0].lon,
            "lat": arr[0].lat,
            clampToGround: false,
            xz: true,
            "height": arr[0].height,
            points: []
@@ -93,6 +95,7 @@

        interval(300).pipe(take(120)).subscribe(number => {
            this.mapFunction.mapApiService.updateDraw("ccccc", {
                clampToGround: false,
                lon: arr[number].lon,
                lat: arr[number].lat,
                height: arr[number].height,

 public/example/ExampleXzxxPage.md

@@ -25,6 +25,8 @@
            lat: 31.005468100060593,
            height: 0,
            points: [],
            text: '123',
            showText: true,
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "目标醒目": {
@@ -34,6 +36,8 @@
            bzlx: 'simple',
            jbwb: 'R:00017',
            xz: true,
            text: '333333',
            showText: true,
            xzColor: '#00ff00',
            xx: true,
            xxColor: '#ff0000',
@@ -65,8 +69,25 @@
        "单色线": {
            type: "line",
            bklx: 'solid',
            bkkd: 2,
            color: '#e30000',
            useModify: false,
            points: [{
                lon: 103.72554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.72554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "双色线": {
            type: "line",
            bklx: 'double',
            bkkd: 4,
            color: '#64c324',
            color2: '#e30000',
            color: '#babaff',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
@@ -78,19 +99,19 @@
                height: 0,
            }]
        },
        "双色线": {
        "双色线2": {
            type: "line",
            bklx: 'double',
            bkkd: 4,
            color: '#ff0000',
            color2: '#0000ff',
            color2: '#e30000',
            color: '#baffba',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lon: 103.74554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lon: 104.74554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
@@ -229,6 +250,7 @@
                            this.mapFunction = e
                        }
                    }
                         map2_5D={true}
                         useSvgIcon={true}
                         iconScales={[[0, 2000], [2000, 10000], [10000, 5000000]]}
                         plotUrl={this.state.plotUrl}

 src/App.js

@@ -1,7 +1,7 @@
import React from 'react';
import MainPage from "./MainPage";
import FirstPage from "./FirstPage";
import ExamplePage from "./example/ExamplePage";
import {ExamplePage} from "./example/ExamplePage";
import ExampleBhPage from "./example/ExampleBhPage";
import ExampleCustomToolbarPage from "./example/ExampleCustomToolbarPage";
import ExampleI18nPage from "./example/ExampleI18nPage";
@@ -29,6 +29,7 @@
import Example2DDrawUpdatePage from "./example/Example2DDrawUpdatePage";
import ExampleBlinkPage from "./example/ExampleBlinkPage";
import ExampleDrawDyPage from "./example/ExampleDrawDyPage";
import ExampleDrawDy2Page from "./example/ExampleDrawDy2Page";

function App() {
    return (
@@ -60,6 +61,7 @@
                    <Route path="/example/map2dDrawUpdate" exact component={Example2DDrawUpdatePage}/>
                    <Route path="/example/blink" exact component={ExampleBlinkPage}/>
                    <Route path="/example/dydraw" exact component={ExampleDrawDyPage}/>
                    <Route path="/example/dy2draw" exact component={ExampleDrawDy2Page}/>
                    <Route path="/doc" exact component={DocPage}/>
                    <Route path="/doc/:page" exact component={DocPage}/>
                    <Route path="/test" exact component={TestPage}/>

 src/example/ExampleDrawDy2Page.js

New file
@@ -0,0 +1,613 @@
import React, {Component} from 'react'
import './ExampleDrawPage.css'
import {GIS} from "iclient3d-plot-diy";
import {Button, Input} from "antd";
import {timer} from "rxjs";


export default class ExampleDrawDy2Page extends Component {


    optionObjs = {
        "目标简标": {
            allowPicking: false,
            code: '123123',
            bz: true,
            bzColor: '#e000ff',
            bzLineColor: '#ff0000',
            bzlx: 'simple',
            jbwb: 'R:00017',
            type: "2002",
            returnHeight: true,
            useModify: false,
            lon: 102.73054539488224, lat: 31.005468100060593, height: 0,
            points: [],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "目标醒目": {
            allowPicking: false,
            bz: true,
            bzColor: '#0000FF',
            bzLineColor: '#000000',
            bzlx: 'simple',
            jbwb: 'R:00017',
            xz: true,
            xzColor: '#00ff00',
            xx: true,
            xxColor: '#ff0000',
            type: "2002",
            iconColor: '#dddddd',
            returnHeight: true,
            useModify: false,
            lon: 102.73554539488224, lat: 31.005068100060593, height: 0,
            points: []
        },
        "目标详标": {
            allowPicking: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'R:00017',
            xbwb: "17/10/2019\n16:45:8\n9260.00-10400.00MHZ",
            type: "2002",
            useModify: false,
            lon: 102.70054539488224, lat: 31.000468100060593, height: 0,
            points: [],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行简标": {
            allowPicking: false,
            bz: true,
            bzlx: 'simple',
            jbwb: "P:00019",
            type: "2010",
            useModify: false,
            lon: 102.76054539488224, lat: 31.000468100060593, height: 0,
            points: [{lon: 102.76554539488224, lat: 31.000468100060593, height: 0}, {
                lon: 102.76904539488224,
                lat: 30.992468100060593,
                height: 0
            }],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行详标": {
            allowPicking: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'P:00019',
            xbwb: "F16-1\n美国\n16:45:56\nR:00019\nC:00019",
            type: "2010",
            useModify: false,
            lon: 102.73054539488224, lat: 31.001068100060593, height: 0,
            points: [
                {lon: 102.73554539488224, lat: 31.001068100060593, height: 0},
                {lon: 102.73904539488224, lat: 30.992468100060593, height: 0}
            ],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗侦察区域": {
            allowPicking: false,
            type: "lddkzcqy",
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.72004539488224, lat: 31.001068100060593, height: 0,
            useModify: false,
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗干扰波束": {
            allowPicking: false,
            type: 'lddkgrps',
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.72004539488224, lat: 30.991068100060593, height: 0,
            useModify: false,
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗测向线": {
            allowPicking: false,
            type: "lddkcxx",
            kcwb: "10110",
            kcgls: 1,
            kcjd: 30,
            useModify: false,
            lon: 102.76054539488224, lat: 31.011068100060593, height: 0,
            points: []
        },
        "雷达对抗关系": {
            allowPicking: false,
            type: "lddkgx",
            kcwb: "10110",
            kcgls: 1,
            kcjd: 30,
            useModify: false,
            lon: 102.78054539488224,
            lat: 31.015068100060593,
            height: 0,
            points: []
        },
        "雷达对目标探测": {
            allowPicking: false,
            type: "lddmbtc",
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.71004539488224, lat: 30.990068100060593, height: 0,
            useModify: false,
        },
        "通信对抗侦察区域": {
            allowPicking: false,
            type: "txdkzcqy",
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.69804539488224, lat: 30.990068100060593, height: 0,
            useModify: false,
        },
        "通信对抗干扰波束": {
            allowPicking: false,
            type: "txdkgrps",
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.76004539488224, lat: 30.991068100060593, height: 0,
            useModify: false,
        },
        "通信对抗测向线": {
            allowPicking: false,
            type: "txdkcxx",
            kcgls: 1,
            kcjd: 30,
            kcwb: "10110",
            useModify: false,
            lon: 102.76854539488224, lat: 31.009068100060593, height: 0,
            points: []
        },
        "通信畅通区域": {
            allowPicking: false,
            type: 'txctqy',
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.71504539488224, lat: 30.980068100060593, height: 0,
            useModify: false,
        },
        "通信网标绘": {
            type: "txw",
            allowPicking: false,
            useModify: false,
            lon: 102.70854539488224, lat: 31.0098468100060593, height: 0,
            points: []
        },
        "光电对抗侦察区域": {
            type: 'gddkzcqy',
            allowPicking: false,
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
            lon: 102.69054539488224, lat: 31.0098468100060593, height: 0,
            useModify: false,
        },
        "光电有源对抗干扰波束": {
            allowPicking: false,
            type: 'gdyydkgrbs',
            kcgls: 1,
            kcjd: 30,
            lon: 102.67054539488224, lat: 31.0098468100060593, height: 0,
            useModify: false,
        },
        "漫反射干扰区域": {
            allowPicking: false,
            type: 'mfsgrqy',
            bj: 1,
            qsjd: 30,
            zzjd: 75,
            lon: 102.67054539488224, lat: 31.0028468100060593, height: 0,
            useModify: false,
        },
        '烟幕形成区域': {
            allowPicking: false,
            type: 'ymxcqy',
            points: [{lon: 102.64984, lat: 30.99237, height: 0},
                {lon: 102.66012682459443, lat: 30.995109020954718, height: 0},
                {lon: 102.67126799815856, lat: 30.98766239848537, height: 0},
                {lon: 102.64984, lat: 30.983747593478107, height: 0},
                {lon: 102.64984, lat: 30.99237, height: 0}],
            useModify: false,
        },
        "掩护区域": {
            allowPicking: false,
            type: 'yhqy',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.65927322610115, lat: 31.01540811637356, height: 0},
                {lon: 102.66192135373299, lat: 31.005988487769518, height: 0},
                {lon: 102.64755620178961, lat: 31.00246196283815, height: 0},
                {lon: 102.642853926199, lat: 31.012509646376447, height: 0}],
            useModify: false,
        },
        "协同关系": {
            allowPicking: false,
            type: 'xtgx',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.66192135373299, lat: 31.005988487769518, height: 0}],
            useModify: false,
        },
        "干扰线": {
            allowPicking: false,
            type: 'grx',
            points: [{lon: 102.732420985008, lat: 30.97556325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97504986175468, height: 0}],
            useModify: false
        },
        "预警线": {
            allowPicking: false,
            type: 'yjx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97956325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.98004986175468, height: 0}]
        },
        "目标分配线": {
            allowPicking: false,
            type: 'mbfpx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97756325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97804986175468, height: 0}]
        },

        "干扰关系线": {
            type: "grgxx",
            color: '#ffff00',
            useModify: false,
            points: [{
                lon: 104.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },

        "单色线": {
            type: "line",
            bklx: 'solid',
            bkkd: 4,
            color: '#64c324',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "双色线": {
            type: "line",
            bklx: 'double',
            bkkd: 4,
            color: '#ff0000',
            color2: '#0000ff',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "通信抗测向线2": {
            type: "txdkcxx2",
            kcjd: 120,
            kcgls: 10,
            kcwb: '123123',
            color: '#0059FFA3',
            lon: 103.73554539488224,
            lat: 31.005068100060593,
            height: 0,
            useModify: false,
            points: []
        },
        "团指任务分界线": {
            type: "tzrwfjx",
            color: '#D5013A',
            useModify: false,
            points: [{
                lon: 102.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "连指任务分界线": {
            type: "lzrwfjx",
            color: '#D5013A',
            useModify: false,
            points: [{
                lon: 102.45554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.45554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "干扰波束": {
            type: "grbs",
            color: '#D5013A',
            useModify: false,
            lon: 102.23554539488224,
            lat: 31.005068100060593,
            height: 0,
            qsjd: 30,
            zzjd: 130,
            bj: 100
        }
    }

    drawOps = [];
    timer = null;

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

    componentDidMount() {
        fetch('./example/ExampleDrawDyPage.md')
            .then(response => response.text())
            .then(mdText => {
                this.setState({htmlString: window.marked.parse(mdText)});
            });
    }


    async draw(option) {
        this.closeUpdate();
        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);
    }

    arr2;

    startTimer() {
        if (this.timer) {
            clearInterval(this.timer);
            this.timer = null;
        }

        let arr = [];
        let index = 0;
        for (let key in this.optionObjs) {
            if (!this.optionObjs[key].code) {
                this.optionObjs[key].code = this.optionObjs[key].type + (index++);
            }
            arr.push(this.optionObjs[key]);
            // if (this.optionObjs[key] && this.optionObjs[key].lat) {
            //     arr.push(this.optionObjs[key]);
            // }
        }
        let arr2 = [];
        for (let i = 0; i < parseInt(this.state.drawCount + ''); i++) {
            let index = i % arr.length;
            let option = JSON.parse(JSON.stringify(arr[index]));
            option.lat = arr[index].lat + i * 0.0001;
            option.lon = arr[index].lon + i * 0.0001;
            option.code = option.type + i;
            arr2.push(option);
        }
        this.mapFunction.mapApiService.showDrawDatas(arr2);
        this.arr2 = arr2;

        let i = 0;
        this.timer = setInterval(() => {
            i++;
            for (let one of arr2) {
                let option;
                if (one && one.lat) {
                    // 表示航迹
                    if (one.points && one.points.length > 0) {
                        option = Object.assign({}, one);
                        one.points.push({
                            lat: one.lat,
                            lon: one.lon,
                            height: one.height,
                        });
                        one.lat = one.lat + 0.0001;
                        one.lon = one.lon + 0.0001;

                        option = one;
                    } else {
                        one.lat = one.lat + 0.0001;
                        option = one;
                        // option = {
                        //     lat: one.lat,
                        //     lon: one.lon + i * 0.0001,
                        //     height: one.height,
                        //     allowPicking: one.allowPicking,
                        // }
                    }
                } else if (one && one.points) {
                    one.points = one.points.map(point => {
                        return {
                            lat: point.lat,
                            lon: point.lon + i * 0.0001,
                            height: point.height,
                        }
                    })
                    option = one;
                }


                if (i % 10 == 0) {
                    this.mapFunction.mapApiService.removeDraw(one.code);
                    this.mapFunction.mapApiService.showDrawDatas([one]);
                } else {
                    this.mapFunction.mapApiService.updateDraw(one.code, option);
                }
            }
        }, parseInt(this.state.rate + '') || 1000);
    }

    stopTimer() {
        if (this.timer) {
            clearInterval(this.timer);
            this.timer = null;
        }
        if (this.arr2) {
            for (let one of this.arr2) {
                this.mapFunction.mapApiService.removeDraw(one.code);
            }
            this.arr2 = null;
        }
    }


    updateOption(i) {
        for (let d of this.drawOps) {
            let dd = d.export();

            let op = {};
            if (dd.jbwb) {
                op.jbwb = '更新' + i;
            }
            if (dd.bj) {
                op.bj = dd.bj + 0.01;
            }
            if (dd.kcwb) {
                op.kcwb = '更新' + i;
            }

            if (dd.lon && dd.lat) {
                dd.lon = dd.lon + 0.001;
                dd.lat = dd.lat + 0.0001;
                op.lon = dd.lon;
                op.lat = dd.lat;
            }

            if (dd.points) {
                op.points = dd.points;
                for (let point of op.points) {
                    point.lon = point.lon + 0.001;
                    point.lat = point.lat + 0.0001;
                }
            }
            this.mapFunction.mapApiService.updateDraw(d.code, op);
        }
    }

    changSize() {
        if (this.timer) {
            clearInterval(this.timer);
            this.timer = null;
        }
        let i = 10;
        let draws = this.mapFunction.mapApiService.drawPlotObjs;
        this.timer = setInterval(() => {
            i = i + 1;
            for (let key in draws) {
                let d = draws[key];
                this.mapFunction.mapApiService.dyPlotService.changSize(d, i, i);
            }
        }, 1000);
    }

    changColor() {
        this.mapFunction.mapApiService.dyPlotService.changeLineColor("#00FFE5");
    }

    setDrawScaleOptions() {
        let options = [
            {
                scales: [0, 50],
                width: 20,
                height: 20
            },
            {
                scales: [50, 500],
                width: 32,
                height: 32
            },
            {
                scales: [500, 10000],
                width: 64,
                height: 64
            }
        ]
        this.mapFunction.mapApiService.setDrawScaleOptions(options);
        alert('设置成功！')
    }

    render() {
        return (
            <div className={"example_draw_container"}>
                <h3>军标绘制/展示已有的军标数据</h3>
                <div className={"map_wrapper"}>
                    <GIS refs={
                        e => {
                            this.mapFunction = e
                        }
                    }
                         map2_5D={true}
                         useSvgIcon={true}
                         iconScales={[[0, 2000], [2000, 10000], [10000, 5000000]]}
                         plotUrl={this.state.plotUrl}
                         mapRef={this}
                         showDefaultLayer={true}
                    />
                </div>

                <p>

                    <span>条数：</span>
                    <Input
                        style={{width: '100px', display: 'inline-block'}}
                        placeholder={'请输入条数'}
                        defaultValue={this.state['drawCount']}
                        onChange={(v) => this.setState({drawCount: v.target.value})}
                    />
                </p>
                <p>

                    <span>频率（ms）：</span>
                    <Input
                        style={{width: '100px', display: 'inline-block'}}
                        placeholder={'请输入频率（ms）'}
                        defaultValue={this.state['rate']}
                        onChange={(v) => this.setState({rate: v.target.value})}
                    />
                    <br/>
                </p>
                <Button type="primary" onClick={this.startTimer.bind(this)}>开始</Button>
                <Button type="primary" onClick={this.stopTimer.bind(this)}>结束</Button>
                <div className={"code_wrapper"}>
                    <div dangerouslySetInnerHTML={{__html: this.state.htmlString}}></div>
                </div>
            </div>
        )
    }
}



 src/example/ExampleDrawDyPage.js

@@ -13,14 +13,34 @@
            allowPicking: false,
            code: '123123',
            bz: true,
            bzColor: '#e000ff',
            bzLineColor: '#ff0000',
            bzlx: 'simple',
            jbwb: 'R:00017',
            text: '123',
            showText: true,
            type: "2002",
            returnHeight: true,
            useModify: false,
            lon: 102.73054539488224, lat: 31.005468100060593, height: 0,
            points: [],
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "目标醒目": {
            allowPicking: false,
            bz: true,
            bzColor: '#0000FF',
            bzLineColor: '#000000',
            bzlx: 'simple',
            jbwb: 'R:00017',
            xz: true,
            xzColor: '#00ff00',
            xx: true,
            xxColor: '#ff0000',
            type: "2002",
            iconColor: '#dddddd',
            returnHeight: true,
            useModify: false,
            lon: 102.73554539488224, lat: 31.005068100060593, height: 0,
            points: []
        },
        "目标详标": {
            allowPicking: false,
@@ -234,18 +254,106 @@
            points: [{lon: 102.732420985008, lat: 30.97756325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97804986175468, height: 0}]
        },
        "目标醒目": {
            allowPicking: false,
            bz: true,
            xz: true,
            bzlx: 'simple',
            jbwb: 'R:00017',
            type: "2002",
            returnHeight: true,

        "干扰关系线": {
            type: "grgxx",
            color: '#ffff00',
            useModify: false,
            lon: 102.73554539488224, lat: 31.005068100060593, height: 0,
            points: [{
                lon: 104.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },

        "单色线": {
            type: "line",
            bklx: 'solid',
            bkkd: 4,
            color: '#64c324',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "双色线": {
            type: "line",
            bklx: 'double',
            bkkd: 4,
            color: '#ff0000',
            color2: '#0000ff',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "通信抗测向线2": {
            type: "txdkcxx2",
            kcjd: 120,
            kcgls: 10,
            kcwb: '123123',
            color: '#0059FFA3',
            lon: 103.73554539488224,
            lat: 31.005068100060593,
            height: 0,
            useModify: false,
            points: []
        },
        "团指任务分界线": {
            type: "tzrwfjx",
            color: '#D5013A',
            useModify: false,
            points: [{
                lon: 102.73554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.73554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "连指任务分界线": {
            type: "lzrwfjx",
            color: '#D5013A',
            useModify: false,
            points: [{
                lon: 102.45554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 103.45554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "干扰波束": {
            type: "grbs",
            color: '#D5013A',
            useModify: false,
            lon: 102.23554539488224,
            lat: 31.005068100060593,
            height: 0,
            qsjd: 30,
            zzjd: 130,
            bj: 100
        }
    }

    drawOps = [];
@@ -255,8 +363,8 @@
        super(props);
        this.state = {
            htmlString: '<h3>正在加载中...</h3>',
            rate: 200,
            drawCount: 150
            rate: 1000,
            drawCount: 100
        };
    }

@@ -292,9 +400,10 @@
        }

        let arr = [];
        let index = 0;
        for (let key in this.optionObjs) {
            if (!this.optionObjs[key].code) {
                this.optionObjs[key].code = this.optionObjs[key].type;
                this.optionObjs[key].code = this.optionObjs[key].type + ( index ++ );
            }
            arr.push(this.optionObjs[key]);
            // if (this.optionObjs[key] && this.optionObjs[key].lat) {
@@ -319,11 +428,25 @@
            for (let one of arr2) {
                let option;
                if (one && one.lat) {
                    // 表示航迹
                    if (one.points) {
                        option = {
                            points: one.points.map(point => {
                                return {
                                    lat: point.lat,
                                    lon: point.lon + i * 0.0001,
                                    height: point.height,
                                }
                            }),
                            allowPicking: one.allowPicking,
                        }
                    } else {
                    option = {
                        lat: one.lat,
                        lon: one.lon + i * 0.0001,
                        height: one.height,
                        allowPicking: one.allowPicking,
                        }
                    }
                } else if (one && one.points) {
                    option = {
@@ -442,6 +565,7 @@
                            this.mapFunction = e
                        }
                    }
                         map2_5D={true}
                         useSvgIcon={true}
                         iconScales={[[0, 2000], [2000, 10000], [10000, 5000000]]}
                         plotUrl={this.state.plotUrl}

 src/example/ExampleDrawPage.js

@@ -10,7 +10,9 @@

    optionObjs = {
        "目标简标": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            code: '123123',
            bz: true,
            bzlx: 'simple',
@@ -23,7 +25,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "目标详标": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'R:00017',
@@ -35,7 +39,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行简标": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bz: true,
            bzlx: 'simple',
            jbwb: "P:00019",
@@ -50,7 +56,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "飞行详标": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bz: true,
            bzlx: 'detail',
            jbwb: 'P:00019',
@@ -66,7 +74,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗侦察区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "lddkzcqy",
            bj: 1,
            qsjd: 30,
@@ -76,7 +86,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗干扰波束": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'lddkgrps',
            bj: 1,
            qsjd: 30,
@@ -86,7 +98,9 @@
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "雷达对抗测向线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "lddkcxx",
            kcwb: "10110",
            kcgls: 1,
@@ -96,7 +110,9 @@
            points: []
        },
        "雷达对抗关系": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "lddkgx",
            kcwb: "10110",
            kcgls: 1,
@@ -108,7 +124,9 @@
            points: []
        },
        "雷达对目标探测": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "lddmbtc",
            bj: 0.5,
            qsjd: 0,
@@ -117,7 +135,9 @@
            useModify: false,
        },
        "通信对抗侦察区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "txdkzcqy",
            bj: 0.5,
            qsjd: 0,
@@ -126,7 +146,9 @@
            useModify: false,
        },
        "通信对抗干扰波束": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "txdkgrps",
            bj: 1,
            qsjd: 30,
@@ -135,7 +157,9 @@
            useModify: false,
        },
        "通信对抗测向线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: "txdkcxx",
            kcgls: 1,
            kcjd: 30,
@@ -145,7 +169,9 @@
            points: []
        },
        "通信畅通区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'txctqy',
            bj: 0.5,
            qsjd: 0,
@@ -155,14 +181,18 @@
        },
        "通信网标绘": {
            type: "txw",
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            useModify: false,
            lon: 102.70854539488224, lat: 31.0098468100060593, height: 0,
            points: []
        },
        "光电对抗侦察区域": {
            type: 'gddkzcqy',
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bj: 0.5,
            qsjd: 0,
            zzjd: 360,
@@ -170,7 +200,9 @@
            useModify: false,
        },
        "光电有源对抗干扰波束": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'gdyydkgrbs',
            kcgls: 1,
            kcjd: 30,
@@ -178,7 +210,9 @@
            useModify: false,
        },
        "漫反射干扰区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'mfsgrqy',
            bj: 1,
            qsjd: 30,
@@ -187,7 +221,9 @@
            useModify: false,
        },
        '烟幕形成区域': {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'ymxcqy',
            points: [{lon: 102.64984, lat: 30.99237, height: 0},
                {lon: 102.66012682459443, lat: 30.995109020954718, height: 0},
@@ -197,7 +233,9 @@
            useModify: false,
        },
        "掩护区域": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'yhqy',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.65927322610115, lat: 31.01540811637356, height: 0},
@@ -207,35 +245,45 @@
            useModify: false,
        },
        "协同关系": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'xtgx',
            points: [{lon: 102.642853926199, lat: 31.012509646376447, height: 0},
                {lon: 102.66192135373299, lat: 31.005988487769518, height: 0}],
            useModify: false,
        },
        "干扰线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'grx',
            points: [{lon: 102.732420985008, lat: 30.97556325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97504986175468, height: 0}],
            useModify: false
        },
        "预警线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'yjx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97956325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.98004986175468, height: 0}]
        },
        "目标分配线": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            type: 'mbfpx',
            useModify: false,
            points: [{lon: 102.732420985008, lat: 30.97756325857848, height: 0},
                {lon: 102.73983041603873, lat: 30.97804986175468, height: 0}]
        },
        "目标醒目": {
            allowPicking: false,
            // allowPicking: false,
            // show: false,
            // clampToGround: false,
            bz: true,
            xz: true,
            bzlx: 'simple',
@@ -437,6 +485,7 @@
                            this.mapFunction = e
                        }
                    }
                         map2_5D={true}
                         useSvgIcon={true}
                         iconScales={[[0, 2000], [2000, 10000], [10000, 5000000]]}
                         plotUrl={this.state.plotUrl}

 src/example/ExampleFlyPage.js

@@ -77,10 +77,12 @@
            "code": "ccccc",
            "bzlx": "simple",
            "jbwb": "R:00017",
            "xbwb": "R:00017312312\n123123",
            "type": "2010",
            "useModify": false,
            "lon": arr[0].lon,
            "lat": arr[0].lat,
            clampToGround: false,
            xz: true,
            "height": arr[0].height,
            points: []
@@ -89,6 +91,7 @@

        interval(300).pipe(take(120)).subscribe(number => {
            this.mapFunction.mapApiService.updateDraw("ccccc", {
                clampToGround: false,
                lon: arr[number].lon,
                lat: arr[number].lat,
                height: arr[number].height,

 src/example/ExamplePage.js

@@ -2,11 +2,11 @@
import './ExamplePage.css'
import {NavLink} from "react-router-dom";
import "./ExampleLayerPage.css";
import {Button, Input} from "antd";
import {Button, Input, Checkbox} from "antd";
import {updateLanguage} from "iclient3d-plot-diy";


export default class ExamplePage extends Component {
export class ExamplePage extends Component {
    constructor(props) {
        super(props);
        this.state = {
@@ -15,6 +15,7 @@
            imageUrl: localStorage.getItem('plot_image') || '',
            demUrl: localStorage.getItem('plot_dem') || '',
            addressSearchUrl: localStorage.getItem('addressSearchUrl') || '',
            sctValue: 'true' === (localStorage.getItem('plot_dem_sct') || 'true'),
        };
    }

@@ -34,6 +35,11 @@
    updateDemUrl(event) {
        localStorage.setItem('plot_dem', this.state.demUrl || '');
        alert('plotUrl服务地址设置成功');
    }

    updateSctValue(event) {
        localStorage.setItem('plot_dem_sct', this.state.sctValue + '');
        alert('sctValue设置成功');
    }

    updateAddressSearchUrl(event) {
@@ -83,6 +89,7 @@
                    <li><NavLink to='/example/map2dDrawUpdate'>2d画图更新</NavLink></li>
                    <li><NavLink to='/example/blink'>闪烁</NavLink></li>
                    <li><NavLink to='/example/dydraw'>移动式</NavLink></li>
                    <li><NavLink to='/example/dy2draw'>移动式2</NavLink></li>
                </ul>
                <div className={"button_wrapper"}>

@@ -113,7 +120,16 @@
                            defaultValue={this.state['demUrl']}
                            onChange={(v) => this.setState({demUrl: v.target.value})}
                        />
                        <Button type="primary" onClick={this.updateDemUrl.bind(this)}>设置</Button>

                        <Checkbox
                            style={{marginLeft: '10px'}}
                            checked={this.state.sctValue}
                            onChange={(e) => this.setState({sctValue: e.target.checked})}
                        ></Checkbox>Sct
                        <Button type="primary" onClick={() => {
                            this.updateDemUrl();
                            this.updateSctValue();
                        }}>设置</Button>
                    </Input.Group>
                    <br/>


 src/example/ExampleXzxxPage.js

@@ -21,6 +21,8 @@
            lat: 31.005468100060593,
            height: 0,
            points: [],
            text: '123',
            showText: true,
            iconSize: [[20, 20], [30, 30], [40, 40]]
        },
        "目标醒目": {
@@ -30,6 +32,8 @@
            bzlx: 'simple',
            jbwb: 'R:00017',
            xz: true,
            text: '333333',
            showText: true,
            xzColor: '#00ff00',
            xx: true,
            xxColor: '#ff0000',
@@ -61,8 +65,25 @@
        "单色线": {
            type: "line",
            bklx: 'solid',
            bkkd: 2,
            color: '#e30000',
            useModify: false,
            points: [{
                lon: 103.72554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.72554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
        },
        "双色线": {
            type: "line",
            bklx: 'double',
            bkkd: 4,
            color: '#64c324',
            color2: '#e30000',
            color: '#babaff',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
@@ -74,19 +95,19 @@
                height: 0,
            }]
        },
        "双色线": {
        "双色线2": {
            type: "line",
            bklx: 'double',
            bkkd: 4,
            color: '#ff0000',
            color2: '#0000ff',
            color2: '#e30000',
            color: '#baffba',
            useModify: false,
            points: [{
                lon: 103.73554539488224,
                lon: 103.74554539488224,
                lat: 31.005068100060593,
                height: 0,
            }, {
                lon: 104.73554539488224,
                lon: 104.74554539488224,
                lat: 32.005068100060593,
                height: 0,
            }]
@@ -225,6 +246,7 @@
                            this.mapFunction = e
                        }
                    }
                         map2_5D={true}
                         useSvgIcon={true}
                         iconScales={[[0, 2000], [2000, 10000], [10000, 5000000]]}
                         plotUrl={this.state.plotUrl}