From 9c2cad000f9279969e76bfc206a7acbb8acc9079 Mon Sep 17 00:00:00 2001 From: lixuliang <lixuliang_hd@126.com> Date: 星期一, 10 二月 2025 14:38:32 +0800 Subject: [PATCH] Merge branch 'master' of http://103.135.160.14:9034/r/PM20221203225_Web --- src/components/left/leftmenu.vue | 572 ++++++++++++++++++++++++++++++++------------------------ 1 files changed, 327 insertions(+), 245 deletions(-) diff --git a/src/components/left/leftmenu.vue b/src/components/left/leftmenu.vue index 8931122..b06adab 100644 --- a/src/components/left/leftmenu.vue +++ b/src/components/left/leftmenu.vue @@ -1,43 +1,39 @@ <template> - <div - @click="showLeftMenu" - :class="{ leftmenu: !isShowLeftPanel, leftmenu_active: isShowLeftPanel }" - class="leftmenustyle" - > - <span - class="closeLeftMenu" - v-if="isShowLeftPanel" - @click.stop="hideLeftMenu" - >脳</span - > + <div @click="showLeftMenu" :class="{ leftmenu: !isShowLeftPanel, leftmenu_active: isShowLeftPanel }" + class="leftmenustyle"> + <span class="closeLeftMenu" v-if="isShowLeftPanel" @click.stop="hideLeftMenu">脳</span> <img class="openLeftMenu" v-else src="@/assets/img/left/souselist4.png" /> - <div class="layerTreeContainer" v-show="isShowLeftPanel"> + <!-- <el-input + placeholder="鍥惧眰鍚嶇О" + v-model="filterText" + size="mini" + > + </el-input>--> + <div class="switchbox"> <el-radio-group v-model="radio" @change="getright"> <el-radio :label="1">缁勭粐鏈烘瀯</el-radio> <el-radio :label="2">涓氬姟瑕佺礌</el-radio> </el-radio-group> <!-- <div @click="setTreeDataChange(1)">涓氬姟</div> - <div @click="setTreeDataChange(2)">涓氬姟</div> --> + <div @click="setTreeDataChange(2)">涓氬姟</div>--> </div> + <hr /> <!-- <div style="padding: 5px"> <el-button size="small" @click="setTreeDataChange(1)">鍥惧眰1</el-button> <el-button size="small" @click="setTreeDataChange(2)">鍥惧眰2</el-button> - </div> --> + </div>--> <div class="layerTree"> - <el-tree - :data="treeData" - node-key="id" - ref="tree" - :default-checked-keys="arr" - style="min-width: 160px" - show-checkbox - :render-content="renderContent" - :default-expanded-keys="defaultExpanded" - @check="check" - ></el-tree> + <el-tree :data="treeData" node-key="id" ref="tree" :default-checked-keys="arr" style="min-width: 160px" + show-checkbox :render-content="renderContent" :default-expanded-keys="defaultExpanded" @check="check" + @node-click="handleNodeDoubleClick" :filter-node-method="filterNode"></el-tree> + </div> + + <hr /> + <div class="canelAllCheck"> + <el-link type="info" @click="setClearAllCheck()" style="color:white;font-size: 14px;">鍙栨秷鍏ㄩ儴鎵�閫�</el-link> </div> </div> </div> @@ -56,6 +52,7 @@ import { getmenu } from "../../api/api"; import keys from "@/assets/poiKeys1"; import store from "@/utils/store"; + let colorTool; let projectTreeData = []; @@ -109,7 +106,7 @@ value: undefined, defaultValue: isColor ? getSGColor(xml2json.DefaultValue) - : xml2json.DefaultValue, + : xml2json.DefaultValue }; if (xml2json && !xml2json.Class.length) { @@ -117,11 +114,14 @@ } else if (xml2json && xml2json.Class.length) { let Value = { Condition: undefined, - Value: {}, + Value: {} }; - xml2json.Class.forEach((item) => { + xml2json.Class.forEach(item => { let condition = item.Condition.replace(/\"/g, ""); - let eli = condition.replace("<", "").replace(">", "").split("="); + let eli = condition + .replace("<", "") + .replace(">", "") + .split("="); if (!Value.Condition) { eli[0] = eli[0].replace("[", "").replace("]", ""); Value.Condition = eli[0]; @@ -141,12 +141,12 @@ await axios .get(json) .then( - (response) => { + response => { let _data = response.data; if (_data && typeof _data === "string") { _data = JSON.parse(_data); } - let style = _data.filter((item) => { + let style = _data.filter(item => { return item.LayerName === name; }); if (type === "point") { @@ -169,7 +169,7 @@ defaultValue: defaultValue( style.Text.match(/<Value>(\S*)<\/Value>/)[1], style.Text.match(/<DefaultValue>(\S*)<\/DefaultValue>/)[1] - ), + ) }, scaleMPP: { defaultValue: style.Scale }, fillColor: { @@ -177,14 +177,14 @@ red: color[0] / 255, green: color[1] / 255, blue: color[2] / 255, - alpha: 1, - }, + alpha: 1 + } }, scaleByDistance: { near: 0, nearValue: 1, far: 800000000, - farValue: 1, + farValue: 1 }, minViewingHeight: { defaultValue: "0" }, font: { defaultValue: style.Text_Size }, @@ -194,8 +194,8 @@ red: bgColor[0] / 255, green: bgColor[1] / 255, blue: bgColor[2] / 255, - alpha: 1, - }, + alpha: 1 + } }, scale: defaultValue(style.TextScale, 1.5), backgroundOpacity: { defaultValue: style.Background_Opacity }, @@ -214,12 +214,12 @@ ), outlineWidth: defaultValue(style.outlineWidth, 2), horizontalOrigin: Cesium.HorizontalOrigin.CENTER, - verticalOrigin: Cesium.VerticalOrigin.BOTTOM, + verticalOrigin: Cesium.VerticalOrigin.BOTTOM }, lineToGround: { defaultValue: style.Line_to_Ground }, lineToGroundLength: { defaultValue: style.Line_Length }, lineToGroundColor: { - defaultValue: { red: 1, green: 1, blue: 1, alpha: 1 }, + defaultValue: { red: 1, green: 1, blue: 1, alpha: 1 } }, altitudeMethod: 0, altitudeOffset: { defaultValue: "0" }, @@ -231,7 +231,7 @@ position_y: data.position_y, position_z: data.position_z == 0 ? 10000 : data.position_z, urls: data.Server, - layer: data.ServerName, + layer: data.ServerName }; if (style.Line_Color) { de.label && (de.label.style = Cesium.LabelStyle.FILL_AND_OUTLINE); @@ -245,10 +245,10 @@ near: 0, nearValue: 1, far: 800000000, - farValue: 1, + farValue: 1 }, minViewingHeight: { defaultValue: "0" }, - verticalOrigin: Cesium.VerticalOrigin.BOTTOM, + verticalOrigin: Cesium.VerticalOrigin.BOTTOM }; } } else if (type === "polyline") { @@ -271,13 +271,13 @@ red: color[0] / 255, green: color[1] / 255, blue: color[2] / 255, - alpha: 1, + alpha: 1 }, lineOpacity: parseInt(defaultValue(style.Line_Opacity, 1)), width: parseInt(defaultValue(style.Line_Width, 4)), near: style.Near, far: style.Far, - clampToGround: defaultValue(style.clampToGround, true), + clampToGround: defaultValue(style.clampToGround, true) }, minimumLevel: defaultValue(style.level_min, 0), maximumLevel: defaultValue(style.level_max, 22), @@ -285,7 +285,7 @@ position_y: data.position_y, position_z: data.position_z == 0 ? 10000 : data.position_z, urls: data.Server, - layer: data.ServerName, + layer: data.ServerName }; } else if (type === "polygon") { let data = style[0]; @@ -298,7 +298,7 @@ de = { polygon: { outlineColor: { - defaultValue: style.outlineColor, + defaultValue: style.outlineColor }, outlineWidth: style.outlineWidth, fill: { defaultValue: style.fill.alpha }, @@ -306,10 +306,10 @@ height: style.height, outline: style.outline, material: { - defaultValue: style.fill, + defaultValue: style.fill }, clampToGround: !style.extrudedHeight ? true : false, - fromKml: true, + fromKml: true }, altitudeMethod: 2, altitudeOffset: { defaultValue: "0" }, @@ -319,11 +319,11 @@ position_y: data.position_y, position_z: data.position_z == 0 ? 10000 : data.position_z, urls: data.Server, - layer: data.ServerName, + layer: data.ServerName }; } }, - (response) => { + response => { console.log("鑾峰彇鏍峰紡閰嶇疆澶辫触锛�"); } ) @@ -392,10 +392,10 @@ if (entity.billboard.image && entity.label.text) { entity.imageData = { - horizontalOrigin: Cesium.HorizontalOrigin.RIGHT, + horizontalOrigin: Cesium.HorizontalOrigin.RIGHT }; entity.labelData = { - horizontalOrigin: Cesium.HorizontalOrigin.LEFT, + horizontalOrigin: Cesium.HorizontalOrigin.LEFT }; } @@ -406,7 +406,7 @@ async function getVectorStyleFromSG(treeNode, json) { let de; - await axios.get(json).then((res) => { + await axios.get(json).then(res => { let entitystyle = GetStyleByStyleJson(res.data); de = { @@ -431,7 +431,7 @@ disableDepthTestDistance: Number.POSITIVE_INFINITY, scale: entitystyle.label.scale, labelData: entitystyle.labelData, - imageData: entitystyle.imageData, + imageData: entitystyle.imageData }; }); return de; @@ -445,6 +445,7 @@ name: "leftmenu", data() { return { + filterText: "", isShowLeftPanel: false, activeName: "first", alldisabled: [], @@ -454,7 +455,7 @@ radio: 1, defaultExpanded: [], defaultCheck: [], - treeChangeFlag: 1, + treeChangeFlag: 1 }; }, mounted() { @@ -464,18 +465,18 @@ //鑾峰彇token骞惰姹傚姞杞藉浘灞傛暟鎹� this.SmartEarthToken = common.smartearthtoken; this.$nextTick(() => { - getmenu().then((response) => { - // // 寰楀埌榛樿閫変腑鐨勬暟鎹殑id - // this.parseJson(response.data); //鍦烘櫙閰嶇疆 - // this.treeData = response.data; - // this.setDefaultCheck(response.data); - // setTimeout(() => { - // this.randomSelectLayer(); - // let selectedLayers = this.$refs.tree.getCheckedNodes(); - // // .filter((item) => item.sourceType == "cluster"); - // this.$store.commit("selectedLayer", selectedLayers); - // }, 1000); - }); + // getmenu().then((response) => { + // // // 寰楀埌榛樿閫変腑鐨勬暟鎹殑id + // // this.parseJson(response.data); //鍦烘櫙閰嶇疆 + // // this.treeData = response.data; + // // this.setDefaultCheck(response.data); + // // setTimeout(() => { + // // this.randomSelectLayer(); + // // let selectedLayers = this.$refs.tree.getCheckedNodes(); + // // // .filter((item) => item.sourceType == "cluster"); + // // this.$store.commit("selectedLayer", selectedLayers); + // // }, 1000); + // }); this.getLayersData("./static/layers.json"); // axios.get("./static/layers.json").then( // (response) => { @@ -546,8 +547,12 @@ this.$refs.tree.setChecked("zhianjiankong", true, true); this.setChecked("zhianjiankong", true); }); + Bus.$on("closeSPJK", () => { + this.$refs.tree.setChecked("zhianjiankong", false, false); + this.setChecked("zhianjiankong", false); + }); //鍏抽棴鑿滃崟寮圭獥 - Bus.$on("closeMenuPop", (data) => { + Bus.$on("closeMenuPop", data => { if (data) { this.isShowLeftPanel = false; } @@ -560,8 +565,7 @@ methods: { getLayersData(url) { axios.get(url).then( - (response) => { - // console.log(response.data); + response => { // 寰楀埌榛樿閫変腑鐨勬暟鎹殑id this.parseJson(response.data.children); //鍦烘櫙閰嶇疆 @@ -569,15 +573,18 @@ this.setDefaultCheck(response.data); this.$nextTick(() => { let selectedLayers = this.$refs.tree.getCheckedNodes(); - if (url == "./static/layers2.json") { - selectedLayers.forEach((e) => { - this.setVisiable(e, false); - this.$refs.tree.setChecked(e, false, false); - // sgworld.ProjectTree.setVisibility(e.id, false); - }); + // console.log(selectedLayers); + if (url.includes("layers2")) { + Bus.$emit("switchImagerLayerClick", "瀹炴櫙妯″瀷"); + + // selectedLayers.forEach(e => { + // this.setVisiable(e, false); + // this.$refs.tree.setChecked(e, false, false); + // sgworld.ProjectTree.setVisibility(e.id, false); + // }); } let filterSelectLayers = selectedLayers; - let filist = filterSelectLayers.filter((p) => { + let filist = filterSelectLayers.filter(p => { return !p.children; }); let legendlist = []; @@ -594,10 +601,14 @@ this.$store.commit("selectedLayer", selectedLayers); }); }, - (response) => { + response => { console.log("鑾峰彇鍦烘櫙閰嶇疆澶辫触锛�"); } ); + }, + filterNode(value, treeData) { + if (!value) return true; + return treeData.name.indexOf(value) !== -1; }, setTreeDataChange(res) { if (this.treeChangeFlag == res) return; @@ -614,7 +625,7 @@ }, clearAllViewerlayer() { let layerNode = this.$refs.tree.getCheckedNodes(); - layerNode.forEach((e) => { + layerNode.forEach(e => { this.setVisiable(e, false); this.$refs.tree.setChecked(e, false, false); // sgworld.ProjectTree.setVisibility(e.id, false); @@ -650,20 +661,20 @@ this.$refs.tree.setCheckedKeys(nval); let layer = this.$refs.tree.getCheckedNodes(); if (ovaL) { - ovaL.forEach((e) => { + ovaL.forEach(e => { sgworld.ProjectTree.setVisibility(e, false); }); } - layer.forEach((e) => { + layer.forEach(e => { this.handleCheckChange(e, { checkedKeys: [e.id] }); }); } }, treeFormatData(source) { let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕 - return cloneData.filter((father) => { + return cloneData.filter(father => { // 寰幆鎵�鏈夐」 - let branchArr = cloneData.filter((child) => father.gid == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁 + let branchArr = cloneData.filter(child => father.gid == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁 branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊� return father.pid == 0; // 杩斿洖涓�绾ц彍鍗� }); @@ -681,6 +692,9 @@ window.panoramaHandler = undefined; } let layerId = [ + "hexinqu0609", + "2253dhexin01", + "2253dfeihexin", "0CAAD18E", "48EB9EB7", // "C0698021", @@ -688,13 +702,13 @@ "zhianjiankong", "heijin2D", "shenlan2D", - "baise2D", + "baise2D" ]; let layer1 = this.$refs.tree.getCheckedNodes(); - layerId.forEach((e) => { + layerId.forEach(e => { //鍒犻櫎 if (e != "shijingsanwei") { - layer1.forEach((v) => { + layer1.forEach(v => { if (v.id == e) { this.$refs.tree.setChecked(e, false, false); sgworld.ProjectTree.setVisibility(e, false); @@ -702,7 +716,7 @@ }); } // 鏂板 - n.forEach((i) => { + n.forEach(i => { if (e == i) { if (i !== "jiejing") { this.$refs.tree.setChecked(i, true, true); @@ -713,13 +727,13 @@ }); let layer = this.$refs.tree.getCheckedNodes(); // 鍗曠嫭鍐欎簡涓�涓殣钘廱3d妯″瀷鎵嶈兘闅愯棌鎺� - let even = layer.filter((e) => { + let even = layer.filter(e => { return e.id == "shijingsanwei"; }); - n.forEach((e) => { + n.forEach(e => { if (e != "shijingsanwei") { if (even.length != 0) { - even[0].children.forEach((v) => { + even[0].children.forEach(v => { this.$refs.tree.setChecked(v.id, false, false); sgworld.ProjectTree.setVisibility(v.id, false); }); @@ -798,14 +812,14 @@ if (node._children) { if (node.thisView) { if (node._children[0].children) { - node._children[0].children.forEach((item) => { + node._children[0].children.forEach(item => { this.addTreeData(item); }); } else { this.addTreeData(node._children[0]); } } else { - node._children.forEach((item) => { + node._children.forEach(item => { this.addTreeData(item); }); } @@ -815,7 +829,7 @@ } } if (node.children && node.children.length) { - node.children.forEach((item) => { + node.children.forEach(item => { this.ergodicNode(item); }); } @@ -829,6 +843,42 @@ this.setVisiable(treeNode.data, isCheck); } }, + handleNodeDoubleClick(data, node, event) { + if (data.flyTo) { + const coord = data.flyTo; + sgworld.Navigate.flyToPointsInterest({ + destination: Cesium.Cartesian3.fromDegrees( + coord[0], + coord[1], + coord[2] + ), + orientation: { + heading: Cesium.Math.toRadians(coord[3] ? coord[3] : 0), + pitch: Cesium.Math.toRadians(coord[4] ? coord[4] : -90), + roll: Cesium.Math.toRadians(0.0) + }, + duration: 2 //椋炶鏃堕棿8s + }); + } + + }, + setClearAllCheck() { + // let treeNode = this.$refs.tree.getNode(1); + // if (treeNode && treeNode.data) { + // this.setVisiable(treeNode, false); + // } + const nodes = this.$refs.tree.getCheckedNodes(); + const ids = ["18B25A94", "47EC9636"]; + const checkId = []; + nodes.map(item => { + if (ids.indexOf(item.id) > -1) { + checkId.push(item.id) + } else { + this.setVisiable(item, false) + } + }) + this.$refs.tree.setCheckedKeys(checkId); + }, check(treeNode, data) { //鍏抽棴鍙充晶淇℃伅寮圭獥 Bus.$emit("closeRightPop", true); @@ -838,7 +888,7 @@ //閫変腑涔嬪悗浼犵粰vuex let selectedLayers = this.$refs.tree.getCheckedNodes(); let filterSelectLayers = selectedLayers; - let filist = filterSelectLayers.filter((p) => { + let filist = filterSelectLayers.filter(p => { return !p.children; }); let legendlist = []; @@ -874,7 +924,7 @@ treeNode.checked = !treeNode.checked; } if (treeNode.children) { - treeNode.children.forEach((item) => { + treeNode.children.forEach(item => { this.setVisiable(item, treeNode.checked); }); return; @@ -882,7 +932,7 @@ if (treeNode.thisView === "ewzj") { treeNode._children[0].checked = treeNode.checked; if (treeNode._children[0].children) { - treeNode._children[0].children.forEach((item) => { + treeNode._children[0].children.forEach(item => { item.checked = treeNode.checked; this.addTreeData(item); }); @@ -900,7 +950,7 @@ treeNode._children.forEach((item, index) => { item.checked = treeNode.checked; if (item.children) { - item.children.forEach((_item) => { + item.children.forEach(_item => { _item.checked = item.checked; this.addTreeData(_item); }); @@ -929,7 +979,7 @@ data.item.show !== undefined && (data.item.show = treeNode.checked); if (data.datatype === "particle") { - data.item.forEach((item) => { + data.item.forEach(item => { item.show = treeNode.checked; }); } @@ -940,20 +990,20 @@ treeNode.id.indexOf("---") > -1 ) { var ids = id.split("---"); - ids.forEach((item) => { + ids.forEach(item => { sgworld.ProjectTree.setVisibility(item, treeNode.checked); }); } else { sgworld.ProjectTree.setVisibility(treeNode.id, treeNode.checked); - var dd = Viewer.dataSources._dataSources.filter((item) => { + var dd = Viewer.dataSources._dataSources.filter(item => { return item.name == treeNode.id; }); if (dd && dd.length > 0) { dd[0].show = treeNode.checked; } //鍒ゆ柇鍕鹃�夌殑鏄惁涓鸿仛鍚� - var jhdd = clusterItemList.filter((item) => { + var jhdd = clusterItemList.filter(item => { return item.name == treeNode.id; }); if (jhdd && jhdd.length > 0) { @@ -965,15 +1015,15 @@ props(data) { if (data.class === "imageLayer") { window.treeObj = { - rightClickData: data, + rightClickData: data }; layerOpen("褰卞儚", { width: 320, height: 310, url: "./static/html/layerProp.html", fn: { - end: function () {}, - }, + end: function () { } + } }); } else if (data._children) { if (data.thisView === "ewzj") { @@ -983,9 +1033,9 @@ for (let i = 1; i < data._children.length; i++) { data._children[i].checked = data.checked; } - data._children.forEach((item) => { + data._children.forEach(item => { if (item.children) { - item.children.forEach((_item) => { + item.children.forEach(_item => { _item.checked = item.checked; this.addTreeData(_item); }); @@ -1000,9 +1050,9 @@ for (let i = 1; i < data._children.length; i++) { data._children[i].checked = false; } - data._children.forEach((item) => { + data._children.forEach(item => { if (item.children) { - item.children.forEach((_item) => { + item.children.forEach(_item => { _item.checked = item.checked; this.addTreeData(_item); }); @@ -1033,7 +1083,7 @@ treeNode.flyTo[1], treeNode.flyTo[2], treeNode.flyTo[3] - ), + ) }); } else { sgworld.Navigate.flyToPointsInterest({ @@ -1045,8 +1095,8 @@ orientation: { heading: treeNode.flyTo[3], pitch: treeNode.flyTo[4], - roll: treeNode.flyTo[5], - }, + roll: treeNode.flyTo[5] + } }); } return; @@ -1127,7 +1177,7 @@ _data.item.show !== undefined && (_data.item.show = treeNode.checked); if (_data.datatype === "particle") { - _data.item.forEach((item) => { + _data.item.forEach(item => { item.show = treeNode.checked; }); } @@ -1151,7 +1201,7 @@ url: treeNode.urls, fileExtension: treeNode.img || "png", enablePickFeatures: false, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", undefined, @@ -1178,7 +1228,7 @@ treeNode.tileType === "Geo" ? new Cesium.GeographicTilingScheme() : new Cesium.WebMercatorTilingScheme(), - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1190,9 +1240,8 @@ treeNode.name, { id: treeNode.id, - url: `${treeNode.urls}/${treeNode.tile || "{z}/{x}/{y}"}.${ - treeNode.img || "png" - }`, + url: `${treeNode.urls}/${treeNode.tile || + "{z}/{x}/{y}"}.${treeNode.img || "png"}`, enablePickFeatures: false, level: treeNode.Level, minimumLevel: treeNode.minimumLevel, @@ -1201,7 +1250,7 @@ treeNode.tileType === "Geo" ? new Cesium.GeographicTilingScheme() : new Cesium.WebMercatorTilingScheme(), - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1216,7 +1265,7 @@ treeNode.name, { id: treeNode.id, - url: treeNode.urls, + url: treeNode.urls }, true ); @@ -1233,7 +1282,7 @@ minimumLevel: treeNode.minimumLevel, maximumLevel: treeNode.maximumLevel, alpha: treeNode.alpha, - tilingScheme: sgworld.Core.getOffsetTilingScheme(), + tilingScheme: sgworld.Core.getOffsetTilingScheme() }, "0", treeNode.zIndex, @@ -1252,7 +1301,7 @@ minimumLevel: treeNode.minimumLevel, maximumLevel: treeNode.maximumLevel, alpha: treeNode.alpha, - tilingScheme: sgworld.Core.getOffsetTilingScheme(), + tilingScheme: sgworld.Core.getOffsetTilingScheme() }, "0", treeNode.zIndex, @@ -1275,7 +1324,7 @@ : undefined, // 鍋忕Щ绾犳 minimumLevel: treeNode.minimumLevel, maximumLevel: treeNode.maximumLevel, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1299,7 +1348,7 @@ alpha: treeNode.alpha, accessToken: treeNode.token || - "pk.eyJ1IjoibWFyc2dpcyIsImEiOiJja2Fod2xlanIwNjJzMnhvMXBkMnNqcjVpIn0.WnxikCaN2KV_zn9tLZO77A", + "pk.eyJ1IjoibWFyc2dpcyIsImEiOiJja2Fod2xlanIwNjJzMnhvMXBkMnNqcjVpIn0.WnxikCaN2KV_zn9tLZO77A" }, "0", treeNode.zIndex, @@ -1324,7 +1373,7 @@ tileMatrixSetID: "tiff", show: true, subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"], - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1354,8 +1403,8 @@ // rectangleNortheastInMeters:new Cesium.Cartesian2(20037508.3427892, 20037508.3427892), numberOfLevelZeroTilesX: 4, numberOfLevelZeroTilesY: 4, - projection: new Cesium.GeographicProjection(), - }), + projection: new Cesium.GeographicProjection() + }) }, pID, undefined, @@ -1372,7 +1421,7 @@ url: treeNode.urls, layer: treeNode.layer, enablePickFeatures: false, - show: true, + show: true }, pID, undefined, @@ -1393,7 +1442,7 @@ layer = sgworld.Creator.GeoWTFS({ token: treeNode.token || "c53eb074c3fcba5ac86103d4d711bbe8", url: treeNode.urls, - subdomains: ["0", "1", "2", "3", "4", "5", "6", "7"], + subdomains: ["0", "1", "2", "3", "4", "5", "6", "7"] }); break; case "txmap": @@ -1415,8 +1464,8 @@ }, sy: (_imageryProvider, _x, y, level) => { return ((1 << level) - y) >> 4; - }, - }, + } + } }, "0", treeNode.zIndex, @@ -1436,7 +1485,7 @@ minimumLevel: treeNode.minimumLevel, maximumLevel: 18, tilingScheme: sgworld.Core.getOffsetTilingScheme(), // 鍋忕Щ绾犳 - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1456,7 +1505,7 @@ style: treeNode.style, minimumLevel: treeNode.minimumLevel, maximumLevel: treeNode.maximumLevel, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1477,7 +1526,7 @@ level: treeNode.Level, minimumLevel: treeNode.minimumLevel, maximumLevel: treeNode.maximumLevel, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1497,7 +1546,7 @@ level: treeNode.Level, minimumLevel: treeNode.minimumLevel, maximumLevel: treeNode.maximumLevel, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1525,7 +1574,7 @@ show: true, minimumLevel: treeNode.minimumLevel, maximumLevel: treeNode.maximumLevel, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1546,7 +1595,7 @@ level: treeNode.Level, minimumLevel: treeNode.minimumLevel, maximumLevel: treeNode.maximumLevel, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1557,7 +1606,7 @@ case "wmts_zj": // 琛屽垪鍙峰樊涓ゅ�嶇殑wmts var geotil = new Cesium.GeographicTilingScheme({ - rectangle: Cesium.Rectangle.MAX_VALUE, + rectangle: Cesium.Rectangle.MAX_VALUE }); if (treeNode.addLevel && treeNode.addLevel === 2) { geotil.positionToTileXY = function (position, level, result) { @@ -1641,7 +1690,7 @@ addLevel: treeNode.addLevel || 1, //灞傜骇鍔犱竴 enablePickFeatures: false, show: true, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1655,7 +1704,7 @@ var parameters = { service: "WMS", format: "image/png", - transparent: true, + transparent: true }; if (treeNode.removeNullValue) { if (treeNode.nullvalue) { @@ -1684,7 +1733,7 @@ cacheUrl: treeNode.cacheUrl || treeNode.urls, fileExtension: treeNode.fileExtension, cacheMaxLevel: treeNode.cacheMaxLevel || 16, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1704,7 +1753,7 @@ maximumLevel: treeNode.maximumLevel, enablePickFeatures: false, parameters: parameters, - alpha: treeNode.alpha, + alpha: treeNode.alpha }, "0", treeNode.zIndex, @@ -1746,8 +1795,8 @@ alpha: treeNode.alpha, parameters: { format: "image/png", - transparent: true, - }, + transparent: true + } }, "0", undefined, @@ -1764,12 +1813,12 @@ axios .get( treeNode.urls + - "?version=1.3.0&request=GetFeature&format=json&typename=" + - treeNode.layer + "?version=1.3.0&request=GetFeature&format=json&typename=" + + treeNode.layer ) - .then((data) => { + .then(data => { let features = data.data.features; - features.forEach((feature) => { + features.forEach(feature => { let geom = feature.geometry.coordinates; let properties = feature.properties; let point = new SmartEarth.Degrees(geom[0], geom[1], 0); @@ -1843,7 +1892,7 @@ minimumLevel: 16, maximumLevel: 22, // 鏃犺閬尅 - disableDepthTestDistance: Infinity, + disableDepthTestDistance: Infinity }, 0, "鏂囨湰" @@ -1894,7 +1943,7 @@ undefined ), labelData: treeNode.labelData, - imageData: treeNode.imageData, + imageData: treeNode.imageData }; if ( @@ -1905,11 +1954,11 @@ ) { de.labelData = { horizontalOrigin: Cesium.HorizontalOrigin.LEFT, - pixelOffset: new Cesium.Cartesian2(20, 0), + pixelOffset: new Cesium.Cartesian2(20, 0) }; de.imageData = { horizontalOrigin: Cesium.HorizontalOrigin.CENTER, - pixelOffset: new Cesium.Cartesian2(0, 0), + pixelOffset: new Cesium.Cartesian2(0, 0) }; } layer = sgworld.Creator.createLabelPointGeoJsonFeatureLayer( @@ -1943,7 +1992,7 @@ "rgba(0,0,0,0)" ), near: sgworld.Core.defaultValue(treeNode.near, 0), - far: sgworld.Core.defaultValue(treeNode.far, Infinity), + far: sgworld.Core.defaultValue(treeNode.far, Infinity) }; layer = sgworld.Creator.createPolylineGeoJsonFeatureLayer( @@ -1970,7 +2019,7 @@ near: "0", far: "99999999999", radiusScale: treeNode.radiusScale, - connect: true, + connect: true }; layer = sgworld.Creator.createpolylineVolumeGeojsonPrimitiveLayer( treeNode.name, @@ -1981,13 +2030,12 @@ function (data) { if (treeNode.flow) { let lines = data.entities.values; - lines.forEach((line) => { - line.polylineVolume.material = - sgworld.Core.getTrailLinkMaterial( - sgworld.Core.defaultValue(treeNode.color, "#ff0000"), - "../static/images/smoke.png", - 9000 - ); + lines.forEach(line => { + line.polylineVolume.material = sgworld.Core.getTrailLinkMaterial( + sgworld.Core.defaultValue(treeNode.color, "#ff0000"), + "../static/images/smoke.png", + 9000 + ); }); } } @@ -2003,7 +2051,7 @@ heightReference: 0, height: sgworld.Core.defaultValue(treeNode.height, 0), near: "0", - far: "99999999999", + far: "99999999999" }; layer = sgworld.Creator.createModelPointGeoJsonFeatureLayer( treeNode.name, @@ -2033,7 +2081,7 @@ clampToGround: sgworld.Core.defaultValue( treeNode.clampToGround, treeNode.extrudedHeight === undefined && - treeNode.height === undefined + treeNode.height === undefined ), classificationType: treeNode.classificationType, near: sgworld.Core.defaultValue(treeNode.near, 0), @@ -2053,7 +2101,7 @@ labelOutlineWidth: 2, disableDepthTestDistance: treeNode.disableDepthTestDistance, - water: treeNode.water, + water: treeNode.water }; layer = sgworld.Creator.createPolygonGeoJsonFeatureLayer( treeNode.name, @@ -2072,14 +2120,14 @@ width: treeNode.width || 4.0, //绾跨殑瀹藉害 pointColor: treeNode.pointColor || "#FFFFFF", //绉诲姩鐐圭殑棰滆壊 speed: treeNode.speed || 5, - far: treeNode.far || 5000, + far: treeNode.far || 5000 }); break; case "vector": { let urls = { url: treeNode.urls, layer: treeNode.layer, - srs: treeNode.srs, + srs: treeNode.srs }; if ( treeNode.class === "point" || @@ -2137,7 +2185,7 @@ undefined ), labelData: treeNode.labelData, - imageData: treeNode.imageData, + imageData: treeNode.imageData }; } @@ -2149,11 +2197,11 @@ ) { de.labelData = { horizontalOrigin: Cesium.HorizontalOrigin.LEFT, - pixelOffset: new Cesium.Cartesian2(20, 0), + pixelOffset: new Cesium.Cartesian2(20, 0) }; de.imageData = { horizontalOrigin: Cesium.HorizontalOrigin.CENTER, - pixelOffset: new Cesium.Cartesian2(0, 0), + pixelOffset: new Cesium.Cartesian2(0, 0) }; } urls.upperLevelLimit = de.level_max; @@ -2164,7 +2212,7 @@ de, "0", treeNode.checked, - function () {} + function () { } ); } else if (treeNode.class === "polylineVolume") { de = { @@ -2184,7 +2232,7 @@ height: sgworld.Core.defaultValue(treeNode.height, 0), near: sgworld.Core.defaultValue(treeNode.near, 0), far: sgworld.Core.defaultValue(treeNode.far, 99999999999), - radiusScale: treeNode.radiusScale, + radiusScale: treeNode.radiusScale }; urls.upperLevelLimit = de.level_max; urls.lowerLevelLimit = de.level_min; @@ -2194,7 +2242,7 @@ de, "0", treeNode.checked, - function () {} + function () { } ); } else if (treeNode.class === "polyline") { de = { @@ -2222,20 +2270,19 @@ "rgba(0,0,0,0)" ), near: sgworld.Core.defaultValue(treeNode.near, 0), - far: sgworld.Core.defaultValue(treeNode.far, Infinity), + far: sgworld.Core.defaultValue(treeNode.far, Infinity) }; urls.upperLevelLimit = de.level_max; urls.lowerLevelLimit = de.level_min; - layer = - sgworld.Creator.createPrimitivePolylineVectorGeoJsonFeatureLayerProvider( - treeNode.name, - urls, - de, - "0", - treeNode.checked, - function () {} - ); + layer = sgworld.Creator.createPrimitivePolylineVectorGeoJsonFeatureLayerProvider( + treeNode.name, + urls, + de, + "0", + treeNode.checked, + function () { } + ); } else if (treeNode.class === "polygon") { de = { id: treeNode.id, @@ -2256,19 +2303,18 @@ ), classificationType: treeNode.classificationType, near: sgworld.Core.defaultValue(treeNode.near, 0), - far: sgworld.Core.defaultValue(treeNode.far, Infinity), + far: sgworld.Core.defaultValue(treeNode.far, Infinity) }; urls.upperLevelLimit = de.level_max; urls.lowerLevelLimit = de.level_min; - layer = - sgworld.Creator.createGeoJsonFeatureLayerProviderOptimization( - treeNode.name, - urls, - de, - "0", - treeNode.checked, - function () {} - ); + layer = sgworld.Creator.createGeoJsonFeatureLayerProviderOptimization( + treeNode.name, + urls, + de, + "0", + treeNode.checked, + function () { } + ); } else if (treeNode.class === "model") { de = { id: treeNode.id, @@ -2282,7 +2328,7 @@ heightReference: 0, height: sgworld.Core.defaultValue(treeNode.height, 0), near: "0", - far: "99999999999", + far: "99999999999" }; //妯″瀷鐐� urls.upperLevelLimit = de.level_max; @@ -2293,7 +2339,7 @@ de, "0", treeNode.checked, - function () {} + function () { } ); } layer && (treeNode.id = layer.treeobj.id); @@ -2305,7 +2351,7 @@ { id: treeNode.id, requestVertexNormals: true, - url: treeNode.urls, + url: treeNode.urls }, "0", true, @@ -2322,7 +2368,7 @@ url: treeNode.urls || "", token: treeNode.token, cacheUrl: treeNode.cacheUrl, - cacheLevel: treeNode.cacheLevel, + cacheLevel: treeNode.cacheLevel }, "0", true, @@ -2339,7 +2385,7 @@ url: treeNode.urls, token: treeNode.token, cacheUrl: treeNode.cacheUrl, - cacheLevel: treeNode.cacheLevel, + cacheLevel: treeNode.cacheLevel }, "0", true, @@ -2352,7 +2398,7 @@ { id: treeNode.id, requestVertexNormals: true, - url: treeNode.urls, + url: treeNode.urls }, "0", true, @@ -2364,7 +2410,7 @@ treeNode.name, { id: treeNode.id, - requestVertexNormals: true, + requestVertexNormals: true }, "0", true, @@ -2385,7 +2431,7 @@ treeNode.maximumMemoryUsage && parseInt(treeNode.maximumMemoryUsage), geometricError: - treeNode.geometricError && parseInt(treeNode.geometricError), + treeNode.geometricError && parseInt(treeNode.geometricError) }, { groundCenter: treeNode.Center, @@ -2397,7 +2443,7 @@ effectsMaxHeight: treeNode.effectsMaxHeight || 150, colors: treeNode.alpha ? "rgba(255,255,255," + treeNode.alpha + ")" - : treeNode.color || undefined, + : treeNode.color || undefined }, "0", true @@ -2407,7 +2453,7 @@ layer = sgworld.Creator.createS3MLayer( treeNode.urls, sgworld._Viewer.scene, - function () {} + function () { } ); break; case "gltf": @@ -2420,7 +2466,7 @@ scale: treeNode.scale || 1, heading: treeNode.heading, pitch: treeNode.pitch, - roll: treeNode.roll, + roll: treeNode.roll }, "0", treeNode.name, @@ -2434,7 +2480,7 @@ case "videoPolygon": layer = sgworld.Creator.addVideoPolygon(treeNode.positions, { url: treeNode.url, - angle: treeNode.angle, + angle: treeNode.angle }); break; case "MilitaryPlotting": @@ -2451,7 +2497,7 @@ treeNode.name, treeNode.position, { - translation: Cesium.Cartesian3.fromElements(0, 0, 0), //骞崇Щ + translation: Cesium.Cartesian3.fromElements(0, 0, 0) //骞崇Щ } ); layer.name = treeNode.name; @@ -2480,7 +2526,7 @@ sgworld.Core.toDegrees(treeNode.posisitons[0]), sgworld.Core.toDegrees(treeNode.posisitons[1]), { - clampToGround: true, + clampToGround: true } ); break; @@ -2524,7 +2570,7 @@ case "DynamicSatellite": let dtwxzsData = sgworld.Creator.createConeRadar(treeNode.position, { color: "#7b9ef7", - radius: 200000, + radius: 200000 }); let weixin = sgworld.Creator.createModel( treeNode.position, @@ -2543,7 +2589,7 @@ treeNode.urls, { id: treeNode.id, - scale: treeNode.scale || 1, + scale: treeNode.scale || 1 }, pID, treeNode.name, @@ -2556,7 +2602,7 @@ treeNode.flyTo = [ treeNode.lon, treeNode.lat, - defaultValue(treeNode.height, 10000), + defaultValue(treeNode.height, 10000) ]; } if (treeNode.minx && treeNode.miny && treeNode.maxx && treeNode.maxy) { @@ -2564,7 +2610,7 @@ treeNode.minx, treeNode.miny, treeNode.maxx, - treeNode.maxy, + treeNode.maxy ]; } if (treeNode.sourceType === "wfs") { @@ -2678,16 +2724,15 @@ // }, initCluster(treeNode) { - this.$set(treeNode, "disabled", true);//缁檛reeNode娣诲姞disabled灞炴�� - + // this.$set(treeNode, "disabled", true); //缁檛reeNode娣诲姞disabled灞炴�� let that = this; let imgUrl; new Cesium.GeoJsonDataSource.load( treeNode.urls + - "?version=1.3.0&request=GetFeature&format=json&typename=" + - treeNode.layer - ).then((dataSource) => { - that.$set(treeNode, "disabled", false); + "?version=1.3.0&request=GetFeature&format=json&typename=" + + treeNode.layer + ).then(dataSource => { + // that.$set(treeNode, "disabled", false); Viewer.dataSources.add(dataSource); clusterItemList.push({ name: treeNode.id, dataSource: dataSource }); // window.clusterItem = dataSource; @@ -2698,7 +2743,7 @@ dataSource.clustering.minimumClusterSize = 20; // foreach鐢ㄤ簬璋冪敤鏁扮粍鐨勬瘡涓厓绱狅紝骞跺皢鍏冪礌浼犻�掔粰鍥炶皟鍑芥暟銆� - dataSource.entities.values.forEach((entity) => { + dataSource.entities.values.forEach(entity => { if (entity.featureType == "yz浜曟暟鎹�") { switch (feature.properties["浜曠被鍨�"]) { default: @@ -2718,7 +2763,7 @@ 0, 5000.0 ), - disableDepthTestDistance: Number.POSITIVE_INFINITY, + disableDepthTestDistance: Number.POSITIVE_INFINITY }; entity.tag = treeNode.id; // entity.label = { @@ -2731,7 +2776,6 @@ // // 鍋忕Щ閲� // pixelOffset: new Cesium.Cartesian2(15, 0), // }; - }); // 娣诲姞鐩戝惉鍑芥暟 @@ -2837,7 +2881,7 @@ canvas.height = size; let ctx = canvas.getContext("2d"); - let promise = new Cesium.Resource.fetchImage(url).then((image) => { + let promise = new Cesium.Resource.fetchImage(url).then(image => { // 寮傚父鍒ゆ柇 try { ctx.drawImage(image, 0, 0); @@ -2868,7 +2912,7 @@ if (checked) { proj4.defs( "EPSG:BJ2000", - `PROJCS["BJ2000",GEOGCS["GCS_China_Geodetic_Coordinate_System_2000",DATUM["D_China_2000",SPHEROID["CGCS2000",6378137.0,298.2572221016125]],PRIMEM["Greenwich",0.0],UNIT["Degree",0.0174532925199433]],PROJECTION["Transverse_Mercator"],PARAMETER["false_easting",800146.323386],PARAMETER["false_northing",-3819654.065068],PARAMETER["central_meridian",116.391111111],PARAMETER["scale_factor",1.0],PARAMETER["latitude_of_origin",0],UNIT["Meter",1.0]]` + `PROJCS["BJ2000",GEOGCS["GCS_China_Geodetic_Coordinate_System_2000",DATUM["D_China_2000",SPHEROID["CGCS2000",6378137.0,298.2572221016125]],PRIMEM["Greenwich",0.0],UNIT["Degree",0.0174532925199433]],PROJECTION["Transverse_Mercator"],PARAMETER["false_easting",799985],PARAMETER["false_northing",-3819110.065068],PARAMETER["central_meridian",116.391111111],PARAMETER["scale_factor",1.0],PARAMETER["latitude_of_origin",0],UNIT["Meter",1.0]]` ); const EPSGBJ2000 = proj4.defs("EPSG:BJ2000"); const topResolution = 52435.4584709169; @@ -2897,21 +2941,31 @@ rectangleNortheastInMeters: new Cesium.Cartesian2( 894455.6954487278, 728066.4921236223 - ), + ) }), maximumLevel: 19, tileHeight: 512, - tileWidth: 512, + tileWidth: 512 }); if (treeNode.name == "鍖椾含2000褰卞儚") { - bj2000SATE = - window.Viewer.imageryLayers.addImageryProvider(customProvider); + bj2000SATE = window.Viewer.imageryLayers.addImageryProvider( + customProvider, + 2 + ); + // console.log(customProvider); + console.log(Viewer.imageryLayers); + console.log(bj2000SATE); + // Viewer.imageryLayers.res; } else if (treeNode.name == "鍖椾含2000鐭㈤噺") { - bj2000Shiliang = - window.Viewer.imageryLayers.addImageryProvider(customProvider); + bj2000Shiliang = window.Viewer.imageryLayers.addImageryProvider( + customProvider, + 2 + ); } else { - lishiyingxiang = - window.Viewer.imageryLayers.addImageryProvider(customProvider); + lishiyingxiang = window.Viewer.imageryLayers.addImageryProvider( + customProvider, + 2 + ); } } else { if (treeNode.name == "鍖椾含2000褰卞儚") { @@ -2924,7 +2978,6 @@ } }, createCustom54(treeNode, checked) { - // debugger; if (checked) { proj4.defs( "EPSG:BJ2000", @@ -2957,21 +3010,27 @@ rectangleNortheastInMeters: new Cesium.Cartesian2( 894455.6954487278, 728066.4921236223 - ), + ) }), maximumLevel: 19, tileHeight: 512, - tileWidth: 512, + tileWidth: 512 }); - lishiyingxiang = - window.Viewer.imageryLayers.addImageryProvider(customProvider); + lishiyingxiang = window.Viewer.imageryLayers.addImageryProvider( + customProvider + ); } else { window.Viewer.imageryLayers.remove(lishiyingxiang, true); } - }, + } }, + watch: { + filterText(val) { + this.$refs.tree.filter(val); + } + } }; -</script> +0.</script> <style scoped> .openLeftMenu { position: absolute; @@ -3001,9 +3060,23 @@ z-index: 9999; } +.switchbox { + margin-top: 5px; +} + .closeLeftMenu:hover { cursor: pointer; transform: rotateZ(90deg); +} + +.canelAllCheck { + + flex: end; +} + +.layerTree { + flex: 1; + overflow-y: auto; } .layerTree .el-tree /deep/ .el-checkbox__inner { @@ -3032,6 +3105,10 @@ /* border: 1px solid #c7c7c7; */ overflow: hidden; /* box-shadow: 0px 0px 5px 2px #a8a8a8; */ +} + +.leftmenu:hover { + background-image: url("~@/assets/img/new/treeClose-y.png"); } .leftmenu { @@ -3065,6 +3142,8 @@ width: 270px; height: 550px; overflow: hidden; + display: flex; + flex-direction: column; /* margin: 20px 0; */ } @@ -3081,6 +3160,8 @@ .el-tree { background: transparent; color: white; + height: 93%; + overflow: auto; } .el-tree /deep/ .el-tree-node__content { @@ -3091,28 +3172,30 @@ background-color: rgba(255, 255, 255, 0.4) !important; } -.el-tree /deep/ .is-current > .el-tree-node__content { +.el-tree /deep/ .is-current>.el-tree-node__content { background-color: rgba(255, 255, 255, 0.4) !important; font-size: 14px; } -.layerTree::-webkit-scrollbar { +::-webkit-scrollbar { /*婊氬姩鏉℃暣浣撴牱寮�*/ - width: 4px; + width: 5px; /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉$殑灏哄*/ - height: 4px; + height: 8px; scrollbar-arrow-color: red; } -.layerTree::-webkit-scrollbar-thumb { +/* 婊氬姩鏉� */ +::-webkit-scrollbar-thumb { border-radius: 5px; - -webkit-box-shadow: inset 0 0 5px rgba(255, 255, 255, 0.2); - box-shadow: inset 0 0 5px rgba(255, 255, 255, 0.2); - background: rgba(255, 255, 255, 0.5); + -webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2); + box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2); + background: rgba(218, 218, 218, 0.5); scrollbar-arrow-color: red; } -.layerTree::-webkit-scrollbar-track { +/* 婊氬姩妲� */ +::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2); box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2); border-radius: 0; @@ -3121,7 +3204,6 @@ .el-tree .TreeNodeClass { width: 100%; - background-color: #bfa; flex: 1; display: flex; align-items: center; -- Gitblit v1.9.3