通用工具添加

nnnjjj123

2020-11-13 e6392006d035a223e8590f5783a3cf51472c77c3

通用工具添加

 widgets/CoorPosition/Widget.html

New file
@@ -0,0 +1,43 @@
<div class="jimu-widget-CoorPosition">
    <div class="CoorPosition-zbdw" id="CoorPosition-zbdw">
        <span class="CoorPosition-zbdw-pic"></span>
        <div class="CoorPosition-zbdw-zbdw">坐标定位</div>
        <span class="CoorPosition-zbdw-x">x</span>
    </div>
    <div class="CoorPosition-input">
        <div class="CoorPosition-input-JD mouseenterJD">
            <div class="jingDu">经度<input id="jingdu-val" value="114.93" type="text" class="jingDu-input"></div>
            <div class="jiantou jinddu">
                <span class="span-jiantou" id="jingdu-th">
                    <img class="leftjiantou" src="./images/leftjiantou.png" alt="">
                </span>
                <span class="span-jiantou twojiantou" id="jingdu-td">
                    <img class="leftjiantou" src="./images/rightjiantou.png" alt="">
                </span>
            </div>
        </div>
        <div class="CoorPosition-input-JD mouseenterED">
            <div class="jingDu">纬度<input id="weidu-val" value="25.83" type="text" class="jingDu-input"></div>
            <div class="jiantou weidu">
                <span class="span-jiantou" id="weidu-th">
                    <img class="leftjiantou" src="./images/leftjiantou.png" alt="">
                </span>
                <span class="span-jiantou twojiantou" id="weidu-td">
                    <img class="leftjiantou" src="./images/rightjiantou.png" alt="">
                </span>
            </div>
        </div>
        <div class="CoorPosition-input-JD mouseenterGD">
            <div class="jingDu">高度<input id="gaodu-val" value="1286" type="text" class="jingDu-input"></div>
            <div class="jiantou gaodu">
                <span class="span-jiantou" id="gaodu-th">
                    <img class="leftjiantou" src="./images/leftjiantou.png" alt="">
                </span>
                <span class="span-jiantou twojiantou" id="gaodu-td">
                    <img class="leftjiantou" src="./images/rightjiantou.png" alt="">
                </span>
            </div>
        </div>
    </div>
    <button class="queDing">确定</button>
</div>

 widgets/CoorPosition/Widget.js

New file
@@ -0,0 +1,139 @@
define([
    'dojo/_base/declare',
    'dojo/_base/lang',
    'dojo/_base/array',
    'dojo/_base/html',
    'dojo/topic',
    'jimu/BaseWidget',
],
    function (declare,
        lang,
        array,
        html,
        topic,
        BaseWidget
    ) {
        return declare([BaseWidget], {
            baseClass: 'jimu-widget-CoorPosition',
            name: 'CoorPosition',
            startup: function () {
                var that = this;
                // 点击x隐藏面板
                $('.CoorPosition-zbdw-x').click(function () {
                    $('.jimu-widget-CoorPosition').hide();
                })

                // 鼠标移入显示箭头
                $('.mouseenterJD').mouseenter(function () {
                    $('.jiantou.jinddu').css('display', 'block');
                })
                $('.mouseenterJD').mouseleave(function () {
                    $('.jiantou.jinddu').css('display', 'none');
                })

                $('.mouseenterED').mouseenter(function () {
                    $('.jiantou.weidu').css('display', 'block');
                })
                $('.mouseenterED').mouseleave(function () {
                    $('.jiantou.weidu').css('display', 'none');
                })

                $('.mouseenterGD').mouseenter(function () {
                    $('.jiantou.gaodu').css('display', 'block');
                })
                $('.mouseenterGD').mouseleave(function () {
                    $('.jiantou.gaodu').css('display', 'none');
                })

                // 点击箭头增加或减少数字
                $('#jingdu-th').click(function () {
                    $('#jingdu-val').val(parseInt($('#jingdu-val').val()) + 1);
                })
                $('#jingdu-td').click(function () {
                    $('#jingdu-val').val(parseInt($('#jingdu-val').val()) - 1);
                })

                $('#weidu-th').click(function () {
                    $('#weidu-val').val(parseInt($('#weidu-val').val()) + 1);
                })
                $('#weidu-td').click(function () {
                    $('#weidu-val').val(parseInt($('#weidu-val').val()) - 1);
                })
                $('#gaodu-th').click(function () {
                    $('#gaodu-val').val(parseInt($('#gaodu-val').val()) + 1);
                })
                $('#gaodu-td').click(function () {
                    $('#gaodu-val').val(parseInt($('#gaodu-val').val()) - 1);
                })

                // 拖拽盒子
                $('.CoorPosition-zbdw').mousedown(function (e) {
                    var positionDiv = $(this).offset();
                    var distenceX = e.pageX - positionDiv.left;
                    var distenceY = e.pageY - positionDiv.top;

                    $(document).mousemove(function (e) {
                        var x = e.pageX - distenceX;
                        var y = e.pageY - distenceY;
                        if (x < 0) {
                            x = 0;
                        } else if (x > $(document).width() - $('.CoorPosition-zbdw').outerWidth(true)) {
                            x = $(document).width() - $('.CoorPosition-zbdw').outerWidth(true);
                        }
                        if (y < 0) {
                            y = 0;
                        } else if (y > $(document).height() - $('.CoorPosition-zbdw').outerHeight(true)) {
                            y = $(document).height() - $('.jimu-widget-CoorPosition').outerHeight(true);
                        }
                        $('.jimu-widget-CoorPosition').css({
                            'left': x + 'px',
                            'top': y + 'px'
                        });
                    });
                    $(document).mouseup(function () {
                        $(document).off('mousemove');
                    });
                });

                // 点击确定flyTo
                $('.queDing').click(function () {
                    console.log($('#jingdu-val').val());
                    var lng = $('#jingdu-val').val();
                    var lat = $('#weidu-val').val();
                    var gaodu = $('#gaodu-val').val();
                    that.map.camera.flyTo({
                        destination: Cesium.Cartesian3.fromDegrees(lng, lat, gaodu)
                    });
                })

            },

            onOpen: function () {

            },

            onClose: function () {
                //面板关闭的时候触发 （when this panel is closed trigger）
            },

            onMinimize: function () {
                this.resize();
            },

            onMaximize: function () {
                this.resize();
            },

            resize: function () {

            },

            destroy: function () {
                //销毁的时候触发
                //todo
                //do something before this func
                this.inherited(arguments);
            }

        });
    });

 widgets/CoorPosition/css/style.css

New file
@@ -0,0 +1,129 @@
.jimu-widget-CoorPosition{
  background-color: #36403d;
  font-size: 14px;
  border: 1px solid rgb(69, 154, 251);
  color: rgb(238, 235, 235);
  font-size: 16px;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  display: none;
  box-sizing: border-box;
}

.CoorPosition-zbdw {
  position: relative;
  width: 100%;
  height: 33px;
  border-bottom: 1px solid rgb(69, 154, 251);
  padding: 0 25px;
  cursor: move;
}

.CoorPosition-zbdw-pic {
  position: absolute;
  left: 6px;
  top: 9px;
  width: 15px;
  height: 13px;
  background: url(../../../images/toolbox.png ) no-repeat 0 -32px;
}

.CoorPosition-zbdw-zbdw {
  width: 100%;
  line-height: 33px;
  font-size: 14px;
}

.CoorPosition-zbdw-x {
  position: absolute;
  right: 6px;
  top: 5px;
  width: 10px;
  font-size: 18px;
  cursor: pointer;
}

.CoorPosition-input {
  width: 100%;
  /* background-color: blue; */
  padding: 8px 5px;
  font-size: 14px;
}

.CoorPosition-input-JD {
  position: relative;
  width: 100%;
  height: 28px;
  background-color: #3a464c;
  margin-bottom: 3px;
  text-align: center;
}

.jingDu {
  line-height: 28px;
}

.jingDu-input {
  display: inline-block;
  background-color: #3a464c;
  border: none;
  text-indent: 2em;
  caret-color:#fff;
  color: #fff;
}

.queDing {
  background-color: #244959;
  border: none;
  color: #fff;
  margin-left: 160px;
  padding: 5px;
  cursor: pointer;
}

.jiantou {
  position: absolute;
  top: 4px;
  right: 15px;
  width: 15px;
  height: 20px;
  background-color: #fff;
  z-index: 999;
  display: none;
}

.span-jiantou {
  position: absolute;
  top: -3px;
  right: 14px;
  width: 19px;
  height: 19px;
  color: #666;
  cursor: pointer;
}

