From b0623031f7839e3f5b061f712c6ead91f57db5cf Mon Sep 17 00:00:00 2001 From: Surpriseplus <845948745@qq.com> Date: 星期日, 08 十月 2023 15:42:37 +0800 Subject: [PATCH] 地块展示效果优化 --- src/assets/js/rpc.js | 621 +++++++++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 540 insertions(+), 81 deletions(-) diff --git a/src/assets/js/rpc.js b/src/assets/js/rpc.js index e3377ed..939495f 100644 --- a/src/assets/js/rpc.js +++ b/src/assets/js/rpc.js @@ -2,10 +2,16 @@ 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"; let PoiLayerConstructor = Vue.extend(coord); -window.rpc = { +const rpc = { timeout: 500, - url: "http://localhost:8999/RPC2", method: "get_statue", divPoint: null, instance: null, @@ -13,85 +19,498 @@ position: null, marksIndex: null, pitchValue: null, - //娑堟伅瀵规帴 - initMessage() { - var that = this; - window.addEventListener("message", res => { - if (res.data.status === "ok") { - console.log(res.data.params, "褰撳墠浜嬩欢鏁版嵁"); - // that.setLocation(); + unsubscribeTicks: null, + LineRoaming: null, //绾胯矾婕父 + dataQuery: [], //鍏抽敭瀛楁煡璇㈢粨鏋� + pointerFly: null, //瀹氱偣婕父 + isShow: false, + objArr: [], + //鍏抽敭瀛楁煡璇� + getFuzzyQuery(res) { + 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; + flag = false; + var val_Data = null; + for (var i in data) { + if (res.message.indexOf(data[i]) > -1) { + val_Data = this.dataQuery[i]; + setTimeout(() => { + this.setLocation(val_Data); + }, 1000); + break; + return; + } + } + } else { + for (var i in this.dataQuery) { + var name = this.dataQuery[i].name; + for (var j = 0; j < length; j++) { + var world = keyWorld[j].word; + if (name.indexOf(world) > -1) { + flag = false; + this.setLocation(this.dataQuery[i]); + break; + return; + } + } + } + } + } + if (!flag) { + return; + } + var keyWorld = res.baidu_keys.results; + if (keyWorld) { + var length = keyWorld.length; + + this.dataQuery = []; + this.objArr = []; + for (var i = 0; i < length; i++) { + var world = keyWorld[i].word; + console.log("world", world); + this.setFuzzyQueryData(world, i, length - 1); + } + } + }, + async setFuzzyQueryData(res, index, length) { + Promise.all([ + ent_selectByName(res), //浼佷笟 + liushisijiayuanqudizhibianmafuwu(res), //鍥尯 + findAddressCandidates(res) //鍦板潡 + ]).then(result => { + var that = this; + store.queryLayer.data = []; + //浼佷笟 + var EntArr = result[0].result.filter(item => { + return item.entName.includes(res); + }); + EntArr.forEach(val => { + let itemObj = { + type: "浼佷笟", + name: val.entName, + address: val.address, + lon: val.x, + lat: val.y + }; + that.objArr.push(itemObj); + }); + //鍥尯 + var YQArr = result[1].candidates.filter(item => { + return item.attributes.YQmingchen.includes(res); + }); + YQArr.forEach(val => { + let itemObj = { + type: "鍥尯", + name: val.attributes.YQmingchen, + address: val.attributes.YQdizhi, + lon: val.location.x, + lat: val.location.y + }; + that.objArr.push(itemObj); + }); + //鍦板潡 + 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) => { + let itemObj = { + type: "鍦板潡", + name: val.attributes.QYMC, + area: val.attributes.area, + code: val.attributes["鍦板潡缂�"], + lon: val.location.x, + lat: val.location.y, + }; + that.objArr.push(itemObj); + }); + if (index == length) { + if (that.objArr.length <= 0) { + + 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; + for (var i in res) { + if (this.dataQuery.length < 6) { + this.dataQuery.push(res[i]); + } + } + if (index == length) { + if (this.dataQuery.length <= 0) { + vueEvents.$emit("queryData", false); + return; + } + + store.queryLayer.data = this.dataQuery; + + this.setClearAllMsg(); + + setTimeout(() => { + vueEvents.$emit("queryData", true); + this.setLocation(this.dataQuery[0]); + }, 1000); + } + }, + // 鏄剧ず鍦板潡鑼冨洿 + getLandmass(res) { + + let that = this; + if (res.type == "鍥尯") { + + } else if (res.type == "鍦板潡") { + + 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(parseFloat(point[0]), parseFloat(point[1])) + + } + that.setLacationLineClear() + var position = Cesium.Cartesian3.fromDegreesArray(geometry) + + that.lacationLine = Viewer.entities.add({ + name: "绔嬩綋澧欐晥鏋�", + wall: { + positions: position, + + + material: new Cesium.DynamicWallMaterialProperty({ + color: Cesium.Color.RED, + duration: 4000 + }), + // 璁剧疆楂樺害 + maximumHeights: Array(position.length).fill(80), + minimumHeights: Array(position.length).fill(10), + } + }) + } + }); + } + }, + + read(wkt) { + var regExes = { + typeStr: /^\s*(\w+)\s*\(\s*(.*)\s*\)\s*$/, + emptyTypeStr: /^\s*(\w+)\s*EMPTY\s*$/, + spaces: /\s+/, + parenComma: /\)\s*,\s*\(/, + doubleParenComma: /\)\s*\)\s*,\s*\(\s*\(/, // can't use {2} here + trimParens: /^\s*\(?(.*?)\)?\s*$/ + }; + /** + * Object with properties corresponding to the geometry types. Property values + * are functions that do the actual parsing. + * @private + */ + var parse$1 = { + /** + * Return point geometry given a point WKT fragment. + * + * @param {String} str A WKT fragment representing the point. + * @return {Point} A point geometry. + * @private + */ + point: function point(str) { + if (str === undefined) { + return []; + } + + var coords = str.trim().split(regExes.spaces); + return [Number.parseFloat(coords[0]), Number.parseFloat(coords[1])]; + }, + + /** + * Return a multipoint geometry given a multipoint WKT fragment. + * + * @param {String} str A WKT fragment representing the multipoint. + * @return {Point} A multipoint feature. + * @private + */ + multipoint: function multipoint(str) { + var this$1 = this; + + if (str === undefined) { + return []; + } + + var point; + var points = str.trim().split(","); + var components = []; + for (var i = 0, len = points.length; i < len; ++i) { + point = points[i].replace(regExes.trimParens, "$1"); + components.push(parse$1.point(point)); + } + return components; + }, + + /** + * Return a linestring geometry given a linestring WKT fragment. + * + * @param {String} str A WKT fragment representing the linestring. + * @return {LineString} A linestring geometry. + * @private + */ + linestring: function linestring(str) { + if (str === undefined) { + return []; + } + + var points = str.trim().split(","); + var components = []; + var coords; + for (var i = 0, len = points.length; i < len; ++i) { + coords = points[i].trim().split(regExes.spaces); + components.push([ + Number.parseFloat(coords[0]), + Number.parseFloat(coords[1]) + ]); + } + return components; + }, + + /** + * Return a linearring geometry given a linearring WKT fragment. + * + * @param {String} str A WKT fragment representing the linearring. + * @return {LinearRing} A linearring geometry. + * @private + */ + linearring: function linearring(str) { + if (str === undefined) { + return []; + } + + var points = str.trim().split(","); + var components = []; + var coords; + for (var i = 0, len = points.length; i < len; ++i) { + coords = points[i].trim().split(regExes.spaces); + components.push([ + Number.parseFloat(coords[0]), + Number.parseFloat(coords[1]) + ]); + } + return components; + }, + + /** + * Return a multilinestring geometry given a multilinestring WKT fragment. + * + * @param {String} str A WKT fragment representing the multilinestring. + * @return {MultiLineString} A multilinestring geometry. + * @private + */ + multilinestring: function multilinestring(str) { + var this$1 = this; + + if (str === undefined) { + return []; + } + + var line; + var lines = str.trim().split(regExes.parenComma); + var components = []; + for (var i = 0, len = lines.length; i < len; ++i) { + line = lines[i].replace(regExes.trimParens, "$1"); + components.push(parse$1.linestring(line)); + } + return components; + }, + + /** + * Return a polygon geometry given a polygon WKT fragment. + * + * @param {String} str A WKT fragment representing the polygon. + * @return {Polygon} A polygon geometry. + * @private + */ + polygon: function polygon(str) { + var this$1 = this; + + if (str === undefined) { + return []; + } + + var ring, linestring, linearring; + var rings = str.trim().split(regExes.parenComma); + var shell; + var holes = []; + //for (var i = 0, len = rings.length; i < len; ++i) { + ring = rings[0].replace(regExes.trimParens, "$1"); + linestring = ring; + //} + return linestring; + }, + + /** + * Return a multipolygon geometry given a multipolygon WKT fragment. + * + * @param {String} str A WKT fragment representing the multipolygon. + * @return {MultiPolygon} A multipolygon geometry. + * @private + */ + multipolygon: function multipolygon(str) { + var this$1 = this; + + if (str === undefined) { + return []; + } + + var polygon; + var polygons = str.trim().split(regExes.doubleParenComma); + var components = []; + for (var i = 0, len = polygons.length; i < len; ++i) { + polygon = polygons[i].replace(regExes.trimParens, "$1"); + components.push(parse$1.polygon(polygon)); + } + return components; + } + }; + + var geometry, type, str; + wkt = wkt.replace(/[\n\r]/g, " "); + var matches = regExes.typeStr.exec(wkt); + if (wkt.search("EMPTY") !== -1) { + matches = regExes.emptyTypeStr.exec(wkt); + matches[2] = undefined; + } + if (matches) { + type = matches[1].toLowerCase(); + str = matches[2]; + if (parse$1[type]) { + geometry = parse$1[type].apply(this, [str]); + } + } + + if (geometry === undefined) { + throw new Error("Could not parse WKT " + wkt); + } + + 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: 5, //椋炶鏃堕棿8s + duration: 8 //椋炶鏃堕棿8s + }); + }, + + //鍔ㄧ敾瀵艰埅 + setLineRoaming() { + var valdata = mapData.animaNavigation; + this.marksIndex = 1; + this.pitchValue = -20; + this.setShowPathLine(valdata); + var geom = []; + for (var i in valdata) { + geom.push(valdata[i].lng, valdata[i].lat, valdata[i].height); + } + + var that = this; + sgworld.Creator.getFlyData(geom, data => { + data.showPoint = false; + data.showLine = false; + data.mode = 1; + data.pitch = -10; + data.height = 75; + data.speed = 25; + + 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() { - var data = mapData.pointPop; + setLocation(res) { var objdata = { - POITYPE: data.text, - SSDW: data.text, - LXR: data.text, - DIZHI: res, - lat: data.lat, - lon: data.lng + name: res.name, + address: res.address, + area: res.area, + code: res.code, + lat: res.lat, + lon: res.lon }; + //娣诲姞瀹氫綅寮圭獥 this.setAddPointLocation(objdata); - // //娣诲姞璺緞绾� - // this.setShowPathLine(marks); - // //椋炶婕父 - // window.Viewer.scene.camera.flyTo({ - // destination: Cesium.Cartesian3.fromDegrees( - // marks[0].lng, - // marks[0].lat, - // marks[0].height - // ), //瀹氫綅鍧愭爣鐐癸紝寤鸿浣跨敤璋锋瓕鍦扮悆鍧愭爣浣嶇疆鏃犲亸宸� - // duration: 7 //瀹氫綅鐨勬椂闂撮棿闅� - // }); - // this.marksIndex = 1; - // this.pitchValue = -20; - // setTimeout(() => { - // this.setflyExtent(marks); - // }, 7000); - + //鑼冨洿璋冪敤 + this.getLandmass(res); }, setAddPointLocation(res) { // 娓呴櫎鏂规硶 - this.setClearPathlayer(); store.setlocalLayerShowAction(false); store.setlocalLayerListAction({}); store.setlocalLayerShowAction(true); @@ -119,7 +538,7 @@ ); this.position = window.Viewer.entities.add({ name: "FLYToMap", - position: Cesium.Cartesian3.fromDegrees(objdata.lon, objdata.lat), + position: Cesium.Cartesian3.fromDegrees(res.lon, res.lat, 200), point: { pixelSize: 1, color: Cesium.Color.WHITE.withAlpha(0), @@ -131,15 +550,22 @@ offset: { heading: Cesium.Math.toRadians(0.0), pitch: Cesium.Math.toRadians(-45), - range: 600 - } + range: 700 + }, + duration: 3 }); setTimeout(() => { - window.Viewer.entities.remove(this.position) + window.Viewer.entities.remove(this.position); }, 1000); + setTimeout(() => { + this.setPointFly(res); + }, 4000); }, setflyExtent(res) { - + if (this.unsubscribeTicks) { + window.Viewer.clock.onTick.removeEventListener(this.unsubscribeTicks); + this.unsubscribeTicks = null; + } // 鐩告満鐪嬬偣鐨勮搴︼紝濡傛灉澶т簬0閭d箞鍒欐槸浠庡湴搴曞線涓婄湅锛屾墍浠ヨ涓鸿礋鍊� var pitch = Cesium.Math.toRadians(this.pitchValue); // 鏃堕棿闂撮殧2绉掗挓 @@ -181,13 +607,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( @@ -195,30 +621,38 @@ window.Viewer.clock.stopTime ) >= 0 ) { - window.Viewer.clock.onTick.removeEventListener(Exection); + this.unsubscribeTicks = window.Viewer.clock.onTick.removeEventListener( + Exection + ); this.changeCameraHeading(res); } - - - } + }; window.Viewer.clock.onTick.addEventListener(Exection); }, - setPointFly() { - var alll - = { lng: 116.802948, lat: 36.550064, height: 100, flytime: 15 } - - window.sgworld.Analysis.setPointFly({ - position: Cesium.Cartesian3.fromDegrees(alll.lng, alll.lat, 50), - hideImage: false - }) - + setPointFly(res) { + var that = this; + that.pointerFly = window.sgworld.Analysis.setPointFly({ + position: Cesium.Cartesian3.fromDegrees(res.lon, res.lat, 200), + hideImage: true, + time: 120, + limitTime: true, + limitAngel: 120, + end: () => { + that.pointerFly = null; + } + }); + setTimeout(() => { + this.setClearPointFly(); + }, 8000); }, changeCameraHeading(res) { var nextIndex = this.marksIndex + 1; if (this.marksIndex == res.length - 1) { - // 婕父瀹屾垚 - this.setPointFly(res); - return + if (this.unsubscribeTicks) { + window.Viewer.clock.onTick.removeEventListener(this.unsubscribeTicks); + this.unsubscribeTicks = null; + } + return; } // 璁$畻涓ょ偣涔嬮棿鐨勬柟鍚� var heading = this.bearing( @@ -246,8 +680,8 @@ window.Viewer.scene.camera.setView({ orientation: { heading: heading, - pitch: Cesium.Math.toRadians(-5), - }, + pitch: Cesium.Math.toRadians(-5) + } }); if ( Cesium.JulianDate.compare( @@ -282,8 +716,6 @@ toDegrees(radians) { return (radians * 180) / Math.PI; }, - - setExtentTime(time) { var startTime = Cesium.JulianDate.fromDate(new Date()); var stopTime = Cesium.JulianDate.addSeconds( @@ -324,8 +756,8 @@ far: 50000 }); }, - - setClearPathlayer() { + //缁撴潫浜嬩欢 + setClearAllMsg() { if (this.divPoint) { this.divPoint && this.divPoint.deleteObject(); this.divPoint = null; @@ -334,12 +766,39 @@ this.instance && this.instance.$destroy(); this.instance = null; } + //鍦板潡 + this.setLacationLineClear() + // 杞ㄨ抗绾� + this.setClosePathLine(); + // 婕父 + this.setCloseLineRomaing(); + //瀹氱偣婕父 + this.setClearPointFly(); + vueEvents.$emit("queryLayer", false); + }, + + + setLacationLineClear() { + if (this.lacationLine) { + Viewer.entities.remove(this.lacationLine) + this.lacationLine = null; + } + }, + setClearPointFly() { + if (this.pointerFly) { + this.pointerFly && this.pointerFly.end(); + this.pointerFly = null; + } + }, + setCloseLineRomaing() { + if (this.LineRoaming) { + this.LineRoaming && this.LineRoaming.exit(); + this.LineRoaming = null; + } + }, + setClosePathLine() { if (this.pathLayer) { this.pathLayer && this.pathLayer.deleteObject(); - } - if (this.position) { - window.Viewer.entities.remove(this.position); - this.position = null; } } }; -- Gitblit v1.9.3