From 90b0218652f797d2c22305f4de007b20681ed4a7 Mon Sep 17 00:00:00 2001 From: Surpriseplus <845948745@qq.com> Date: 星期六, 07 十月 2023 17:17:15 +0800 Subject: [PATCH] 代码更新 --- src/utils/store.js | 1 src/assets/js/rpc.js | 382 +++++++++++++++++++++++------------------------ src/components/poplayer/location.vue | 24 +- src/assets/js/mapMsg.js | 19 +- src/components/index.vue | 2 src/components/menu/leftMenu.vue | 50 +++++- 6 files changed, 249 insertions(+), 229 deletions(-) diff --git a/src/assets/js/mapMsg.js b/src/assets/js/mapMsg.js index d5015b3..98eb4eb 100644 --- a/src/assets/js/mapMsg.js +++ b/src/assets/js/mapMsg.js @@ -1,6 +1,6 @@ import mapData from "../../../static/mapData"; -import { yzAdapter_Navigation } from "../../api/api"; import rpc from "./rpc"; +import vueEvents from '@/utils/vueEvent.js' window.mapMsg = { setTimeInterval: null, testMsg(res) { @@ -16,16 +16,16 @@ init() { var that = this; window.addEventListener("message", res => { - console.log('message', res) + if (this.setTimeInterval) { + clearInterval(this.setTimeInterval); + this.setTimeInterval = null; + + } if (res.data.status === "ok") { - if (this.setTimeInterval) { - clearInterval(this.setTimeInterval); - this.setTimeInterval = null; - // - } that.setMsgMatching(res.data.params); } this.setTimeInterval = setTimeout((res) => { + vueEvents.$emit("queryData", false); rpc.setClearAllMsg(); rpc.setLineRoaming() clearInterval(this.setTimeInterval); @@ -36,7 +36,6 @@ }, //娑堟伅鍖归厤 setMsgMatching(result) { - console.log("message", result) var param = result.message; var rest = mapData.msgMach.rest; var rom = mapData.msgMach.lineRoam; @@ -49,6 +48,8 @@ // 鍦板浘澶嶄綅 if (valRest.length > 0) { + + vueEvents.$emit("queryData", false); rpc.setClearAllMsg(); rpc.setMapRest(); return @@ -60,6 +61,8 @@ } }) if (valRom.length > 0) { + + vueEvents.$emit("queryData", false); rpc.setClearAllMsg(); rpc.setLineRoaming() return diff --git a/src/assets/js/rpc.js b/src/assets/js/rpc.js index 163c5fc..a216f8b 100644 --- a/src/assets/js/rpc.js +++ b/src/assets/js/rpc.js @@ -2,8 +2,13 @@ import coord from "@/components/poplayer/coord"; import store from "@/utils/store"; import mapData from "../../../static/mapData"; -import { liushisijiayuanqudizhibianmafuwu, findAddressCandidates, getDiKuanFanWei, ent_selectByName } from "../../api/api"; -import vueEvents from '@/utils/vueEvent.js' +import { + liushisijiayuanqudizhibianmafuwu, + findAddressCandidates, + getDiKuanFanWei, + ent_selectByName +} from "../../api/api"; +import vueEvents from "@/utils/vueEvent.js"; let PoiLayerConstructor = Vue.extend(coord); const rpc = { timeout: 500, @@ -15,28 +20,30 @@ marksIndex: null, pitchValue: null, unsubscribeTicks: null, - LineRoaming: null,//绾胯矾婕父 - dataQuery: [],//鍏抽敭瀛楁煡璇㈢粨鏋� - pointerFly: null,//瀹氱偣婕父 + LineRoaming: null, //绾胯矾婕父 + dataQuery: [], //鍏抽敭瀛楁煡璇㈢粨鏋� + pointerFly: null, //瀹氱偣婕父 isShow: false, + objArr: [], //鍏抽敭瀛楁煡璇� getFuzzyQuery(res) { - if (!res.baidu_keys) return + store.queryLayer.val = res.message; this.setClearAllMsg(); + if (!res.baidu_keys) return; + var flag = true; if (this.dataQuery.length > 0) { - - if (res.message.indexOf('绗�') > -1 && res.message.indexOf('鏉�') > -1) { - var data = mapData.msgMach.localPage + if (res.message.indexOf("绗�") > -1 && res.message.indexOf("鏉�") > -1) { + var data = mapData.msgMach.localPage; + flag = false; + var val_Data = null; for (var i in data) { if (res.message.indexOf(data[i]) > -1) { - - this.setClearAllMsg(); + val_Data = this.dataQuery[i]; setTimeout(() => { - vueEvents.$emit('queryLayer', true) - this.setLocation(this.dataQuery[i]) - return + this.setLocation(val_Data); }, 1000); break; + return; } } } else { @@ -45,201 +52,172 @@ for (var j = 0; j < length; j++) { var world = keyWorld[j].word; if (name.indexOf(world) > -1) { - - this.setClearAllMsg(); - // setTimeout(() => { - vueEvents.$emit('queryLayer', true) - this.setLocation(this.dataQuery[i]) + flag = false; + this.setLocation(this.dataQuery[i]); break; - return - // }, 1000); - - + return; } } } } - - + } + if (!flag) { + return; } var keyWorld = res.baidu_keys.results; - console.log("baidu_keys", res.baidu_keys) - if (keyWorld) { var length = keyWorld.length; - vueEvents.$emit('queryLayer', false) + this.dataQuery = []; + this.objArr = []; for (var i = 0; i < length; i++) { var world = keyWorld[i].word; - console.log("world", world) + console.log("world", world); this.setFuzzyQueryData(world, i, length - 1); } } - }, async setFuzzyQueryData(res, index, length) { Promise.all([ - ent_selectByName(res),//浼佷笟 - liushisijiayuanqudizhibianmafuwu(res),//鍥尯 - findAddressCandidates(res),//鍦板潡 + ent_selectByName(res), //浼佷笟 + liushisijiayuanqudizhibianmafuwu(res), //鍥尯 + findAddressCandidates(res) //鍦板潡 ]).then(result => { - let objArr = [] - //浼佷笟 - var EntArr = result[0].result.filter((item) => { + var that = this; + store.queryLayer.data = []; + //浼乿涓� + var EntArr = result[0].result.filter(item => { return item.entName.includes(res); - }) - EntArr.forEach((val) => { + }); + EntArr.forEach(val => { let itemObj = { type: "浼佷笟", name: val.entName, address: val.address, lon: val.x, - lat: val.y, + lat: val.y }; - objArr.push(itemObj); + that.objArr.push(itemObj); }); //鍥尯 - var YQArr = result[1].candidates.filter((item) => { + var YQArr = result[1].candidates.filter(item => { return item.attributes.YQmingchen.includes(res); }); - YQArr.forEach((val) => { + YQArr.forEach(val => { let itemObj = { type: "鍥尯", name: val.attributes.YQmingchen, address: val.attributes.YQdizhi, lon: val.location.x, - lat: val.location.y, + lat: val.location.y }; - objArr.push(itemObj); + that.objArr.push(itemObj); }); //鍦板潡 - var LandArr = result[2].candidates.filter((item) => { + var LandArr = result[2].candidates.filter(item => { return item.attributes.QYMC.includes(res); - }) + }); + // 缁撴灉鏍规嵁QYMC浠庣煭鍒伴暱鎺掑簭 + LandArr.sort((a, b) => + b.attributes.QYMC.length === a.attributes.QYMC.length + ? 0 + : a.attributes.QYMC.length > b.attributes.QYMC.length + ? 1 + : -1 + ); - LandArr.forEach((val) => { + LandArr.forEach(val => { let itemObj = { type: "鍦板潡", name: val.attributes.QYMC, area: val.attributes.area, + code: val.attributes["鍦板潡缂�"], lon: val.location.x, - lat: val.location.y, + lat: val.location.y }; - objArr.push(itemObj); + that.objArr.push(itemObj); }); - console.log(EntArr); - console.log(YQArr); - console.log(LandArr); - console.log(objArr); - debugger - }) + if (index == length) { + if (that.objArr.length <= 0) { - // var data = await - // if (data.candidates.length <= 0) { - // this.setClearAllMsg(); - // this.getLandmass(res) - // } else { - // this.getFuzzyQueryData(data.candidates, index, length, 1) - // } + vueEvents.$emit("queryData", true); + return; + } + var num = that.objArr.length; + for (var i = 0; i < num; i++) { + if (i < 6) { + that.dataQuery.push(that.objArr[i]); + } + } + store.queryLayer.data = that.dataQuery; + that.setClearAllMsg(); + setTimeout(() => { + vueEvents.$emit("queryData", true); + that.setLocation(that.dataQuery[0]); + }, 1000); + } + }); }, getFuzzyQueryData(res, index, length, flag) { - if (!res || res.length <= 0) return + if (!res || res.length <= 0) return; for (var i in res) { if (this.dataQuery.length < 6) { - this.dataQuery.push(res[i]) + this.dataQuery.push(res[i]); } } if (index == length) { if (this.dataQuery.length <= 0) { - vueEvents.$emit('queryLayer', false) - return + vueEvents.$emit("queryData", false); + return; } - store.queryLayer.data = this.dataQuery; - this.setClearAllMsg(); - vueEvents.$emit('queryLayer', true) - setTimeout(() => { - this.setLocation(this.dataQuery[0]) + this.setClearAllMsg(); + + setTimeout(() => { + vueEvents.$emit("queryData", true); + this.setLocation(this.dataQuery[0]); }, 1000); } }, // 鏄剧ず鍦板潡鑼冨洿 getLandmass(res) { let that = this; - findAddressCandidates(res).then((locationInfo) => { - - - // if (locationInfo.candidates.length > 0) { - // // 鍒掔嚎 - // getDiKuanFanWei( - // locationInfo.candidates[0].location.x, - // locationInfo.candidates[0].location.y - // ).then((response) => { - // let center = { lon: 0, lat: 0 }; - // let polygon = that.read(response.geometry); - // if (polygon.length > 0) { - // var geometry = []; - // let points = polygon[0].split(","); - // for (let i = 0; i < points.length; i++) { - // let point = points[i].replace(/^\s+|\s+$/g, "").split(" "); - // center.lon += parseFloat(point[0]) / points.length; - // center.lat += parseFloat(point[1]) / points.length; - // geometry.push({ - // x: parseFloat(point[0]), - // y: parseFloat(point[1]), - // z: 0, - // }); - // } - // if (that.lacationLine) { - // sgworld.Creator.DeleteObject(that.lacationLine); - // line = null; - // } - // that.lacationLine = sgworld.Creator.createPolyline( - // geometry, - // "#ff0000", - // 1, - // 0, - // "绾�" - // ); - // } - // }); - - // var objdata = { - // POITYPE: "dikuaixinxi", - // name: locationInfo.candidates[0].attributes.QYMC, - // yijilei: locationInfo.candidates[0].attributes.yijilei, - // yongdixing: locationInfo.candidates[0].attributes["鐢ㄥ湴鎬�"], - // // LXR: locationInfo.candidates[0].name, - // // DIZHI: locationInfo.candidates[0].address, - // lat: locationInfo.candidates[0].location.y, - // lon: locationInfo.candidates[0].location.x, - // }; - // // //娣诲姞瀹氫綅寮圭獥 - // that.setAddPointLocation(objdata); - // // 寮规 - // console.log(objdata); - // debugger; - // } else { - // this.getAllEntity(res) - // } + // 鍒掔嚎 + getDiKuanFanWei(res.lon, res.lat).then(response => { + let center = { lon: 0, lat: 0 }; + let polygon = that.read(response.geometry); + if (polygon.length > 0) { + var geometry = []; + let points = polygon[0].split(","); + for (let i = 0; i < points.length; i++) { + let point = points[i].replace(/^\s+|\s+$/g, "").split(" "); + center.lon += parseFloat(point[0]) / points.length; + center.lat += parseFloat(point[1]) / points.length; + geometry.push({ + x: parseFloat(point[0]), + y: parseFloat(point[1]), + z: 0 + }); + } + if (that.lacationLine) { + sgworld.Creator.DeleteObject(that.lacationLine); + that.lacationLine = null; + } + that.lacationLine = sgworld.Creator.createPolyline( + geometry, + "#ff0000", + 1, + 0, + "绾�" + ); + } }); }, - async getAllEntity(res) { - var obj = { - request: "bdPoi", - query: res, - output: "json", - coord: "cgcs2000", - page_num: 0, - page_size: 20, - } - const data = await yzAdapter_Navigation(obj) - debugger - }, + read(wkt) { var regExes = { typeStr: /^\s*(\w+)\s*\(\s*(.*)\s*\)\s*$/, @@ -247,7 +225,7 @@ spaces: /\s+/, parenComma: /\)\s*,\s*\(/, doubleParenComma: /\)\s*\)\s*,\s*\(\s*\(/, // can't use {2} here - trimParens: /^\s*\(?(.*?)\)?\s*$/, + trimParens: /^\s*\(?(.*?)\)?\s*$/ }; /** * Object with properties corresponding to the geometry types. Property values @@ -314,7 +292,7 @@ coords = points[i].trim().split(regExes.spaces); components.push([ Number.parseFloat(coords[0]), - Number.parseFloat(coords[1]), + Number.parseFloat(coords[1]) ]); } return components; @@ -339,7 +317,7 @@ coords = points[i].trim().split(regExes.spaces); components.push([ Number.parseFloat(coords[0]), - Number.parseFloat(coords[1]), + Number.parseFloat(coords[1]) ]); } return components; @@ -416,7 +394,7 @@ components.push(parse$1.polygon(polygon)); } return components; - }, + } }; var geometry, type, str; @@ -441,22 +419,21 @@ return geometry; }, - //鍦板浘澶嶄綅 setMapRest() { const data = mapData.mapRest; sgworld.Navigate.flyToPointsInterest({ destination: { - "x": data.lng, - "y": data.lat, - "z": data.alt, + x: data.lng, + y: data.lat, + z: data.alt }, orientation: { heading: data.heading, pitch: data.pitch, - roll: data.roll, + roll: data.roll }, - duration: 8, //椋炶鏃堕棿8s + duration: 8 //椋炶鏃堕棿8s }); }, @@ -468,7 +445,7 @@ this.setShowPathLine(valdata); var geom = []; for (var i in valdata) { - geom.push(valdata[i].lng, valdata[i].lat, valdata[i].height) + geom.push(valdata[i].lng, valdata[i].lat, valdata[i].height); } var that = this; @@ -480,47 +457,55 @@ data.height = 75; data.speed = 25; - that.LineRoaming = sgworld.Creator.createDynamicObject(data, null, (res) => { - if (res.time >= res.Totaltime) { - that.setCloseLineRomaing(); - that.setMapRest() - + that.LineRoaming = sgworld.Creator.createDynamicObject( + data, + null, + res => { + if (res.time >= res.Totaltime) { + that.setCloseLineRomaing(); + that.setMapRest(); + } } - }) - }) + ); + }); }, //鐐瑰嚮鑾峰彇鍧愭爣 clickToCoordinates() { - const handlerClick = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas); - handlerClick.setInputAction((event) => { - - let cartesian = Viewer.camera.pickEllipsoid(event.position, Viewer.scene.globe.ellipsoid); + const handlerClick = new Cesium.ScreenSpaceEventHandler( + Viewer.scene.canvas + ); + handlerClick.setInputAction(event => { + let cartesian = Viewer.camera.pickEllipsoid( + event.position, + Viewer.scene.globe.ellipsoid + ); if (cartesian == undefined) { - console.log('娌℃湁鑾峰彇鍒板潗鏍�') + console.log("娌℃湁鑾峰彇鍒板潗鏍�"); } else { // 绌洪棿鍧愭爣杞笘鐣屽潗鏍�(寮у害) let cartographic = Cesium.Cartographic.fromCartesian(cartesian); // 寮у害杞负瑙掑害锛堢粡绾害锛� - let lon = Cesium.Math.toDegrees(cartographic.longitude); // 缁忓害鍊� - let lat = Cesium.Math.toDegrees(cartographic.latitude); // 绾害鍊� - console.log('缁忕含搴︽槸锛�', { x: lon, y: lat }); + let lon = Cesium.Math.toDegrees(cartographic.longitude); // 缁忓害鍊� + let lat = Cesium.Math.toDegrees(cartographic.latitude); // 绾害鍊� + console.log("缁忕含搴︽槸锛�", { x: lon, y: lat }); } }, Cesium.ScreenSpaceEventType.LEFT_CLICK); }, //瀹氫綅寮圭獥 setLocation(res) { - var objdata = { - name: res.attributes.YQmingchen, - address: res.attributes.YQdizhi, - // LXR: res.name, - // DIZHI: res.address, - lat: res.location.y, - lon: res.location.x + name: res.name, + address: res.address, + area: res.area, + code: res.code, + lat: res.lat, + lon: res.lon }; //娣诲姞瀹氫綅寮圭獥 this.setAddPointLocation(objdata); + //鑼冨洿璋冪敤 + this.getLandmass(res); }, setAddPointLocation(res) { @@ -569,11 +554,10 @@ duration: 3 }); setTimeout(() => { - window.Viewer.entities.remove(this.position) - + window.Viewer.entities.remove(this.position); }, 1000); setTimeout(() => { - this.setPointFly(res) + this.setPointFly(res); }, 4000); }, setflyExtent(res) { @@ -622,13 +606,13 @@ res[this.marksIndex].height ); - console.log(1, pitch) + console.log(1, pitch); window.Viewer.scene.camera.setView({ destination: endPosition, orientation: { heading: heading, - pitch: Cesium.Math.toRadians(-5), - }, + pitch: Cesium.Math.toRadians(-5) + } }); if ( Cesium.JulianDate.compare( @@ -636,38 +620,38 @@ window.Viewer.clock.stopTime ) >= 0 ) { - this.unsubscribeTicks = window.Viewer.clock.onTick.removeEventListener(Exection); + this.unsubscribeTicks = window.Viewer.clock.onTick.removeEventListener( + Exection + ); this.changeCameraHeading(res); } - - - } + }; window.Viewer.clock.onTick.addEventListener(Exection); }, setPointFly(res) { var that = this; - this.pointerFly = window.sgworld.Analysis.setPointFly({ + that.pointerFly = window.sgworld.Analysis.setPointFly({ position: Cesium.Cartesian3.fromDegrees(res.lon, res.lat, 200), - // scale: 0, hideImage: true, + time: 120, limitTime: true, - time: 4, + limitAngel: 120, end: () => { - that.pointerFly = null + that.pointerFly = null; } - - }) - + }); + setTimeout(() => { + this.setClearPointFly(); + }, 5000); }, changeCameraHeading(res) { - var nextIndex = this.marksIndex + 1; if (this.marksIndex == res.length - 1) { if (this.unsubscribeTicks) { window.Viewer.clock.onTick.removeEventListener(this.unsubscribeTicks); this.unsubscribeTicks = null; } - return + return; } // 璁$畻涓ょ偣涔嬮棿鐨勬柟鍚� var heading = this.bearing( @@ -695,8 +679,8 @@ window.Viewer.scene.camera.setView({ orientation: { heading: heading, - pitch: Cesium.Math.toRadians(-5), - }, + pitch: Cesium.Math.toRadians(-5) + } }); if ( Cesium.JulianDate.compare( @@ -781,13 +765,17 @@ this.instance && this.instance.$destroy(); this.instance = null; } + if (this.lacationLine) { + sgworld.Creator.DeleteObject(this.lacationLine); + this.lacationLine = null; + } // 杞ㄨ抗绾� this.setClosePathLine(); // 婕父 this.setCloseLineRomaing(); //瀹氱偣婕父 - this.setClearPointFly() - vueEvents.$emit('queryLayer', false) + this.setClearPointFly(); + vueEvents.$emit("queryLayer", false); }, setClearPointFly() { if (this.pointerFly) { @@ -798,13 +786,13 @@ setCloseLineRomaing() { if (this.LineRoaming) { this.LineRoaming && this.LineRoaming.exit(); - this.LineRoaming = null + this.LineRoaming = null; } }, setClosePathLine() { if (this.pathLayer) { this.pathLayer && this.pathLayer.deleteObject(); } - }, + } }; export default rpc; diff --git a/src/components/index.vue b/src/components/index.vue index ddb8f47..c808db6 100644 --- a/src/components/index.vue +++ b/src/components/index.vue @@ -5,7 +5,7 @@ v-show="false" /> <bottommenu /> - <left-menu v-if="queryShow"></left-menu> + <left-menu></left-menu> <viewer class="mapViewer" /> </div> </template> diff --git a/src/components/menu/leftMenu.vue b/src/components/menu/leftMenu.vue index 0acecf7..30adad1 100644 --- a/src/components/menu/leftMenu.vue +++ b/src/components/menu/leftMenu.vue @@ -1,12 +1,26 @@ <template> + <div class="menuBox"> - <ul> + <div v-if="list.length==0 && val==null"> + + </div> + <div + class="boxCntent" + v-else-if="list.length == 0" + >{{val }} 鏁版嵁姝e湪琛ュ厖涓�</div> + <ul + class="boxCntent" + v-if="list.length != 0" + > <li v-for="(item,index) in list"> <div> - {{item.attributes.YQmingchen }} + {{item.name}} </div> - <div> - {{item.attributes.YQdizhi}} + <div v-if="item.address"> + 鍦板潃锛� {{item.address}} + </div> + <div v-if="item.code"> + 鍦板潡缂栧彿锛� {{item.code}} </div> </li> </ul> @@ -15,15 +29,30 @@ <script> import store from "@/utils/store"; +import vueEvents from '@/utils/vueEvent.js' export default { data() { return { - list: [] + list: [], + val: null } }, mounted() { + vueEvents.$on('queryData', (res) => { + this.list = []; + this.val = null; + if (res) { - this.list = store.queryLayer.data; + if (store.queryLayer.data) { + this.list = store.queryLayer.data + + } + this.val = store.queryLayer.val + } + + + + }) } } @@ -31,8 +60,6 @@ <style> .menuBox { - padding: 1%; - border-radius: 3px; background-image: url("~@/assets/img/new/listbg.png"); background-size: 100% 100%; @@ -41,11 +68,14 @@ bottom: 45px; right: 310px; width: 300px; -} -li { color: white; font-family: Source Han Sans SC; font-size: 16px; +} +.boxCntent { + margin: 1%; +} +li { padding: 10px; border: 1px solid gray; margin-top: 2px; diff --git a/src/components/poplayer/location.vue b/src/components/poplayer/location.vue index c67b803..52e990e 100644 --- a/src/components/poplayer/location.vue +++ b/src/components/poplayer/location.vue @@ -7,21 +7,19 @@ ></div> <div class="content"> <div class="ssdw">{{ state.list.name }}</div> - <div v-if="state.list.POITYPE == 'dikuaixinxi'"> - <div class="dz"> - {{ state.list.name }} - </div> - <div class="dz"> - {{ state.list.yijilei }} - </div> - <div class="dz"> - {{ state.list.yongdixing }} - </div> - </div> + <div - v-else - class="dz" + class="lxr" + v-if=" state.list.address" >鍦板潃锛歿{ state.list.address }}</div> + <div + class="lxr" + v-if=" state.list.code" + >鍦板潡缂栧彿锛歿{ state.list.code }}</div> + <div + class="lxr" + v-if=" state.list.area" + >鍦板潡闈㈢Н锛歿{ state.list.area }} 骞虫柟绫�</div> </div> </div> </div> diff --git a/src/utils/store.js b/src/utils/store.js index 68e01e7..e33ba81 100644 --- a/src/utils/store.js +++ b/src/utils/store.js @@ -11,6 +11,7 @@ queryLayer: { data: null, isShow: false, + val: null, }, setPoplayerListAction(newValue) { if (this.debug) { } -- Gitblit v1.9.3