.twojiantou {
  top: 5px;
}

.leftjiantou {
  position: absolute;
  right: -16px;
  width: 19px;
  height: 19px;
}















 widgets/CoorPosition/manifest.json

New file
@@ -0,0 +1,17 @@
{
  "name": "CoorPosition",
  "2D": true,
  "3D": true,
  "platform": "HTML",
  "version": "2.10",
  "wabVersion": "2.10",
  "author": "jxdnosng",
  "description": "",
  "copyright": "",
  "license": "",
  "properties": {
    "hasConfig": false,
    "inPanel": false,
    "hasVersionManager": false
  }
}

 widgets/CoorPosition/nls/es/strings.js

New file
@@ -0,0 +1,5 @@
define(
   ({
    _widgetLabel: "goCoorPosition"
  })
);

 widgets/CoorPosition/nls/strings.js

New file
@@ -0,0 +1,7 @@
define({
  root: ({
    _widgetLabel: "CoorPosition"
  }),
  "es": 1,
  "zh-cn": 1
});

 widgets/CoorPosition/nls/zh-cn/strings.js

New file
@@ -0,0 +1,5 @@
define(
   ({
    _widgetLabel: "坐标定位"
  })
);

 widgets/MapPrinting/nls/zh-cn/strings.js

@@ -1,5 +1,5 @@
define(
   ({
    _widgetLabel: "地图打印"
    _widgetLabel: "场景快照"
  })
);

 widgets/Rolling/Widget.html

@@ -10,7 +10,7 @@
        <div class="hezi-right-select">
            <span class="hezi-rightspan">右侧图层 :</span>
            <select class="hezi-select" id="hezi-selectRight">
                <option class="optionVal3" value="1">天地图矢量</option>
                <option class="optionVal3" value="3">天地图矢量</option>
                <option class="optionVal4" value="2">天地图影像</option>
            </select>
        </div>

 widgets/Rolling/Widget.js

@@ -173,7 +173,7 @@
                    var layers = viewer.imageryLayers;
                    //addImageryProvider使用给定的ImageryProvider创建一个新层，并将其添加到集合中  UrlTemplateImageryProvider
                    that.ganZhouYinLeft = layers.addImageryProvider(new DC.ImageryLayerFactory.createXYZImageryLayer(
                        that.imageryProviderArrUrl[0]
                        that.imageryProviderAdd[0]
                    ));
                }


 widgets/RouteNavigate/Widget.html

New file
@@ -0,0 +1,98 @@
<div class="route">
    <div class="route-title">
        <span class="pic"></span>
        <div class="luxian">路线导航</div>
        <span class="x">x</span>
    </div>
    <div class="route-sign">
        <div class="qiDianBox">
            <div class="qiDian">起点:</div>
            <input type="text" class="input" id="qidianInput">
            <div id="xuanDian1">
                <img src="./images/qidian.png" alt="">
            </div>
        </div>
        <div class="zhongDianBox qiDianBox">
            <div class="qiDian">终点:</div>
            <input class="input" type="text" id="zhongdianInput">
            <div id="xuanDian2">
                <img src="./images/zhongdian.png" alt="">
            </div>
        </div>
        <!-- 清空搜索按钮 -->
        <div class="route-search">
            <button class="route-searchSearch">搜索</button>
            <button class="route-searchClear">清空</button>
        </div>
        <div class="hengxian"></div>
    </div>
    <!-- 线路title -->
    <div class="route-fangan">
        <div class="route-faTitle">
            <span class="route-zk">最快线路</span>
            <span class="route-zd">最短线路</span>
            <span class="route-gs">少走高速</span>
        </div>
        <!-- 面变1 -->
        <div class="route-list route-list1">
            <!-- <div class="route-zlc">
                <span>总里程: 约1公里</span>
            </div> -->
            <!-- <div class="route-xsqb">
                <input class="input" type="checkbox" checked>
                <span>显示全部详情</span>
            </div> -->
            <!-- <div class="route-lujin">
                <div class="lujin-div">
                    <div class="one">2.从胡二面开始从胡二面开始</div>
                    <div class="two">1).从胡二面开始从胡二面开始</div>
                </div>
            </div> -->
        </div>
        <!-- 面变2 -->
        <div class="route-list route-list2">
            <div class="route-zlc">
                <span>总里程: 约2公里</span>
            </div>
            <div class="route-xsqb">
                <input class="input" type="checkbox" checked>
                <span>显示全部详情</span>
            </div>
            <div class="route-lujin">
                <div class="lujin-div">
                    <div class="one">1.从胡二面开始从胡二面开始</div>
                    <div class="two">1).从胡二面开始从胡二面开始</div>
                </div>
            </div>
            <div class="route-lujin">
                <div class="lujin-div">
                    <div class="one">2.从胡二面开始从胡二面开始</div>
                    <div class="two">1).从胡二面开始从胡二面开始</div>
                </div>
            </div>
        </div>
        <!-- 面变3 -->
        <div class="route-list route-list3">
            <div class="route-zlc">
                <span>总里程: 约3公里</span>
            </div>
            <div class="route-xsqb">
                <input class="input" type="checkbox" checked>
                <span>显示全部详情</span>
            </div>
            <div class="route-lujin">
                <div class="lujin-div">
                    <div class="one">1.从胡二面开始从胡二面开始</div>
                    <div class="two">1).从胡二面开始从胡二面开始</div>
                </div>
            </div>
            <div class="route-lujin">
                <div class="lujin-div">
                    <div class="one">2.从胡二面开始从胡二面开始</div>
                    <div class="two">1).从胡二面开始从胡二面开始</div>
                </div>
            </div>
        </div>
    </div>
    <div class="danji">单击完成绘制</div>
</div>

 widgets/RouteNavigate/Widget.js

