From fcb9ad20cfb4f1d691f76f575e3bcf09729be7c9 Mon Sep 17 00:00:00 2001 From: lixuliang <lixuliang_hd@126.com> Date: 星期三, 13 十二月 2023 16:51:16 +0800 Subject: [PATCH] 最新 --- src/components/menu/tools/special.vue | 487 +++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 412 insertions(+), 75 deletions(-) diff --git a/src/components/menu/tools/special.vue b/src/components/menu/tools/special.vue index f82c78e..e9ef033 100644 --- a/src/components/menu/tools/special.vue +++ b/src/components/menu/tools/special.vue @@ -2,28 +2,52 @@ <div class="special" id="special"> <div class="specialTools"> <div class="specialTool" @click="tdglHandle"> - <el-tooltip class="item" effect="dark" content="鍦熷湴绠$悊" placement="top-start" popper-class="item_tooltip"> + <el-tooltip + class="item" + effect="dark" + content="鍦熷湴绠$悊" + placement="top-start" + popper-class="item_tooltip" + > <el-button> <img src="@/assets/img/left/ztfx/tdgl.png" /> </el-button> </el-tooltip> </div> <div class="specialTool" @click="stdsj"> - <el-tooltip class="item" effect="dark" content="瑙嗗浘澶ф暟鎹钩鍙�" placement="top-start" popper-class="item_tooltip"> + <el-tooltip + class="item" + effect="dark" + content="瑙嗗浘澶ф暟鎹钩鍙�" + placement="top-start" + popper-class="item_tooltip" + > <el-button> <img src="@/assets/img/left/ztfx/dashuju.png" /> </el-button> </el-tooltip> </div> <div class="specialTool" @click="spjkHandle"> - <el-tooltip class="item" effect="dark" content="瑙嗛鐩戞帶" placement="top-start" popper-class="item_tooltip"> + <el-tooltip + class="item" + effect="dark" + content="瑙嗛鐩戞帶" + placement="top-start" + popper-class="item_tooltip" + > <el-button> <img src="@/assets/img/left/ztfx/spjk.png" /> </el-button> </el-tooltip> </div> <div class="specialTool" @click="jjHandle"> - <el-tooltip class="item" effect="dark" content="琛楁櫙" placement="top-start" popper-class="item_tooltip"> + <el-tooltip + class="item" + effect="dark" + content="琛楁櫙" + placement="top-start" + popper-class="item_tooltip" + > <el-button> <img src="@/assets/img/left/ztfx/jiejing.png" /> </el-button> @@ -31,12 +55,26 @@ </div> <div class="specialTool" @click="qytj"> - <el-tooltip class="item" effect="dark" content="鏁版嵁姹囪仛" placement="top-start" popper-class="item_tooltip"> - <el-button> <img src="@/assets/img/left/ztfx/yqfk.png" /> </el-button></el-tooltip> + <el-tooltip + class="item" + effect="dark" + content="鏁版嵁姹囪仛" + placement="top-start" + popper-class="item_tooltip" + > + <el-button> <img src="@/assets/img/left/ztfx/yqfk.png" /> </el-button + ></el-tooltip> </div> <div class="specialTool" @click="rangeQuery()"> - <el-tooltip class="item" effect="dark" content="鑼冨洿鏌ヨ" placement="top-start" popper-class="item_tooltip"> - <el-button> <img src="@/assets/img/left/ztfx/sjxq.png" /> </el-button></el-tooltip> + <el-tooltip + class="item" + effect="dark" + content="鑼冨洿鏌ヨ" + placement="top-start" + popper-class="item_tooltip" + > + <el-button> <img src="@/assets/img/left/ztfx/sjxq.png" /> </el-button + ></el-tooltip> </div> <!-- <div class="specialTool" @click="guanxian(openGX)"> <el-tooltip @@ -186,25 +224,35 @@ background: rgba(0, 168, 255, 0.16); } </style> - +<style> +#pointInfoBox { + /* width: 350px; */ + padding: 20px; + text-align: left; + background-image: url("~@/assets/img/new/listbg.png"); + /* border: 5px #08235f solid; */ + /* border-radius: 7px; */ + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.5); + color: #fff; +} +</style> <script> import axios from "axios"; import { mapState, mapMutations } from "vuex"; import Bus from "../../tools/Bus"; import { roman } from "../../../assets/json/index.js"; import URLInCode from "@/assets/js/urlInCode"; +import keyName from "@/utils/poiKeys"; let handler; -let pickFeature; let tooltipHTML; -let divPoint1; -let imgUrl; -let scale; +window.divPoint1 = null; +window.pickFeature = null; +window.imgUrl = null; +window.scale = null; +let buildingPolygon; let tooltip; let lineArr = []; let video; -let video2; -let video3; -let video4; let promiseS3M; //浜ら�氬浘灞� let panoramaLayer; @@ -318,7 +366,7 @@ ...mapState(["viewer1Show", "yqfk", "cesiumInit"]), ...mapState(["viewer1Show", "yqfk", "qyEchartsShow"]), }, - mounted() { }, + mounted() {}, watch: { cesiumInit: { handler(newVal, oldVal) { @@ -393,7 +441,7 @@ sgworld.drawObj && (sgworld.drawObj.drawHandler && sgworld.drawObj.drawHandler.destroy(), - sgworld.drawObj.end && sgworld.drawObj.end()); + sgworld.drawObj.end && sgworld.drawObj.end()); let props = pick.id.properties; let screenHeight = @@ -472,7 +520,7 @@ {}, "0", true, - function () { } + function () {} ); window.panoramaHandler = new Cesium.ScreenSpaceEventHandler( Viewer.scene.canvas @@ -484,7 +532,7 @@ panorama.open({ id: "qjMap", closeId: "panoramaClose", - lng: p.lon, + lon: p.lon, lat: p.lat, }); @@ -498,7 +546,7 @@ } else { try { window.panoramaLayer.deleteObject(); - } catch (e) { } + } catch (e) {} window.panoramaHandler.destroy(); window.panoramaHandler = undefined; } @@ -521,26 +569,34 @@ } }, clearSelectObject() { - if (pickFeature && pickFeature.primitive) { - pickFeature.primitive.image = imgUrl; - pickFeature.primitive.scale = scale; - pickFeature = null; + if (window.pickFeature && window.pickFeature.primitive) { + window.pickFeature.primitive.image = imgUrl; + window.pickFeature.primitive.scale = scale; + window.pickFeature = null; } }, setCesuimHandle() { + var that = this; + Bus.$on("clearSelectObject", this.clearSelectObject); handler && handler.destroy(); handler = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas); handler.setInputAction((event) => { let nPickFeature = sgworld.Viewer.scene.pick(event.position); + if (Cesium.defined(nPickFeature)) { + this.resetImg(); + if (buildingPolygon) { + sgworld.Creator.DeleteObject(buildingPolygon); + buildingPolygon = null; + } if (nPickFeature.primitive instanceof Cesium.Billboard) { if (nPickFeature.id.length > 0) { return; } - this.resetImg(); - this.resetBorder(); - pickFeature = nPickFeature; + // this.resetBorder(); + window.pickFeature = nPickFeature; + // console.log(nPickFeature); imgUrl = nPickFeature.primitive.image; scale = nPickFeature.primitive.scale; nPickFeature.primitive.scale = 1; @@ -548,7 +604,7 @@ window.SmartEarthRootUrl + "Workers/image/point.png"; //鐐瑰嚮寮规 let obj = {}; - let lng; + let lon; let lat; let isCamera = false; if (nPickFeature.id.tag) { @@ -572,55 +628,136 @@ window.Viewer.scene.globe.ellipsoid.cartesianToCartographic( nPickFeature.id.position._value ); - lng = Cesium.Math.toDegrees(cartographic.longitude); + lon = Cesium.Math.toDegrees(cartographic.longitude); lat = Cesium.Math.toDegrees(cartographic.latitude); } else { obj = nPickFeature.id.attributes; - lng = nPickFeature.id.positions[0]; + lon = nPickFeature.id.positions[0]; lat = nPickFeature.id.positions[1]; + } + if (divPoint1) { + divPoint1.deleteObject(); } if (!isCamera) { tooltipHTML = ""; - // console.log(obj); - - for (let i in obj) { - let value = obj[i]; - value && (tooltipHTML += `<p>${i}锛�${value || "鏃�"}</p>`); + // 鍒犻櫎瀛楁 + let { OBJECTID, ID, BZDZ, Latitude, Longtitude, ...userData } = + obj; + for (let i in userData) { + let value = userData[i]; + let name = keyName[i] || i; + value && (tooltipHTML += `<p>${name}锛�${value || "鏃�"}</p>`); + console.log(tooltipHTML); } - - if (tooltip) { - tooltip.show(false); - tooltip = null; - } - tooltip = sgworld.Core.CreateResultTooltip(window.Viewer, { - color: "black", - addY: -40, - far: 200000, - closeBtn: true, - close: () => { - this.resetImg(); - this.resetBorder(); + let description = ` + <div id="pointInfoBox" class="pointInfoBox" style="pointer-events:auto;"> + <span style="position: absolute; right: 12px; top: 6px;">脳</span> + ${tooltipHTML} + </div> + `; + divPoint1 = sgworld.Creator.createDivPoint( + "璇︾粏淇℃伅", + { + lon: lon, + lat: lat, + height: 50, }, - }); - - let description = `<div style='background: - rgba(14, 50, 143, 0.6); - border: 1px solid #205fbc; - border-radius: 5px; - color: #fff; - padding: 15px; - box-shadow: 0px 1px 10px 0px rgba(3, 10, 26, 0.38); - '>${tooltipHTML}</div>`; - - tooltip.showAt( - Cesium.Cartesian3.fromDegrees(lng, lat, 0), - description + { + type: "custom", + offset: ["c", 50], + description, + onclick(data) { + // sgworld.Creator.DeleteObject(divPoint1); + divPoint1 && divPoint1.deleteObject(); + if (window.pickFeature && window.pickFeature.primitive) { + window.pickFeature.primitive.image = imgUrl; + window.pickFeature.primitive.scale = scale; + window.pickFeature = null; + } + }, + } ); + // if (tooltip) { + // tooltip.show(false); + // tooltip = null; + // } + // tooltip = sgworld.Core.CreateResultTooltip(window.Viewer, { + // color: "black", + // addY: -40, + // far: 200000, + // closeBtn: true, + // close: () => { + // this.resetImg(); + // }, + // }); + + // let description = `<div style='background: + // rgba(14, 50, 143, 0.6); + // border: 1px solid #205fbc; + // border-radius: 5px; + // color: #fff; + // padding: 15px; + // box-shadow: 0px 1px 10px 0px rgba(3, 10, 26, 0.38); + // '>${tooltipHTML}</div>`; + + // tooltip.showAt( + // Cesium.Cartesian3.fromDegrees(lon, lat, 0), + // description + // ); } //鍏抽棴鍦板潡淇℃伅寮圭獥 Bus.$emit("closeLandInfoPop", true); layuiLayer.close(SmartEarthPopupData.layerProp); this.$store.commit("description", obj); + } else if (nPickFeature.primitive instanceof Cesium.Cesium3DTileset) { + // let cartographic = + // window.Viewer.scene.globe.ellipsoid.cartesianToCartographic( + // nPickFeature.content.tile.boundingSphere.center + // ); + // let lon = Cesium.Math.toDegrees(cartographic.longitude); + // let lat = Cesium.Math.toDegrees(cartographic.latitude); + let p = sgworld.Navigate.getMouseDegrees(event); + let lon = p.lon; + let lat = p.lat; + + axios + .get( + "http://10.10.4.121:8070/gisserver/wfsserver/yizhuang-building-wfs-1207", + { + params: { + version: "1.3.0", + request: "GetFeature", + typename: `浜﹀簞寤虹瓚澶栬疆寤�4326`, + propertyname: "*", + format: "json", + filter: `<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc" xmlns:gml="http://www.opengis.net/gml"><ogc:Intersects><ogc:PropertyName>SAHEP</ogc:PropertyName><gml:Point > <gml:pos>${lon} ${lat}</gml:pos></gml:Point></ogc:Intersects></ogc:Filter>`, + }, + } + ) + .then((response) => { + if (response.data.features.length > 0) { + var geometry = []; + let POIs = response.data.features[0].geometry.coordinates[0]; + for (let i = 0; i < POIs.length; i++) { + geometry.push({ + x: parseFloat(POIs[i][0]), + y: parseFloat(POIs[i][1]), + z: 0, + }); + } + buildingPolygon = sgworld.Creator.createPolygon( + geometry, + { + fillColor: "#00ff0050", + outlineColor: "#ff0000", + outlineWidth: 2, + }, + 1, + 0, + "闈�" + ); + } + }); } // else if (nPickFeature.primitive instanceof Cesium.GroundPrimitive) { // let wmsLayer = this.$store.state.selectedLayers.filter((item) => { @@ -718,20 +855,20 @@ this.$parent.$parent.$parent.isShowSpeAnalyse = false; }, resetImg() { - if (pickFeature && pickFeature.primitive) { - pickFeature.primitive.image = imgUrl; - pickFeature.primitive.scale = scale; - pickFeature = null; + if (window.pickFeature && window.pickFeature.primitive) { + window.pickFeature.primitive.image = imgUrl; + window.pickFeature.primitive.scale = scale; + window.pickFeature = null; } }, - resetBorder() { - lineArr.forEach((item, index) => { - if (lineArr[index]) { - sgworld.Creator.DeleteObject(lineArr[index]); - lineArr[index] = null; - } - }); - }, + // resetBorder() { + // lineArr.forEach((item, index) => { + // if (lineArr[index]) { + // sgworld.Creator.DeleteObject(lineArr[index]); + // lineArr[index] = null; + // } + // }); + // }, stdsjHandle() { window.open( "http://10.9.2.29:8080/#/login?token=1ed14c5157acb8088efe65bc93a032c3" @@ -873,6 +1010,206 @@ }); } }, + 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; + }, }, }; </script> -- Gitblit v1.9.3