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
\n \u603B\u91CC\u7A0B: \u7EA6' + that.itemQc + '\u516C\u91CC\n
\n '); for (var i = 0; i < that.itemXldArr.length; i++) { that.itemXldArr[i] = i + 1 + '.' + that.itemXldArr[i]; $('.route-list1').append('\n
\n
\n
' + that.itemXldArr[i] + '
\n
\n
\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
\n \u603B\u91CC\u7A0B: \u7EA6' + that.itemQc1 + '\u516C\u91CC\n
\n '); for (var i = 0; i < that.itemXldArr1.length; i++) { that.itemXldArr1[i] = i + 1 + '.' + that.itemXldArr1[i]; $('.route-list2').append('\n
\n
\n
' + that.itemXldArr1[i] + '
\n
\n
\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
\n \u603B\u91CC\u7A0B: \u7EA6' + that.itemQc2 + '\u516C\u91CC\n
\n '); for (var i = 0; i < that.itemXldArr2.length; i++) { that.itemXldArr2[i] = i + 1 + '.' + that.itemXldArr2[i]; $('.route-list3').append('\n
\n
\n
' + that.itemXldArr2[i] + '
\n
\n
\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); } }); });