New file
@@ -0,0 +1,1268 @@
define(['dojo/_base/declare', 'dojo/_base/lang', 'dojo/_base/array', 'dojo/_base/html', 'dojo/topic', 'jimu/BaseWidget', 'libs/layer/layer.js'], function (declare, lang, array, html, topic, BaseWidget, layer) {
    return declare([BaseWidget], {
        baseClass: 'jimu-widget-RouteNavigate',
        name: 'RouteNavigate',
        // 起点坐标变量
        cartesian: '',
        // 终点坐标变量
        cartesian1: '',

        pic: 'qidian',
        pic1: 'zhongdian',

        // 起点实体id
        num: 1,
        // 终点实体id
        num1: 2,

        // 最快线路id
        zknum: 3,
        // 最短线路id
        zdnum: 3,
        // 少走高速线路id
        gsnum: 3,

        // 起点坐标数组 
        cartesianArr: [],
        // 终点坐标数组
        cartesianArr1: [],

        // 起点实体对象
        updateadd: {},
        // 终点实体对象
        updateadd1: {},

        // 起点经度
        lng: '',
        // 终点经度
        lng1: '',
        // 起点纬度
        lat: '',
        // 终点纬度
        lat1: '',

        // 线路1全长
        itemQc: '',
        // 线路2全长
        itemQc1: '',
        // 线路3全长
        itemQc2: '',

        // 线路1坐标
        itemZb: '',
        // 线路2坐标
        itemZb1: '',
        // 线路3坐标
        itemZb2: '',

        // 线路1坐标切割成字符串
        itemZbStr: '',
        // 线路2坐标切割成字符串
        itemZbStr1: '',
        // 线路3坐标切割成字符串
        itemZbStr2: '',

        // 线路1坐标数组split
        itemZbArr: [],
        // 线路2坐标数组split
        itemZbArr1: [],
        // 线路3坐标数组split
        itemZbArr2: [],

        // style路线id
        postStr: {},

        // 线段xianDuanArr数组
        xianDuanArr: [],

        // 方案线路1详情
        itemXld: '',
        // 方案线路2详情
        itemXld1: '',
        // 方案线路3详情
        itemXld2: '',

        // 方案线路1详情数组
        itemXldArr: [],
        // 方案线路2详情数组
        itemXldArr1: [],
        // 方案线路3详情数组
        itemXldArr2: [],

        // 线路段1坐标
        streetLatLon: '',
        // 线路段2坐标
        streetLatLon1: '',
        // 线路段3坐标
        streetLatLon2: '',

        // 方案1线路段高亮ID
        streetLatLonId: 500,
        // 方案2线路段高亮ID
        streetLatLonId1: 600,
        // 方案3线路段高亮ID
        streetLatLonId2: 700,

        // 方案1线路段高亮ID数组
        streetLatLonIdArr: [],
        // 方案2线路段高亮ID数组
        streetLatLonIdArr1: [],
        // 方案3线路段高亮ID数组
        streetLatLonIdArr2: [],

        // 线路段1坐标数组
        streetLatLonArr: [],
        // 线路段2坐标数组
        streetLatLonArr1: [],
        // 线路段3坐标数组
        streetLatLonArr2: [],

        // 方案1坐标处理成字符串
        streetLatLonArrStr: '',
        // 方案2坐标处理成字符串
        streetLatLonArrStr1: '',
        // 方案3坐标处理成字符串
        streetLatLonArrStr2: '',

        // xianDuan1实参数组
        xldArr1: [],

        // 线路一转折点经纬度数组
        turnlatlonArr: [],
        // 线路二转折点经纬度数组
        turnlatlonArr1: [],
        // 线路三转折点经纬度数组
        turnlatlonArr2: [],

        // 线路一适宜中心经纬度
        center: '',
        center1: '',
        center2: '',
        // 线路一适宜中心经纬度数组
        centerArr: [],
        centerArr1: [],
        centerArr2: [],

        // 起点回车键实体ID
        qdNum: -1,
        qdNum1: -2,

        // 起点回车实体坐标
        qdText: '',
        qdText1: '',

        // 起点回车实体坐标数组
        qdTextArr: [],
        qdTextArr1: [],

        // 起点回车实体坐标对象 接收 经纬度转成世界坐标
        qdCar: {},
        qdCar1: {},

        // 起点回车键坐标数组
        qdCarArr: [],
        qdCarArr1: [],

        // 线路一缩放比例
        scale: '',

        // 线路段高亮height数组
        heightArr: [],
        heightArr1: [],
        heightArr2: [],

        // 线路段高亮坐标数组
        centerArrGl: [],
        centerArrGl1: [],
        centerArrGl2: [],

        // 当前镜头
        cameraPosArr: [],

        // 当前heightJT
        heightJTArr: [],

        startup: function startup() {
            var that = this;
            var scene = that.map.scene;

            // 点击搜索改变样式
            $('.route-searchSearch').mousedown(function () {
                $(this).css('backgroundColor', '#36403d');
            });
            $('.route-searchSearch').on('mouseup', function () {
                $(this).css('backgroundColor', 'rgb(69, 154, 251)');
            });

            $('.route-searchClear').mousedown(function () {
                $(this).css('backgroundColor', '#36403d');
            });
            $('.route-searchClear').on('mouseup', function () {
                $(this).css('backgroundColor', 'rgb(69, 154, 251)');
            });

            // 点击搜索按钮提示
            $('.route-searchSearch').on('click', function () {
                if ($('#qidianInput').val() == '' || $('#zhongdianInput').val() == '') {
                    layer.msg('起点或终点没有值,请输入', {
                        time: 2000
                    });
                }
                // 起点跟终点有值触触发最快线路
                if ($('#qidianInput').val() != '' && $('#zhongdianInput').val() != '') {
                    $('.route-zk').trigger("click");
                }
            });

            // 点击清空按钮清空全部是数据
            $('.route-searchClear').on('click', function () {
                clear();
            });

            // 最快线路
            $('.route-zk').on('click', function () {
                // 线路一适宜中心经纬度
                that.center = '';
                // 线路一适宜中心经纬度数组
                that.centerArr = [];

                // 清楚线路段实体
                if (that.streetLatLonIdArr.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr[0]);
                }
                if (that.streetLatLonIdArr1.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                }
                if (that.streetLatLonIdArr2.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr2[0]);
                }

                // 清除最短线路实体
                that.map.entities.removeById(that.zdnum);
                that.map.entities.removeById(that.gsnum);
                that.map.entities.removeById(that.zknum);
                // 每次点击之前把html清空
                $('.route-list1').html('');
                // 把数据也清空
                that.itemQc = '';
                that.itemXldArr = [];

                $(this).addClass('routehover');
                $('.route-zd').removeClass('routehover');
                $('.route-gs').removeClass('routehover');

                // 面板出现
                $('.route-list1').show();
                $('.route-list2').hide();
                $('.route-list3').hide();

                // 调用ajax
                if ($('#qidianInput').val() != '' && $('#zhongdianInput').val() != '') {
                    ajax1();
                    // 中心坐标字符串转成数组
                    that.centerArr = that.center.split(',');

                    // 获取当前镜头位置的笛卡尔坐标
                    var cameraPos = that.map.camera.position;
                    that.cameraPosArr.push(cameraPos);

                    // 获取当前坐标系标准
                    var ellipsoid = that.map.scene.globe.ellipsoid;

                    // 根据坐标系标准，将笛卡尔坐标转换为地理坐标
                    var cartographic = ellipsoid.cartesianToCartographic(cameraPos);

                    // 获取镜头的高度
                    var height = cartographic.height / 1.8;
                    that.heightJTArr.push(height);

                    that.heightArr.push(height);

                    // 将线路一适宜中心经纬度数组push到数组.给下次做判断
                    that.centerArrGl.push(that.centerArr[0]);

                    var heightWY = '';
                    if (that.centerArr[0] == that.centerArrGl[0]) {
                        heightWY = that.heightArr[0];
                    } else {
                        heightWY = height;
                    }

                    // 相机跟随
                    that.map.camera.setView({
                        destination: Cesium.Cartesian3.fromDegrees(Number(that.centerArr[0]), Number(that.centerArr[1]), heightWY)
                    });

                    $('.route-list1').append('\n                            <div class="route-zlc">\n                                <span>\u603B\u91CC\u7A0B: \u7EA6' + that.itemQc + '\u516C\u91CC</span>\n                            </div>\n                        ');
                    for (var i = 0; i < that.itemXldArr.length; i++) {
                        that.itemXldArr[i] = i + 1 + '.' + that.itemXldArr[i];
                        $('.route-list1').append('\n                                <div class="route-lujin">\n                                    <div class="lujin-div">\n                                        <div class="one">' + that.itemXldArr[i] + '</div>\n                                    </div>\n                                </div>\n                            ');
                    }
                }
            });

            // 点击最快线路段详情高亮
            $('.route-list1').on('click', '.route-lujin', function () {
                // 删除其它 线路段 实体
                if (that.streetLatLonIdArr1.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                }
                if (that.streetLatLonIdArr2.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr2[0]);
                }

                // 当前this下标
                var index = $(this).index() - 1;

                // 当前时间ID
                that.streetLatLonId += new Date().getTime();

                // 坐标处理
                that.streetLatLonArrStr = that.streetLatLonArr[index].replace(/;/g, ',');
                that.streetLatLonArrStr = that.streetLatLonArrStr.split(',');

                // 对坐标取半
                var arrta = [];
                for (var i = 0; i < that.streetLatLonArrStr.length - 1; i += 2) {
                    arrta.push([that.streetLatLonArrStr[i], that.streetLatLonArrStr[i + 1]]);
                }
                var ind = parseInt(arrta.length / 2);

                // 绘制线段之前把之前的线段清空
                if (that.streetLatLonIdArr.length != 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr[0]);
                    that.streetLatLonIdArr = [];
                    // 定位过去
                    that.map.camera.setView({
                        destination: Cesium.Cartesian3.fromDegrees(Number(arrta[ind][0]), Number(arrta[ind][1]), 60000)
                    });
                    // 绘制线段
                    xianDuan1(that.streetLatLonArrStr, that.streetLatLonId);
                    // 把当前时间ID push到数组
                    that.streetLatLonIdArr.push(that.streetLatLonId);
                } else {
                    // 定位过去
                    that.map.camera.setView({
                        destination: Cesium.Cartesian3.fromDegrees(Number(arrta[ind][0]), Number(arrta[ind][1]), 60000)
                    });
                    // 绘制线段
                    xianDuan1(that.streetLatLonArrStr, that.streetLatLonId);
                    // 把当前时间ID push到数组
                    that.streetLatLonIdArr.push(that.streetLatLonId);
                }
            });

            // 点击最短线路段详情高亮
            $('.route-list2').on('click', '.route-lujin', function () {
                // 删除其它 线路段 实体
                if (that.streetLatLonIdArr.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr[0]);
                }
                if (that.streetLatLonIdArr2.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr2[0]);
                }

                // 当前this下标
                var index = $(this).index() - 1;

                // 当前时间ID
                that.streetLatLonId1 += new Date().getTime();

                // 坐标处理
                that.streetLatLonArrStr1 = that.streetLatLonArr1[index].replace(/;/g, ',');
                that.streetLatLonArrStr1 = that.streetLatLonArrStr1.split(',');

                // 对坐标取半
                var arrta = [];
                for (var i = 0; i < that.streetLatLonArrStr1.length - 1; i += 2) {
                    arrta.push([that.streetLatLonArrStr1[i], that.streetLatLonArrStr1[i + 1]]);
                }
                var ind = parseInt(arrta.length / 2);

                // 绘制线段之前把之前的线段清空
                if (that.streetLatLonIdArr1.length != 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                    that.streetLatLonIdArr1 = [];
                    // 定位过去
                    that.map.camera.setView({
                        destination: Cesium.Cartesian3.fromDegrees(Number(arrta[ind][0]), Number(arrta[ind][1]), 60000)
                    });
                    // 绘制线段
                    xianDuan1(that.streetLatLonArrStr1, that.streetLatLonId1);
                    // 把当前时间ID push到数组
                    that.streetLatLonIdArr1.push(that.streetLatLonId1);
                } else {
                    // 定位过去
                    that.map.camera.setView({
                        destination: Cesium.Cartesian3.fromDegrees(Number(arrta[ind][0]), Number(arrta[ind][1]), 60000)
                    });
                    // 绘制线段
                    xianDuan1(that.streetLatLonArrStr1, that.streetLatLonId1);
                    // 把当前时间ID push到数组
                    that.streetLatLonIdArr1.push(that.streetLatLonId1);
                }
            });

            // 点击少走高速段详情高亮
            $('.route-list3').on('click', '.route-lujin', function () {
                // 删除其它 线路段 实体
                if (that.streetLatLonIdArr1.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                }
                if (that.streetLatLonIdArr.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr[0]);
                }

                // 当前this下标
                var index = $(this).index() - 1;

                // 当前时间ID
                that.streetLatLonId2 += new Date().getTime();

                // 坐标处理
                that.streetLatLonArrStr2 = that.streetLatLonArr2[index].replace(/;/g, ',');
                that.streetLatLonArrStr2 = that.streetLatLonArrStr2.split(',');

                // 对坐标取半
                var arrta = [];
                for (var i = 0; i < that.streetLatLonArrStr2.length - 1; i += 2) {
                    arrta.push([that.streetLatLonArrStr2[i], that.streetLatLonArrStr2[i + 1]]);
                }
                var ind = parseInt(arrta.length / 2);

                // 绘制线段之前把之前的线段清空
                if (that.streetLatLonIdArr2.length != 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr2[0]);
                    that.streetLatLonIdArr2 = [];
                    // 相机跟随视角
                    that.map.camera.setView({
                        destination: Cesium.Cartesian3.fromDegrees(Number(arrta[ind][0]), Number(arrta[ind][1]), 60000)
                    });
                    // 绘制线段
                    xianDuan1(that.streetLatLonArrStr2, that.streetLatLonId2);
                    // 把当前时间ID push到数组
                    that.streetLatLonIdArr2.push(that.streetLatLonId2);
                } else {
                    // 相机跟随视角
                    that.map.camera.setView({
                        destination: Cesium.Cartesian3.fromDegrees(Number(arrta[ind][0]), Number(arrta[ind][1]), 60000)
                    });
                    // 绘制线段
                    xianDuan1(that.streetLatLonArrStr2, that.streetLatLonId2);
                    // 把当前时间ID push到数组
                    that.streetLatLonIdArr2.push(that.streetLatLonId2);
                }
            });

            // 最短线路
            $('.route-zd').on('click', function () {
                // 线路一适宜中心经纬度
                that.center1 = '';
                // 线路一适宜中心经纬度数组
                that.centerArr1 = [];

                // 清楚线路段实体
                if (that.streetLatLonIdArr.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr[0]);
                }
                if (that.streetLatLonIdArr1.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                }
                if (that.streetLatLonIdArr2.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr2[0]);
                }

                // 清楚最快线路实体
                that.map.entities.removeById(that.zknum);
                that.map.entities.removeById(that.gsnum);
                that.map.entities.removeById(that.zdnum);
                // 每次点击之前把html清空
                $('.route-list2').html('');
                // 把数据也清空
                that.itemQc1 = '';
                that.itemXldArr1 = [];

                $('.route-zk').removeClass('routehover');
                $(this).addClass('routehover');
                $('.route-gs').removeClass('routehover');

                // 面板出现
                $('.route-list1').hide();
                $('.route-list2').show();
                $('.route-list3').hide();

                // 调用ajax
                if ($('#qidianInput').val() != '' && $('#zhongdianInput').val() != '') {
                    ajax2();
                    // 中心坐标字符串转成数组
                    that.centerArr1 = that.center1.split(',');

                    // 获取当前镜头位置的笛卡尔坐标
                    // that.cameraPos = that.map.camera.position;

                    // 获取当前坐标系标准
                    var ellipsoid = that.map.scene.globe.ellipsoid;

                    // 根据坐标系标准，将笛卡尔坐标转换为地理坐标
                    var cartographic = ellipsoid.cartesianToCartographic(that.cameraPosArr[0]);

                    // 获取镜头的高度
                    var height = cartographic.height / 1.8;

                    that.heightArr1.push(that.heightJTArr[0]);

                    // 将线路一适宜中心经纬度数组push到数组.给下次做判断
                    that.centerArrGl1.push(that.centerArr1[0]);

                    var heightWY = '';
                    if (that.centerArr1[0] == that.centerArrGl1[0]) {
                        heightWY = that.heightArr1[0];
                    } else {
                        heightWY = that.heightJTArr[0];
                    }

                    // 相机跟随
                    that.map.camera.setView({
                        destination: Cesium.Cartesian3.fromDegrees(Number(that.centerArr1[0]), Number(that.centerArr1[1]), heightWY)
                    });

                    $('.route-list2').append('\n                        <div class="route-zlc">\n                            <span>\u603B\u91CC\u7A0B: \u7EA6' + that.itemQc1 + '\u516C\u91CC</span>\n                        </div>\n                    ');
                    for (var i = 0; i < that.itemXldArr1.length; i++) {
                        that.itemXldArr1[i] = i + 1 + '.' + that.itemXldArr1[i];
                        $('.route-list2').append('\n                            <div class="route-lujin">\n                                <div class="lujin-div">\n                                    <div class="one">' + that.itemXldArr1[i] + '</div>\n                                </div>\n                            </div>\n                        ');
                    }
                }
            });

            // 少走高速
            $('.route-gs').on('click', function () {
                // 线路一适宜中心经纬度
                that.center2 = '';
                // 线路一适宜中心经纬度数组
                that.centerArr2 = [];

                // 清楚线路段实体
                if (that.streetLatLonIdArr.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr[0]);
                }
                if (that.streetLatLonIdArr1.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                }
                if (that.streetLatLonIdArr2.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr2[0]);
                }

                // 清楚最快线路实体
                that.map.entities.removeById(that.zknum);
                that.map.entities.removeById(that.zdnum);
                that.map.entities.removeById(that.gsnum);
                // 每次点击之前把html清空
                $('.route-list3').html('');
                // 把数据也清空
                that.itemQc2 = '';
                that.itemXldArr2 = [];

                $('.route-zk').removeClass('routehover');
                $(this).addClass('routehover');
                $('.route-zd').removeClass('routehover');

                // 面板出现
                $('.route-list1').hide();
                $('.route-list2').hide();
                $('.route-list3').show();

                // 调用ajax
                if ($('#qidianInput').val() != '' && $('#zhongdianInput').val() != '') {
                    ajax3();
                    // 中心坐标字符串转成数组
                    that.centerArr2 = that.center2.split(',');

                    // 获取当前镜头位置的笛卡尔坐标
                    // var cameraPos = that.map.camera.position;

                    // 获取当前坐标系标准
                    var ellipsoid = that.map.scene.globe.ellipsoid;

                    // 根据坐标系标准，将笛卡尔坐标转换为地理坐标
                    var cartographic = ellipsoid.cartesianToCartographic(that.cameraPosArr[0]);

                    // 获取镜头的高度
                    var height = cartographic.height / 1.8;

                    that.heightArr2.push(that.heightJTArr[0]);

                    // 将线路一适宜中心经纬度数组push到数组.给下次做判断
                    that.centerArrGl2.push(that.centerArr2[0]);

                    var heightWY = '';
                    if (that.centerArr2[0] == that.centerArrGl2[0]) {
                        heightWY = that.heightArr2[0];
                    } else {
                        heightWY = that.heightJTArr[0];
                    }

                    // 相机跟随
                    that.map.camera.setView({
                        destination: Cesium.Cartesian3.fromDegrees(Number(that.centerArr2[0]), Number(that.centerArr2[1]), heightWY)
                    });

                    $('.route-list3').append('\n                        <div class="route-zlc">\n                            <span>\u603B\u91CC\u7A0B: \u7EA6' + that.itemQc2 + '\u516C\u91CC</span>\n                        </div>\n                    ');
                    for (var i = 0; i < that.itemXldArr2.length; i++) {
                        that.itemXldArr2[i] = i + 1 + '.' + that.itemXldArr2[i];
                        $('.route-list3').append('\n                            <div class="route-lujin">\n                                <div class="lujin-div">\n                                    <div class="one">' + that.itemXldArr2[i] + '</div>\n                                </div>\n                            </div>\n                        ');
                    }
                }
            });

            // 点击面板x关闭面板
            $('.route-title .x').on('click', function () {
                $('.route').hide();
                clear();
            });

            // 封装清空全部数据
            function clear() {
                // 当前镜头
                that.cameraPosArr = [];
                that.heightJTArr = [];

                // 线路段高亮height数组
                that.heightArr = [];
                that.heightArr1 = [];
                that.heightArr2 = [];
                // 线路段高亮坐标数组
                that.centerArrGl = [];
                that.centerArrGl1 = [];
                that.centerArrGl2 = [];

                // 起点回车键数据
                that.qdText = '';
                that.qdTextArr = [];
                that.qdCar = {};
                that.qdCarArr = [];
                that.map.entities.removeById(that.qdNum);
                // 终点回车键数据
                that.qdText1 = '';
                that.qdTextArr1 = [];
                that.qdCar1 = {};
                that.qdCarArr1 = [];
                that.map.entities.removeById(that.qdNum1);

                // 相机回复到原始经纬度
                that.map.camera.setView({
                    destination: Cesium.Cartesian3.fromDegrees(Number(115.297150), Number(25.742296), 800000)
                });

                // 线路一适宜中心经纬度
                that.center = '';
                that.center1 = '';
                that.center2 = '';
                // 线路一适宜中心经纬度数组
                that.centerArr = [];
                that.centerArr1 = [];
                that.centerArr2 = [];

                // 线路一转折点经纬度数组
                that.turnlatlonArr = [];
                that.turnlatlonArr1 = [];
                that.turnlatlonArr2 = [];

                // xianDuan1实参数组
                that.xldArr1 = [];
                // 线段xianDuanArr数组
                that.xianDuanArr = [];

                // style路线id
                that.postStr = {};

                // 线路1坐标数组split
                that.itemZbArr = [];
                that.itemZbArr1 = [];
                that.itemZbArr2 = [];

                // 起点实体对象
                that.updateadd = {};
                that.updateadd1 = {};

                // 方案1线路段高亮ID数组
                if (that.streetLatLonIdArr.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr[0]);
                }
                if (that.streetLatLonIdArr1.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                }
                if (that.streetLatLonIdArr2.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr2[0]);
                }

                // 清空线路段实体
                that.map.entities.removeById(that.streetLatLonIdArr);

                // 每次点击之前把html清空
                $('.route-list1').html('');
                $('.route-list2').html('');
                $('.route-list3').html('');
                // 把数据也清空
                that.itemQc = '';

                // 方案线路1详情数组
                that.itemXldArr = [];

                // 线路段1坐标数组
                that.streetLatLonArr = [];
                that.streetLatLonArr1 = [];
                that.streetLatLonArr2 = [];

                that.itemQc1 = '';
                // 方案线路2详情数组
                that.itemXldArr1 = [];

                that.itemQc2 = '';
                // 方案线路3详情数组
                that.itemXldArr2 = [];
                that.itemIDArr2 = [];

                // 清空样式
                $('.route-zd').removeClass('routehover');
                $('.route-gs').removeClass('routehover');
                $('.route-zk').removeClass('routehover');

                // 起点坐标
                that.cartesianArr = [];
                // 终点坐标
                that.cartesianArr1 = [];

                // 清空起点跟终点图标
                that.map.entities.removeById(that.num);
                that.map.entities.removeById(that.num1);
                // 清楚线路实体
                that.map.entities.removeById(that.zknum);
                that.map.entities.removeById(that.zdnum);
                that.map.entities.removeById(that.gsnum);

                $('#qidianInput').val('');
                $('#zhongdianInput').val('');
                $('#routeTable').html('');
                $('#routeBottom').html('');
                $('#routeTable').hide();
                that.cartesian = '';
                that.cartesian1 = '';
                $('.routeXLD').html('');
                $('.routeXLD').hide();
                // 清楚线路段的实体
                that.map.entities.removeById(that.streetLatLonIdArr[0]);
                that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                that.map.entities.removeById(that.streetLatLonIdArr2[0]);
            }

            // 点击 起点按钮 绘制实体
            $('#xuanDian1').click(function (event) {
                // 当前镜头
                that.cameraPosArr = [];
                that.heightJTArr = [];

                // 线路段高亮height数组
                that.heightArr = [];
                that.heightArr1 = [];
                that.heightArr2 = [];
                // 线路段高亮坐标数组
                that.centerArrGl = [];
                that.centerArrGl1 = [];
                that.centerArrGl2 = [];

                // 清空起点失去焦点图标
                that.map.entities.removeById(that.qdNum);

                // 线路段1坐标数组
                that.streetLatLonArr = [];
                that.streetLatLonArr1 = [];
                that.streetLatLonArr2 = [];

                // 删除其它 线路段 实体
                if (that.streetLatLonIdArr1.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                }
                if (that.streetLatLonIdArr.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr[0]);
                }
                if (that.streetLatLonIdArr2.length > 0) {
                    that.map.entities.removeById(that.streetLatLonIdArr2[0]);
                }

                // 每次点击之前把html清空
                $('.route-list1').html('');
                $('.route-list2').html('');
                $('.route-list3').html('');

                // 把数据也清空
                that.itemQc = '';
                that.itemXldArr = [];
                that.itemQc1 = '';
                that.itemXldArr1 = [];
                that.itemQc2 = '';
                that.itemXldArr2 = [];

                // 样式清空
                $('.route-zd').removeClass('routehover');
                $('.route-zk').removeClass('routehover');
                $('.route-gs').removeClass('routehover');

                // 清楚方案线路实体
                that.map.entities.removeById(that.zknum);
                that.map.entities.removeById(that.zdnum);
                that.map.entities.removeById(that.gsnum);

                that.item = '';
                that.itemQc = '';
                that.itemXldArr = [];
                that.itemXldArr1 = [];
                that.itemXldArr2 = [];
                $('.routeXLD').html('');
                // 清楚线路段的实体
                that.map.entities.removeById(that.streetLatLonIdArr[0]);
                that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                that.map.entities.removeById(that.streetLatLonIdArr2[0]);

                var handlers = new Cesium.ScreenSpaceEventHandler(that.map.scene.canvas);
                // 监听鼠标移动
                handlers.setInputAction(function (moveEvent) {
                    // 点击完成绘制
                    $('.route .danji').css({ 'display': 'block', 'left': moveEvent.startPosition.x + 10 + 'px', 'top': moveEvent.startPosition.y + 10 + 'px' });
                }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
                // 监听鼠标点击
                handlers.setInputAction(function (clickEvent) {
                    $('.route .danji').hide();
                    var pick = that.map.scene.pickPosition(clickEvent.position);
                    // 获取坐标
                    var ray = that.map.camera.getPickRay(clickEvent.position);
                    that.cartesian = scene.globe.pick(ray, scene);
                    // 坐标转换
                    var ellipsoid = that.map.scene.globe.ellipsoid;
                    var cartesian3 = new Cesium.Cartesian3(that.cartesian.x, that.cartesian.y, that.cartesian.z);
                    var cartographic = ellipsoid.cartesianToCartographic(cartesian3);
                    that.lat = Cesium.Math.toDegrees(cartographic.latitude).toFixed(5); //纬度
                    that.lng = Cesium.Math.toDegrees(cartographic.longitude).toFixed(5); //经度
                    $('#qidianInput').val(that.lng + ',' + that.lat);
                    // 判断是否是第一个实体
                    that.cartesianArr.push(that.cartesian);
                    if (that.cartesianArr.length == 1) {
                        // 绘制entity
                        addPoint(that.cartesian, that.num, that.pic, that.updateadd);
                    } else {
                        that.updateadd.position = that.cartesian;
                    }
                    if (that.cartesian) {
                        $('.route .danji').css('display', 'none');
                        handlers.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
                    }
                    handlers.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);

                    // 默认触发回车键 
                    if ($('#qidianInput').val() != '' && $('#zhongdianInput').val() != '') {
                        $('.route-zk').trigger("click");
                    }
                }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
            });

            // 点击 终点按钮 绘制实体
            $('#xuanDian2').on('click', function (event) {
                // 当前镜头
                that.cameraPosArr = [];
                that.heightJTArr = [];

                // 线路段高亮height数组
                that.heightArr = [];
                that.heightArr1 = [];
                that.heightArr2 = [];
                // 线路段高亮坐标数组
                that.centerArrGl = [];
                that.centerArrGl1 = [];
                that.centerArrGl2 = [];

                // 清空终点失去焦点图标
                that.map.entities.removeById(that.qdNum1);

                // 线路段1坐标数组
                that.streetLatLonArr = [];
                that.streetLatLonArr1 = [];
                that.streetLatLonArr2 = [];

                // 每次点击之前把html清空
                $('.route-list1').html('');
                $('.route-list2').html('');
                $('.route-list3').html('');

                // 把数据也清空
                that.itemQc = '';
                that.itemXldArr = [];
                that.itemQc1 = '';
                that.itemXldArr1 = [];
                that.itemQc2 = '';
                that.itemXldArr2 = [];

                // 样式清空
                $('.route-zd').removeClass('routehover');
                $('.route-zk').removeClass('routehover');
                $('.route-gs').removeClass('routehover');

                // 清楚方案线路实体
                that.map.entities.removeById(that.zknum);
                that.map.entities.removeById(that.zdnum);
                that.map.entities.removeById(that.gsnum);

                that.item = '';
                that.itemQc = '';
                that.itemXldArr = [];
                that.itemXldArr1 = [];
                that.itemXldArr2 = [];
                $('.routeXLD').html('');
                // 清楚线路段的实体
                that.map.entities.removeById(that.streetLatLonIdArr[0]);
                that.map.entities.removeById(that.streetLatLonIdArr1[0]);
                that.map.entities.removeById(that.streetLatLonIdArr2[0]);
                var handlers = new Cesium.ScreenSpaceEventHandler(that.map.scene.canvas);
                // 监听鼠标移动
                handlers.setInputAction(function (moveEvent) {
                    // 点击完成绘制
                    $('.route .danji').css({ 'display': 'block', 'left': moveEvent.startPosition.x + 10 + 'px', 'top': moveEvent.startPosition.y + 10 + 'px' });
                }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
                // 监听鼠标点击
                handlers.setInputAction(function (clickEvent) {
                    $('.route .danji').hide();
                    var pick = that.map.scene.pickPosition(clickEvent.position);
                    // 获取坐标
                    var ray = that.map.camera.getPickRay(clickEvent.position);
                    that.cartesian1 = scene.globe.pick(ray, scene);
                    // 坐标转换
                    var ellipsoid = that.map.scene.globe.ellipsoid;
                    var cartesian3 = new Cesium.Cartesian3(that.cartesian1.x, that.cartesian1.y, that.cartesian1.z);
                    var cartographic = ellipsoid.cartesianToCartographic(cartesian3);
                    that.lat1 = Cesium.Math.toDegrees(cartographic.latitude).toFixed(5); //纬度
                    that.lng1 = Cesium.Math.toDegrees(cartographic.longitude).toFixed(5); //经度
                    $('#zhongdianInput').val(that.lng1 + ',' + that.lat1);
                    that.cartesianArr1.push(that.cartesian1);
                    if (that.cartesianArr1.length == 1) {
                        // 绘制entity
                        addPoint1(that.cartesian1, that.num1, that.pic1, that.updateadd1);
                    } else {
                        that.updateadd1.position = that.cartesian1;
                    }
                    if (that.cartesian1) {
                        $('.route .danji').css('display', 'none');
                        handlers.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
                    }
                    handlers.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);

                    // 默认触发最快线路事件
                    if ($('#qidianInput').val() != '' && $('#zhongdianInput').val() != '') {
                        $('.route-zk').trigger("click");
                    }
                }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
            });

            // 起点失去焦点绘制实体
            $('#qidianInput').blur(function (event) {
                // 清空起点跟终点图标
                that.map.entities.removeById(that.num);

                // input值
                that.qdText = $(this).val();
                that.qdTextArr = that.qdText.split(',');

                that.lng = that.qdTextArr[0];
                that.lat = that.qdTextArr[1];

                // 经纬度转成世界坐标
                that.qdCar = Cesium.Cartesian3.fromDegrees(that.qdTextArr[0], that.qdTextArr[1]);

                // 判断是否是第一个实体
                that.qdCarArr.push(that.qdCar);
                if (that.qdCarArr.length == 1) {
                    // 绘制entity
                    addPoint(that.qdCar, that.qdNum, that.pic);
                } else {
                    that.updateadd.position = that.qdCar;
                }

                // // 起点跟终点有值触触发最快线路
                // if ($('#qidianInput').val() != '' && $('#zhongdianInput').val() != '') {
                //     $('.route-zk').trigger("click");
                // }
            });

            // 终点失去焦点绘制实体
            $('#zhongdianInput').blur(function (event) {
                // 清空跟终点图标
                that.map.entities.removeById(that.num1);

                that.qdText1 = $(this).val();
                that.qdTextArr1 = that.qdText1.split(',');

                that.lng1 = that.qdTextArr1[0];
                that.lat1 = that.qdTextArr1[1];

                // 经纬度转成世界坐标
                that.qdCar1 = Cesium.Cartesian3.fromDegrees(that.qdTextArr1[0], that.qdTextArr1[1]);

                // 判断是否是第一个实体
                that.qdCarArr1.push(that.qdCar1);
                if (that.qdCarArr1.length == 1) {
                    // 绘制entity
                    addPoint1(that.qdCar1, that.qdNum1, that.pic1);
                } else {
                    that.updateadd1.position = that.qdCar1;
                }
            });

            // ajax1
            function ajax1() {
                if (that.cartesian && that.cartesian1 || that.qdCar && that.qdCar1) {
                    var key = 'e9533f5acb2ac470b07f406a4d24b4f0';
                    that.postStr = { 'orig': '', 'dest': '', style: 0 };
                    that.postStr.orig = that.lng + ',' + that.lat;
                    that.postStr.dest = that.lng1 + ',' + that.lat1;
                    var dayUrl = 'http://api.tianditu.gov.cn/drive?postStr=' + JSON.stringify(that.postStr) + '&type=search&tk=' + key;
                    $.ajax({
                        type: "get",
                        url: dayUrl,
                        async: false,
                        dataType: "xml",
                        success: function success(res) {
                            console.log(res);
                            // 线路children
                            var items = $(res).find('simple').children('item');
                            for (var j = 0; j < items.length; j++) {
                                // 方案1线路详情
                                that.itemXld = $($(res).find('simple').children('item')[j]).find('strguide').text();
                                // 方案1线路详情push到数组
                                that.itemXldArr.push(that.itemXld);

                                // 每条线路段坐标
                                that.streetLatLon = $($(res).find('simple').children('item')[j]).find('streetLatLon').text();
                                // 每条线路段坐标push到streetLatLonArr
                                that.streetLatLonArr.push(that.streetLatLon);
                            };
                            // 每条线路全长
                            that.itemQc = $(res).find('distance').text();
                            // 每条线路坐标
                            that.itemZb = $(res).find('routelatlon').text();
                            // 每条线路坐标做数据处理
                            that.itemZbStr = that.itemZb.replace(/;/g, ',');
                            that.itemZbArr = that.itemZbStr.split(',');
                            // 线路一适宜中心经纬度
                            that.center = $(res).find('center').text();
                            // 线路一缩放比例
                            that.scale = $(res).find('scale').text();
                            // 线路ID
                            that.zknum = new Date().getTime();
                            // 绘制线段
                            xianDuan(that.itemZbArr, that.zknum);
                        }
                    });
                }
            }

            // ajax2
            function ajax2() {
                if (that.cartesian && that.cartesian1 || that.qdCar && that.qdCar1) {
                    var key = 'e9533f5acb2ac470b07f406a4d24b4f0';
                    that.postStr = { 'orig': '', 'dest': '', style: 1 };
                    that.postStr.orig = that.lng + ',' + that.lat;
                    that.postStr.dest = that.lng1 + ',' + that.lat1;
                    var dayUrl = 'http://api.tianditu.gov.cn/drive?postStr=' + JSON.stringify(that.postStr) + '&type=search&tk=' + key;
                    $.ajax({
                        type: "get",
                        url: dayUrl,
                        async: false,
                        dataType: "xml",
                        success: function success(res) {
                            // 线路children
                            var items = $(res).find('simple').children('item');
                            for (var j = 0; j < items.length; j++) {
                                // 方案1线路详情
                                that.itemXld1 = $($(res).find('simple').children('item')[j]).find('strguide').text();
                                that.itemXldArr1.push(that.itemXld1);

                                // 每条线路段坐标
                                that.streetLatLon1 = $($(res).find('simple').children('item')[j]).find('streetLatLon').text();
                                // 每条线路段坐标push到streetLatLonArr
                                that.streetLatLonArr1.push(that.streetLatLon1);
                            };
                            // 每条线路全长
                            that.itemQc1 = $(res).find('distance').text();
                            // 每条线路坐标
                            that.itemZb1 = $(res).find('routelatlon').text();
                            // 每条线路坐标做数据处理
                            that.itemZbStr1 = that.itemZb1.replace(/;/g, ',');
                            that.itemZbArr1 = that.itemZbStr1.split(',');
                            // 线路一适宜中心经纬度
                            that.center1 = $(res).find('center').text();
                            // 线路ID
                            that.zdnum = new Date().getTime();
                            // 绘制线段
                            xianDuan(that.itemZbArr1, that.zdnum);
                        }
                    });
                }
            }

            // ajax3
            function ajax3() {
                if (that.cartesian && that.cartesian1 || that.qdCar && that.qdCar1) {
                    var key = 'e9533f5acb2ac470b07f406a4d24b4f0';
                    that.postStr = { 'orig': '', 'dest': '', style: 2 };
                    that.postStr.orig = that.lng + ',' + that.lat;
                    that.postStr.dest = that.lng1 + ',' + that.lat1;
                    var dayUrl = 'http://api.tianditu.gov.cn/drive?postStr=' + JSON.stringify(that.postStr) + '&type=search&tk=' + key;
                    $.ajax({
                        type: "get",
                        url: dayUrl,
                        async: false,
                        dataType: "xml",
                        success: function success(res) {
                            // 线路children
                            var items = $(res).find('simple').children('item');
                            for (var j = 0; j < items.length; j++) {
                                // 方案1线路详情
                                that.itemXld2 = $($(res).find('simple').children('item')[j]).find('strguide').text();
                                that.itemXldArr2.push(that.itemXld2);

                                // 每条线路段坐标
                                that.streetLatLon2 = $($(res).find('simple').children('item')[j]).find('streetLatLon').text();
                                // 每条线路段坐标push到streetLatLonArr
                                that.streetLatLonArr2.push(that.streetLatLon2);
                            };
                            // 每条线路全长
                            that.itemQc2 = $(res).find('distance').text();
                            // 每条线路坐标
                            that.itemZb2 = $(res).find('routelatlon').text();
                            // 每条线路坐标做数据处理
                            that.itemZbStr2 = that.itemZb2.replace(/;/g, ',');
                            that.itemZbArr2 = that.itemZbStr2.split(',');
                            // 线路一适宜中心经纬度
                            that.center2 = $(res).find('center').text();
                            // 线路ID
                            that.gsnum = new Date().getTime();
                            // 绘制线段
                            xianDuan(that.itemZbArr2, that.gsnum);
                        }
                    });
                }
            }

            // 创建线段的方法
            function xianDuan(item, id) {
                that.xianDuanArr = [];
                for (var i = 0; i < item.length - 1; i++) {
                    that.xianDuanArr.push(Number(item[i]));
                }
                that.map.entities.add({
                    id: id,
                    polyline: {
                        positions: Cesium.Cartesian3.fromDegreesArray(that.xianDuanArr),
                        width: 5,
                        material: Cesium.Color.SKYBLUE,
                        clampToGround: true
                    }
                });
            };

            function xianDuan1(item1, id1) {
                that.xldArr1 = [];
                for (var i = 0; i < item1.length - 1; i++) {
                    that.xldArr1.push(Number(item1[i]));
                }
                that.map.entities.add({
                    id: id1,
                    polyline: {
                        positions: Cesium.Cartesian3.fromDegreesArray(that.xldArr1),
                        width: 5,
                        material: Cesium.Color.RED,
                        clampToGround: true
                    }
                });
            };

            // 创建点方法(起点)
            function addPoint(cartesian, id, pic) {
                that.updateadd = viewer.entities.add({
                    id: id,
                    position: cartesian,
                    billboard: { //图标
                        image: './images/' + pic + '.png',
                        width: 40,
                        height: 40,
                        heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
                        disableDepthTestDistance: Number.POSITIVE_INFINITY
                    },
                    label: {
                        text: that.str,
                        font: '8pt Source Han Sans CN', //字体样式
                        fillColor: Cesium.Color.YELLOW, //字体颜色
                        backgroundColor: Cesium.Color.AQUA, //背景颜色
                        // showBackground: true,                //是否显示背景颜色
                        style: Cesium.LabelStyle.FILL, //label样式
                        outlineWidth: 2,
                        verticalOrigin: Cesium.VerticalOrigin.CENTER, //垂直位置
                        horizontalOrigin: Cesium.HorizontalOrigin.CENTER, //水平位置
                        pixelOffset: new Cesium.Cartesian2(0, -30), //偏移
                        heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
                        disableDepthTestDistance: Number.POSITIVE_INFINITY
                    }
                });
            };
            // 创建点方法(终点)
            function addPoint1(cartesian, id, pic) {
                that.updateadd1 = viewer.entities.add({
                    id: id,
                    position: cartesian,
                    billboard: { //图标
                        image: './images/' + pic + '.png',
                        width: 40,
                        height: 40,
                        heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
                        disableDepthTestDistance: Number.POSITIVE_INFINITY
                    },
                    label: {
                        text: that.str,
                        font: '8pt Source Han Sans CN', //字体样式
                        fillColor: Cesium.Color.YELLOW, //字体颜色
                        backgroundColor: Cesium.Color.AQUA, //背景颜色
                        // showBackground: true,                //是否显示背景颜色
                        style: Cesium.LabelStyle.FILL, //label样式
                        outlineWidth: 2,
                        verticalOrigin: Cesium.VerticalOrigin.CENTER, //垂直位置
                        horizontalOrigin: Cesium.HorizontalOrigin.CENTER, //水平位置
                        pixelOffset: new Cesium.Cartesian2(0, -30), //偏移
                        heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
                        disableDepthTestDistance: Number.POSITIVE_INFINITY
                    }
                });
            };
        },

        onOpen: function onOpen() {},

        onClose: function onClose() {
            //面板关闭的时候触发 （when this panel is closed trigger）
        },

        onMinimize: function onMinimize() {
            this.resize();
        },

        onMaximize: function onMaximize() {
            this.resize();
        },

        resize: function resize() {},

        destroy: function destroy() {
            //销毁的时候触发
            //todo
            //do something before this func
            this.inherited(arguments);
        }

    });
});

 widgets/RouteNavigate/css/style.css

