From 59077bd254e68d1ddfa2d93ff222e6324df2e93e Mon Sep 17 00:00:00 2001
From: suerprisePlus <15810472099@163.com>
Date: 星期二, 19 十一月 2024 14:57:55 +0800
Subject: [PATCH] 图层控制增加全部关闭按钮，图层双击自动定位到对应位置，信令数据的时间条美化下，对接UE视频流，数字人功能开启，逻辑单体化数据体现
---
src/components/menu/tools/special.vue | 307 ++++++++++++++++++++++-----------------------------
1 files changed, 132 insertions(+), 175 deletions(-)
diff --git a/src/components/menu/tools/special.vue b/src/components/menu/tools/special.vue
index eaf4ef6..79c7c47 100644
--- a/src/components/menu/tools/special.vue
+++ b/src/components/menu/tools/special.vue
@@ -2,52 +2,28 @@
<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>
@@ -55,26 +31,14 @@
</div>
<div class="specialTool" @click="qytj">
- <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/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-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>
@@ -258,7 +222,7 @@
import keyName from "@/utils/poiKeys";
import LayerField from "@/utils/NameConf";
-let handler, buildingPolygon, objdata, video, promiseS3M;
+let handler, buildingPolygon, objdata = {}, video, promiseS3M;
window.divPoint3 = null;
window.instance = null;
let tooltipHTML;
@@ -378,7 +342,7 @@
...mapState(["viewer1Show", "yqfk", "cesiumInit"]),
...mapState(["viewer1Show", "yqfk", "qyEchartsShow"])
},
- mounted() {},
+ mounted() { },
watch: {
cesiumInit: {
handler(newVal, oldVal) {
@@ -453,7 +417,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 =
@@ -532,7 +496,7 @@
{},
"0",
true,
- function() {}
+ function () { }
);
window.panoramaHandler = new Cesium.ScreenSpaceEventHandler(
Viewer.scene.canvas
@@ -558,7 +522,7 @@
} else {
try {
window.panoramaLayer.deleteObject();
- } catch (e) {}
+ } catch (e) { }
window.panoramaHandler.destroy();
window.panoramaHandler = undefined;
}
@@ -594,6 +558,7 @@
handler = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas);
handler.setInputAction(event => {
let nPickFeature = sgworld.Viewer.scene.pick(event.position);
+ console.log(nPickFeature);
if (Cesium.defined(nPickFeature)) {
this.resetImg();
if (buildingPolygon) {
@@ -606,13 +571,14 @@
}
// this.resetBorder();
window.pickFeature = nPickFeature;
- // console.log(nPickFeature);
imgUrl = nPickFeature.primitive.image;
scale = nPickFeature.primitive.scale;
nPickFeature.primitive.image =
window.SmartEarthRootUrl + "Workers/image/point.png";
nPickFeature.primitive.scale = 1;
//鐐瑰嚮寮规
+
+ objdata = {}
let obj = {};
let lon;
let lat;
@@ -649,11 +615,11 @@
}
if (!isCamera) {
tooltipHTML = "";
- //閲嶇疆LayerField鏁版嵁
+ //閲嶇疆LayerField鏁版嵁锛堢浜曞拰閮ㄤ欢灞曠ず鐨勫瓧娈佃〃锛�
for (let item in LayerField) {
LayerField[item] = 0;
}
- // 鍒犻櫎瀛楁
+ // 鍒犻櫎涓嶉渶瑕佺殑瀛楁 鍓╀笅淇濆瓨涓簎serData
let {
OBJECTID,
ID,
@@ -662,7 +628,6 @@
Longtitude,
...userData
} = obj;
-
// 鍒ゆ柇灞曠ず鐨勭被鍨�
if (
userData.hasOwnProperty("閮ㄤ欢鍚嶇О") ||
@@ -681,10 +646,8 @@
}
// 灞曠ずLayerField鏁版嵁
for (let item in LayerField) {
- let value = LayerField[item];
- value &&
- (tooltipHTML += `<p>${item}锛�${value ||
- "鏃�"}</p>`);
+ LayerField[item] && (objdata[item] = LayerField[item])
+ // (tooltipHTML += `<p>${item}锛�${LayerField[item] || "鏃�"}</p>`);
}
} else if (
userData.hasOwnProperty("褰撲簨浜哄悕绉�") ||
@@ -702,136 +665,50 @@
鍔炴浜哄憳: userData["鍔炴浜哄憳"],
璋冩煡鎯呭舰: userData["璋冩煡鎯呭舰"]
};
- // 灞曠ずLayerField鏁版嵁
- for (let itemName in newOBJ) {
- let CnName = itemName;
- let value = userData[itemName];
-
- value &&
- (tooltipHTML += `<p style="margin-top:7px;">${CnName}锛�${value ||
- "鏃�"}</p>`);
- // console.log(tooltipHTML);
- }
+ objdata = newOBJ
} else {
- // 鐩存帴灞曠ず
- for (let itemName in newOBJ) {
- let value = userData[itemName];
+ for (let itemName in userData) {
let CnName = keyName[itemName] || itemName;
- value &&
- (tooltipHTML += `<p>${CnName}锛�${value || "鏃�"}</p>`);
- // console.log(tooltipHTML);
+ userData[itemName] && (objdata[CnName] = userData[itemName])
+ // (tooltipHTML += `<p style="margin-top:7px;">${itemName}锛�${ userData[itemName] ||
+ // "鏃�"}</p>`);
}
}
-
- 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(
- "璇︾粏淇℃伅",
+ divPoint3 && divPoint3.deleteObject();
+ store.setPoplayerShowAction(false);
+ store.setPoplayerListAction({});
+ store.setPoplayerShowAction(true);
+ store.setPoplayerListAction(objdata);
+ window.instance = new PoiLayerConstructor({
+ data: {
+ list: objdata,
+ },
+ });
+ window.instance.$mount();
+ divPoint3 = window.sgworld.Creator.createDivPoint(
+ "",
{
lon: lon,
lat: lat,
- height: 50
+ height: 50,
},
{
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;
- }
- }
+ offset: ["c", 100],
+ description: window.instance.$el,
+ near: 0,
+ far: 100000,
}
);
- // 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);
+ //鍙戦�佺粰right-top.vue璋冪敤
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 (
+ }
+
+ else if (nPickFeature.id &&
nPickFeature.id.fid &&
nPickFeature.id.fid.includes("鍏嶈垂浣忔墍绌洪棿0131")
) {
@@ -842,10 +719,6 @@
divPoint1.deleteObject();
}
tooltipHTML = "";
- //閲嶇疆LayerField鏁版嵁
- for (let item in LayerField) {
- LayerField[item] = 0;
- }
// 鍒犻櫎瀛楁
let { Id, ...userData } = obj;
// 鐩存帴灞曠ず
@@ -881,6 +754,90 @@
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-buliding-wfs",
+ {
+ params: {
+ version: "1.3.0",
+ request: "GetFeature",
+ typename: `鍗曚綋鍖朣HP20241029_wgs84`,
+ 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];
+ tooltipHTML = "";
+
+ for (let i in response.data.features[0].properties) {
+ let value = response.data.features[0].properties[i];
+
+
+ value && (tooltipHTML += `<p>${i}锛�${value || "鏃�"}</p>`);
+ }
+
+ // if (tooltip) {
+ // tooltip.show(false);
+ // tooltip = null;
+ // }
+ var tooltip = sgworld.Core.CreateResultTooltip(window.Viewer, {
+ color: "black",
+ addY: 0,
+ far: 200000,
+ closeBtn: true,
+ close: () => {
+ if (buildingPolygon) {
+ sgworld.Creator.DeleteObject(buildingPolygon);
+ buildingPolygon = null;
+ }
+ },
+ });
+ console.log(tooltipHTML);
+
+ let description = `<div style=' border: 1px solid #fff;border-radius: 5px;background: rgba(0, 0, 0, 0.8);color: #fff;padding: 15px;'>${tooltipHTML}</div>`;
+ tooltip.showAt(
+ Cesium.Cartesian3.fromDegrees(p.lon, p.lat, 0),
+ description
+ );
+ 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) => {
// return item.name == "琛屾斂鍖哄垝鍥�";
@@ -890,7 +847,7 @@
// axios
// .get(
- // "http://10.10.4.116:8070/gisserver/rest/services/XingZhengQuHuaTu/MapServer/identify",
+ // "https://skyzt.bda.gov.cn/gisserver/rest/services/XingZhengQuHuaTu/MapServer/identify",
// {
// params: {
// geometry: `${p.lon},${p.lat}`,
@@ -1036,7 +993,7 @@
offset: "r",
skin: "other-class",
content: SmartEarthRootUrl + "Workers/path/Path.html",
- end: function() {
+ end: function () {
PathAnimationData.fly && PathAnimationData.fly.exit();
}
});
@@ -1078,7 +1035,7 @@
"http://10.10.4.116:8086/getCamerasInfoHls?cameraIndexCode=" +
item[i].cameraIndexCode,
// url: "http://10.10.4.116:8086/getCamerasInfoHls?cameraIndexCode=49ee9fed701444738112e80a4835122c",
- success: function(result) {
+ success: function (result) {
video = sgworld.Creator.Video3D({
cameraPosition: position, //鐩告満瀹夎浣嶇疆
heading: item[i].heading, //64
--
Gitblit v1.9.3