New file
@@ -0,0 +1,246 @@
.jimu-widget-RouteNavigate {
  background-color: #36403d;
  opacity: .8;
  font-size: 14px;
  border: 1px solid rgb(69, 154, 251);
  color: rgb(238, 235, 235);
  font-size: 16px;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  display: none;
  box-sizing: border-box;
  overflow: auto;
}

.route-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 10px;
  width: 100%;
  height: 35px;
  border-bottom: 1px solid rgb(69, 154, 251);
}

.route-title .pic {
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  background: url(../../../images/toolbox.png ) no-repeat 0 -159px;
}

.route-title .luxian {
  margin-left: -180px;
  font-size: 14px;
  cursor: default ;
}

.route-title .x {
  cursor: pointer;
  font-style: 16px;
}

.route-sign {
  width: 100%;
  height: 140px;
}

.route-sign .qiDianBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  padding: 10px;
}

.route-sign .qiDianBox .qiDian {
  font-size: 14px;
}

.route-sign .qiDianBox .input {
  border: none;
  height: 25px;
  border-radius: 5px;
  text-indent: 10px;
  /* padding-right: 10px; */
}

.route-sign .qiDianBox button {
  border: none;
  border-radius: 5px;
  background-color: #20a0ff;
  color: #fff;
  line-height: 25px;
  cursor: pointer;
}

.route-sign .qiDianBox #xuanDian1 img,
.route-sign .qiDianBox #xuanDian2 img {
  width: 30px;
  height: 30px;
  margin-top: 3px;
  margin-right: 5px;
  cursor: pointer;
}

.route-sign .zhongDianBox {
  margin-top: -10px;
}

.route-sign .hengxian {
  margin: 20px  auto 0;
  width: 285px;
  border-bottom: 1px solid #fff;
  margin-top: 10px;
}








.route-fangan {
  margin-top: 0px;
  width: 100%;
  padding: 0 10px;
}

.route-faTitle {
  width: 100%;
  height: 30px;
  display: flex;
  text-align: center;
  border: 1px solid #fff;
}

.route-faTitle span {
  flex: 1;
  border-right: 1px solid #fff;
  text-align: center;
  line-height: 30px;
  font-size: 13px;
  cursor: pointer;
}

.routehover {
  color: #68acf9;
}

.route-list {
  display: none;
  width: 100%;
}

.route-zlc {
  width: 100%;
  height: 30px;
  background-color: rgb(23, 161, 150);
  margin-top: 10px;
}

.route-zlc span {
  font-size: 12px;
  line-height: 30px;
  margin-left: 10px;
}

.route-xsqb {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  height: 30px;
  border-bottom: 1px solid #fff;
  padding: 0 10px 0 0;
}

.route-xsqb .inpupt {
  cursor: pointer;
}

.route-xsqb span {
  font-size: 13px ;
  margin-left: 5px;
  cursor: default;
}

.route-lujin {
  cursor: pointer;
  width: 100%;
}

.route-lujin .lujin-div {
  width: 100%;
  padding: 10px;
  border-bottom: 1px solid #fff;
}

.route-lujin .lujin-div .one {
  font-size: 13px;
  line-height: 20px;
}

.route-lujin .lujin-div .two {
  font-size: 12px;
  margin-left: 10px;
  line-height: 20px;
}

#spanxialu {
  color: #68acf9;
}


/* 搜索清空按钮 */
.route-search {
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding: 0 95px;
  margin-top: 10px;
  margin-top: -2px;
}

.route-search button {
  border-radius: 5px;
  cursor: pointer;
  line-height: 20px;
  width: 42px;
  font-size: 12px;
  border: none;
  background-color: rgb(69, 154, 251);
  color: #fff;
  border: 1px solid rgb(69, 154, 251);
}





























 widgets/RouteNavigate/manifest.json

New file
@@ -0,0 +1,17 @@
{
  "name": "RouteNavigate",
  "2D": true,
  "3D": true,
  "platform": "HTML",
  "version": "2.10",
  "wabVersion": "2.10",
  "author": "jxdnosng",
  "description": "",
  "copyright": "",
  "license": "",
  "properties": {
    "hasConfig": false,
    "inPanel": false,
    "hasVersionManager": false
  }
}

 widgets/RouteNavigate/nls/es/strings.js

New file
@@ -0,0 +1,5 @@
define(
   ({
    _widgetLabel: "goRouteNavigate"
  })
);

 widgets/RouteNavigate/nls/strings.js

New file
@@ -0,0 +1,7 @@
define({
  root: ({
    _widgetLabel: "RouteNavigate"
  }),
  "es": 1,
  "zh-cn": 1
});

 widgets/RouteNavigate/nls/zh-cn/strings.js

New file
@@ -0,0 +1,5 @@
define(
   ({
    _widgetLabel: "路线导航"
  })
);

 widgets/Tool/Widget.js

@@ -28,7 +28,6 @@
            name: 'Tool',
            layers: {},
            startup: function () {

                // 暴露在外的接口
                topic.subscribe("closeTool", lang.hitch(this, this.closeToolBox));
                this.inherited(arguments);
@@ -47,6 +46,9 @@
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-Sign').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.jimu-widget-Screen').hide();
                        $('.jimu-widget-Rolling').hide();
                        $('.jimu-widget-Plot').hide();
                        $('.jimu-widget-Measurement').hide();
                        $('.tool-y-box').toggle()
                    } else if (calssName == 'Measurement-tool') {
@@ -55,16 +57,22 @@
                        $('.jimu-widget-Measurement').show();
                        $('.jimu-widget-Sign').hide();
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-Screen').hide();
                        $('.jimu-widget-Plot').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.tool-y-box').toggle()
                        $('.tool-y-box').toggle();
                        $('.jimu-widget-Rolling').hide();
                    }
                    else if (calssName == 'sign-tool') {
                    else if (calssName == 'Sign-tool') {
                        // 我的标记
                        topic.publish('openSign', 'Sign');
                        $('.jimu-widget-Rolling').hide();
                        $('.jimu-widget-Location').hide();
                        $('.jimu-widget-Sign').show();
                        $('.jimu-widget-Measurement').hide();
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-Screen').hide();
                        $('.jimu-widget-Plot').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.tool-y-box').toggle()
                        }
@@ -76,6 +84,8 @@
                        $('.jimu-widget-Rolling').show();
                        $('#widgets_Rolling_Widget_17').show();
                        $('.jimu-widget-Measurement').hide();
                        $('.jimu-widget-Screen').hide();
                        $('.jimu-widget-Plot').hide();
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.tool-y-box').toggle();
@@ -85,8 +95,11 @@
                        $('.jimu-widget-CoorPosition').show();
                        $('.jimu-widget-Location').hide();
                        $('.jimu-widget-Measurement').hide();
                        $('.jimu-widget-Rolling').hide();
                        $('.jimu-widget-Screen').hide();
                        $('.jimu-widget-Sign').hide();
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-Plot').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.tool-y-box').toggle()
                    }
@@ -94,11 +107,14 @@
                        // 地图打印
                        $('.jimu-widget-Location').hide();
                        $('.jimu-widget-MapPrinting').show();
                        $('.jimu-widget-Rolling').hide();
                        $('.jimu-widget-CoorPosition').hide();
                        $('.jimu-widget-Measurement').hide();
                        $('.jimu-widget-Sign').hide();
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-Plot').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.jimu-widget-Screen').hide();
                        $('.tool-y-box').toggle()
                    }
                    else if (calssName == 'RouteNavigate-tool') {
@@ -106,10 +122,13 @@
                        $('.jimu-widget-RouteNavigate').show();
                        $('.jimu-widget-MapPrinting').hide();
                        $('.jimu-widget-CoorPosition').hide();
                        $('.jimu-widget-Rolling').hide();
                        $('.jimu-widget-Measurement').hide();
                        $('.jimu-widget-Sign').hide();
                        $('.jimu-widget-Plot').hide();
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.jimu-widget-Screen').hide();
                        $('.tool-y-box').toggle()
                    }
                    else if (calssName == 'scene-tool') {
@@ -118,10 +137,13 @@
                        $('.jimu-widget-MapPrinting').hide();
                        $('.jimu-widget-CoorPosition').hide();
                        $('.jimu-widget-Measurement').hide();
                        $('.jimu-widget-Rolling').hide();
                        $('.jimu-widget-Sign').hide();
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.jimu-widget-scene').show();
                        $('.jimu-widget-Screen').hide();
                        $('.jimu-widget-Plot').hide();
                        $('.tool-y-box').toggle()
                    }
                    else if (calssName == 'Plot-tool') {
@@ -130,11 +152,13 @@
                        $('.jimu-widget-MapPrinting').hide();
                        $('.jimu-widget-CoorPosition').hide();
                        $('.jimu-widget-Measurement').hide();
                        $('.jimu-widget-Rolling').hide();
                        $('.jimu-widget-Sign').hide();
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.jimu-widget-scene').hide();
                        $('.jimu-widget-Plot').show();
                        $('.jimu-widget-Screen').hide();
                        $('.tool-y-box').toggle()
                    }
                    else if (calssName == 'Screen-tool') {
@@ -147,6 +171,24 @@
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.tool-y-box').toggle();
                        $('.jimu-widget-Screen').show();
                        $('.jimu-widget-Plot').hide();
                    }
                    else if (calssName == 'Plots-tool') {
                        window.dcViewer.contextMenu.enable = false;
                        // 要素标绘
                        $('.jimu-widget-RouteNavigate').hide();
                        $('.jimu-widget-MapPrinting').hide();
                        $('.jimu-widget-CoorPosition').hide();
                        $('.jimu-widget-Measurement').hide();
                        $('.jimu-widget-Rolling').hide();
                        $('.jimu-widget-Sign').hide();
                        $('.jimu-widget-FlyRoute').hide();
                        $('.jimu-widget-DynamicRiver').hide();
                        $('.jimu-widget-scene').hide();
                        $('.jimu-widget-Plot').hide();
                        $('.jimu-widget-Plots').show();
                        $('.jimu-widget-Screen').hide();
                        $('.tool-y-box').toggle()
                    }