From 3c2b0d71b20da356c7a8a7a244b47ba244ceb249 Mon Sep 17 00:00:00 2001 From: 13693261870 <252740454@qq.com> Date: 星期六, 27 五月 2023 21:06:44 +0800 Subject: [PATCH] 1 --- src/views/Tools/LayerTree.vue | 1899 +++++++++++++++++------------------------------------------ 1 files changed, 550 insertions(+), 1,349 deletions(-) diff --git a/src/views/Tools/LayerTree.vue b/src/views/Tools/LayerTree.vue index c26ac67..d1577b4 100644 --- a/src/views/Tools/LayerTree.vue +++ b/src/views/Tools/LayerTree.vue @@ -1,1490 +1,690 @@ <template> <div class="lalala tree-container"> - <el-form ref="form"> <el-form-item> - - <el-select - v-model="$store.state.pigCode" - clearable - filterable - style="width :100%" - @change="setproChange" - placeholder="璇烽�夋嫨椤圭洰" - > - <el-option - v-for="item in optionts" - :key="item.code" - :label="item.name" - :value="item.code" - > + <el-select v-model="$store.state.pigCode" + clearable + filterable + style="width :100%" + @change="prjChanged" + placeholder="璇烽�夋嫨椤圭洰"> + <el-option v-for="item in menus" + :key="item.code" + :label="item.name" + :value="item.code"> </el-option> </el-select> </el-form-item> <el-form-item> - <el-input - placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�" - v-model="filterText" - class="search" - > + <el-input placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�" + v-model="filterText" + class="search"> </el-input> </el-form-item> </el-form> - <el-tree - ref="tree" - :data="treeData" - node-key="id" - show-checkbox - :props="defaultProps" - @node-click="handleLeftclick" - @node-contextmenu="rightClick" - @check="handleCheckChange" - :default-checked-keys="handleTreeCheck" - :expand-on-click-node="false" - :filter-node-method="filterNode" - draggable - > - <span - class="slot-t-node" - slot-scope="{ node, data }" - > + <el-tree ref="tree" + :data="treeData" + node-key="id" + show-checkbox + :props="defaultProps" + @node-click="handleLeftclick" + @node-contextmenu="rightClick" + @check="handleCheckChange" + :default-checked-keys="handleTreeCheck" + :expand-on-click-node="false" + :filter-node-method="filterNode" + draggable> + <span class="slot-t-node" + slot-scope="{ node, data }"> <span v-show="!data.isEdit"> <span :class="[data.id >= 99 ? 'slot-t-node--label' : '']">{{ node.label }}</span> </span> <span v-show="data.isEdit"> - <el-input - class="slot-t-input" - size="mini" - autofocus - v-model="data.label" - :ref="'slotTreeInput' + data.id" - @blur.stop="NodeBlur(node, data)" - @keydown.native.enter="NodeBlur(node, data)" - ></el-input> + <el-input class="slot-t-input" + size="mini" + autofocus + v-model="data.label" + :ref="'slotTreeInput' + data.id" + @blur.stop="nodeBlur(node, data)" + @keydown.native.enter="nodeBlur(node, data)"></el-input> </span> </span> </el-tree> - - <el-card - class="box-card" - ref="card" - :style="{ ...rightClickMenuStyle }" - v-show="menuVisible" - > - <!-- <div - @click="addSameLevelNode()" - v-show="firstLevel" - > - <i class="el-icon-plus"></i> 娣诲姞鍥惧眰缁� - </div> --> - <!-- <div - class="add" - @click="addChildNode()" - > - <i class="el-icon-plus"></i> 娣诲姞鍥惧眰 - </div> --> - <!-- <div - class="delete" - @click="deleteNode()" - > - <i class="el-icon-delete"></i> 鍒犻櫎 - </div> --> - <!-- <div - class="edit" - @click="editNode()" - > - <i class="el-icon-edit"></i> 閲嶅懡鍚� - </div> --> - <div - class="edit" - @click="showLayerAttribute()" - v-if="!showlocal && !shwoHistogram" - v-show="!firstLevel" - > + <el-card class="box-card" + ref="card" + :style="{ ...rightClickMenuStyle }" + v-show="menuVisible"> + <div class="edit" + @click="showLayerAttribute()" + v-if="showProp && !shwoHistogram"> <i class="el-icon-tickets"></i> 灞炴�� </div> - <div - class="edit" - @click="positioning()" - v-if="showlocal" - > + <div class="edit" + @click="positioning()" + v-if="showLocal"> <i class="el-icon-tickets"></i> 瀹氫綅 </div> - <div - class="edit" - @click="pellucidity()" - v-if="showopaque" - > + <div class="edit" + @click="pellucidity()" + v-if="showOpacity"> <i class="el-icon-tickets"></i> 閫忔槑搴� </div> - <div - class="edit" - @click="histogram()" - v-show="shwoHistogram" - > + <div class="edit" + @click="histogram()" + v-show="shwoHistogram"> <i class="el-icon-tickets"></i> 閽诲瓟鏌辩姸鍥� </div> - <!-- <div - class="edit" - v-show="showModelAttach" - @click="modelAttach()" - > - <i class="el-icon-tickets"></i> 妯″瀷灞炴�� - </div> --> - <!-- <div - class="edit" - @click="menuMoveF( 'up')" - > - <i class="el-icon-top"></i> 涓婄Щ - </div> - <div - class="edit" - @click="menuMoveF( 'down')" - > - <i class="el-icon-bottom"></i> 涓嬬Щ - </div> --> </el-card> - <el-dialog - :title="appendNodetitle" - :visible.sync="dialogVisible" - width="30%" - top="20vh" - :modal="false" - :before-close="handleClose" - > - <el-form - ref="form" - :model="addFormServer" - label-width="100px" - > - <el-form-item label="鏈嶅姟绫诲瀷"> - <!-- <el-input v-model="addFormServer.type"></el-input> --> - <el-select - style="width: 100%" - :popper-append-to-body="false" - v-model="addFormServer.serveType" - placeholder="璇烽�夋嫨" - > - <el-option - v-for="item in options" - :key="item.value" - :label="item.label" - :value="item.value" - > - </el-option> - </el-select> - </el-form-item> - <el-form-item label="鍥惧眰鍚嶇О"> - <el-input v-model="addFormServer.cnName"></el-input> - </el-form-item> - <el-form-item label="鏈嶅姟鍚嶇О"> - <el-input v-model="addFormServer.url"></el-input> - </el-form-item> - - <el-form-item label="鏈嶅姟鍦板潃"> - <el-input v-model="addFormServer.resource"></el-input> - </el-form-item> - <el-form-item label="閫忔槑搴�"> - <el-slider v-model="addFormServer.opacity"></el-slider> - </el-form-item> - </el-form> - <span - slot="footer" - class="dialog-footer" - > - <el-button - type="primary" - @click="setAddServer" - >纭� 瀹�</el-button> - </span> - </el-dialog> - </div> </template> <script> -import { image_layer } from "../../assets/js/index.js"; -import ImageWMS from "ol/source/ImageWMS"; -import Image from "ol/layer/Image"; import GeoJSON from "ol/format/GeoJSON.js"; -import Map from "ol/Map.js"; import queryinfo from "./queryinfo.vue"; import { Vector as VectorSource } from "ol/source"; import { Vector as VectorLayer } from "ol/layer"; +import { perms_selectLayers, comprehensive_selectPubById, project_selectDirAll, project_selectByDirid, } from "../../api/api.js"; -import View from "ol/View.js"; -import { Fill, Stroke, Style } from "ol/style.js"; -import { - perms_selectLayers, inquiry_selectDomains, comprehensive_selectPubById, - project_selectDirAll, project_selectByDirid, dataQuerySelectWktById -} from "../../api/api.js"; export default { name: "tree", components: { queryinfo }, - data() { + data () { return { - shwoHistogram: false, - showlocal: false, - showopaque: false, - eleId: "", - isShow: false, - currentData: "", - currentNode: "", - menuVisible: false, - firstLevel: false, - filterText: "", - appendNodetitle: "", - maxexpandId: 4, - rightClickMenuStyle: {}, - handleTreeCheck: [], - dialogVisible: false, - showModelAttach: false, - addFormServer: { - opacity: 100, - serveType: "WMS", - type: 2, - }, + isBusy: false, // 姝e繖 + lastPrjCode: "", // 鏈�鍚庨�夋嫨椤圭洰缂栫爜 + showProp: false, // 灞炴�� + shwoHistogram: false, // 閽诲瓟鏌辩姸鍥� + showLocal: false, // 瀹氫綅 + showOpacity: false, // 涓嶉�忔槑搴� + menuVisible: false, // 鑿滃崟 + levelArray: [ // 楂樼▼鏁扮粍 + 0, 40000000, 20000000, 10000000, 5000000, 2000000, 1000000, 500000, + 250000, 200000, 100000, 50000, 17000, 9000, 5000, 2000, 1000, 500, 200, + 100, 50, 25, 10, 0, + ], + filterText: "", // 鍏抽敭瀛楄繃婊� + currentData: "", // 褰撳墠鏁版嵁 + currentNode: "", // 褰撳墠鑺傜偣 + rightClickMenuStyle: {}, // 鍙抽敭鑿滃崟鏍峰紡 + handleTreeCheck: [], // 榛樿閫変腑閿� layerId: [ "m_pipeline", "th_strategic_channel", "bs_project", "m_sitepoint", ], - treeData: [], - defaultProps: { + treeData: [], // 鏍戞暟鎹� + defaultProps: { // 榛樿灞炴�у�� children: "children", label: "cnName", }, - options: [ - { - value: "WMS", - label: "WMS", - }, - { - value: "WFS", - label: "WFS", - }, - ], - childOption: [], - mptLayer: [], - optionts: [], - proValue: null, + mptLayer: [], // Mpt鍥惧眰 + menus: [] // 鑿滃崟椤� }; }, + watch: { + filterText (val) { + this.$refs.tree.filter(val); + }, + }, + mounted () { + this.getMenus(); + this.$bus.$on("treeDataCopy", (res) => { + this.$store.state.treeData = this.treeData; + this.$store.state.checkedKeys = this.$refs.tree.getCheckedKeys(); + }); + if (this.$store.state.showAllLayers) { + this.layersStart(); + this.$store.state.showAllLayers = false; + } else { + this.treeData = this.$store.state.treeData; + this.$refs.tree.setCheckedKeys(this.$store.state.checkedKeys); + } + }, methods: { - - //杞瓟鏌辩姸鍥� - async histogram() { - this.menuVisible = false - var layer = this.currentData.enName.replaceAll("_", ""); - this.$store.state.mapSpaceQueryLayer = layer; - this.$store.state.mapPopBoxFlag = "2"; - this.$store.state.showPopBoxFlag = true; + // 鑾峰彇鑿滃崟 + async getMenus () { + let data = await project_selectDirAll(); + if (data && data.code == 200) this.menus = data.result; }, - modelAttach() { - this.menuVisible = false; - this.$store.state.attachinfo = this.currentData; - this.$store.state.attachModel = true; + // 鍒濆鍖栧浘灞� + async layersStart () { + let data = await perms_selectLayers(); + if (data.code != 200) { + return this.$message.error("鍥惧眰鍒楄〃鏌ヨ澶辫触"); + } - - }, - NodeBlur(Node, data) { - if (data.label.length === 0) { - this.$message.error("鑿滃崟鍚嶄笉鍙负绌猴紒"); - return false; - } else { - if (data.isEdit) { - this.$set(data, "isEdit", false); + let checkKey = [], checkedLayers = []; + let layers = data.result.filter((lyr) => { + if (lyr.url && lyr.type == 2 && lyr.isShow == 1) { + checkKey.push(lyr.id); + if (lyr.serveType == "WMS") checkedLayers.push(lyr); } - this.$nextTick(() => { - this.$refs["slotTreeInput" + data.id].$refs.input.focus(); - }); - } + return lyr; + }); + // 瀛樺偍閫変腑鍥惧眰 + this.treeData = this.setTreeData(layers); + this.$refs.tree.setCheckedKeys(checkKey); + sessionStorage.setItem("checkedLayers", JSON.stringify(checkedLayers)); }, - - - allowDrop(draggingNode, dropNode, type) { - if (dropNode.data.label === "浜岀骇 3-1") { - return type !== "inner"; - } else { - return true; - } + // 璁剧疆鏍戞暟鎹� + setTreeData (source) { + let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕 + return cloneData.filter((father) => { + // 寰幆鎵�鏈夐」 + let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁 + branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊� + // 灞炰簬鍚屼竴瀵硅薄闂锛屼緥濡傦細浠� a=b銆乧=1 锛岀劧鍚庡啀浠� b.c=c 锛岄偅涔� a.c=b.c=c=1 锛涘悓鐞嗭紝鍚庣画浠� c.d=2 ,閭d箞 a.c.d 涔熸槸=2锛� + return father.pid == 0; // 杩斿洖涓�绾ц彍鍗� + }); }, - allowDrag(draggingNode) { - return draggingNode.data.label.indexOf("涓夌骇 3-2-2") === -1; + // 鑺傜偣鑾峰緱鐒︾偣浜嬩欢 + nodeBlur (node, data) { + if (!data.label.length) return this.$message.error("鑿滃崟鍚嶄笉鍙负绌猴紒"); + if (data.isEdit) this.$set(data, "isEdit", false); + this.$nextTick(() => { + this.$refs["slotTreeInput" + data.id].$refs.input.focus(); + }); + }, + // 榧犳爣宸﹀嚮浜嬩欢 + handleLeftclick (data, node) { + this.rmListener(); + }, + // 鍙栨秷榧犳爣鐩戝惉浜嬩欢 + rmListener () { + this.menuVisible = false; + // 瑕佸強鏃跺叧鎺夌洃鍚紝涓嶅叧鎺夌殑鏄竴涓潙锛屼笉淇′綘璇曡瘯锛岃櫧鐒跺墠鍙版樉绀虹殑鏃跺�欐病鏈夊暐姣涚梾锛屽姞涓�涓猘lert浣犲氨鐭ラ亾浜� + document.removeEventListener("click", this.rmListener); + }, + // 杩囨护鑺傜偣 + filterNode (value, data) { + if (!value) return true; + return data.cnName.indexOf(value) !== -1; }, // 榧犳爣鍙冲嚮浜嬩欢 - rightClick(event, object, Node, element) { - if (object.type == 1) { - return - } + rightClick (event, object, node, element) { + if (object.type == 1 || node.data.children != null) return; + + this.currentNode = node; this.currentData = object; - this.currentNode = Node; + this.$store.state.propertiesName = object; - this.$store.state.propertiesName = this.currentData; - this.showModelAttach = false; - this.shwoTitle = false; - this.menuVisible = true; - - if (this.currentData.serveType == 'TMS') { - this.shwoTitle = true - } else if (this.currentData.serveType == "Tileset" || this.currentData.serveType == "3DML") { - this.showModelAttach = true; - } else if (this.currentData.serveType == "DOM" || this.currentData.serveType == "Mpt") { - this.menuVisible = false; - } - - if (this.currentData.enName == "s_explorationpoint") { - this.shwoHistogram = true; - } else { - this.shwoHistogram = false; - } - - if (Node.data.children == null) { - this.firstLevel = false; - } else { - this.firstLevel = true; - } - if (Node.data.children == null && Node.data.serveType == "Tileset" || Node.data.serveType == "3DML") { - this.showlocal = true; - this.showopaque = true; - } else if (Node.data.children == null && Node.data.serveType == "TMS") { - this.showlocal = true; - this.showopaque = false; - } else if (Node.data.children == null && Node.data.serveType != "Tileset") { - this.showlocal = false; - this.showopaque = false; - } - if (this.currentData.serveType == "DEM") { - this.showlocal = true; - this.showopaque = false; - } + this.showProp = object.serveType == "WMS"; // 灞炴�� + this.shwoHistogram = this.showProp && object.enName == "s_explorationpoint"; // 閽诲瓟鏌辩姸鍥� + this.showLocal = ["Tileset", "3DML", "Mpt", "TMS", "DOM", "DEM"].indexOf(object.serveType) > -1; // 瀹氫綅 + this.showOpacity = ["Tileset", "3DML"].indexOf(object.serveType) > -1; // 涓嶉�忔槑搴� + this.menuVisible = this.showProp || this.shwoHistogram || this.showLocal || this.showOpacity; // 鑿滃崟 this.$refs.card.$el.style.left = event.pageX + 20 + "px"; this.$refs.card.$el.style.top = event.pageY + "px"; }, - // 榧犳爣宸﹀嚮浜嬩欢 - handleLeftclick(data, node) { - this.foo(); - if (node.checked == true) { - for (var i = 0; i < window.Viewer.imageryLayers._layers.length; i++) { - var val_id = - window.Viewer.imageryLayers._layers[i].imageryProvider.name; - if (val_id == data.label) { - const img_layer = window.Viewer.imageryLayers._layers[i]; - } - } - } - }, - // 鍙栨秷榧犳爣鐩戝惉浜嬩欢 鑿滃崟鏍� - foo() { - this.menuVisible = false; - // 瑕佸強鏃跺叧鎺夌洃鍚紝涓嶅叧鎺夌殑鏄竴涓潙锛屼笉淇′綘璇曡瘯锛岃櫧鐒跺墠鍙版樉绀虹殑鏃跺�欐病鏈夊暐姣涚梾锛屽姞涓�涓猘lert浣犲氨鐭ラ亾浜� - document.removeEventListener("click", this.foo); - }, - // 澧炲姞鍚岀骇鑺傜偣浜嬩欢 - addSameLevelNode() { - this.menuVisible = false - this.foo(); - if (this.currentNode.level == 2) { - this.appendNodetitle = this.currentData.label; - this.dialogVisible = true; - } else { - let id = Math.ceil(Math.random() * 100); - var data = { id: id, label: "鏂板鑺傜偣" }; - this.$refs.tree.append(data, this.currentNode.parent); - } - }, - // 澧炲姞瀛愮骇鑺傜偣浜嬩欢 - addChildNode() { - this.foo(); - this.menuVisible = false - // if (this.currentNode.level >= 2) { - // this.$message.error("鏈�澶氬彧鏀袱绾э紒"); - // return false; - // } - this.appendNodetitle = this.currentData.label; - this.dialogVisible = true; - }, - handleClose() { - this.dialogVisible = false; - this.addFormServer = { - opacity: 100, - serveType: "WMS", - type: 2, - }; - }, - setAddServer() { - var val = this.currentNode; - if (this.currentNode.level == 2) { - val = this.currentNode.parent; - } - var data = this.addFormServer; - data.id = Math.ceil(Math.random() * 100); - this.$refs.tree.append(data, val); - this.handleClose(); - }, - // 鍒犻櫎鑺傜偣 - deleteNode() { - this.foo(); - this.menuVisible = false - var label = this.currentNode.data.cnName; - if (this.currentNode.data.serveType == "WMS") { - var value = this.$refs.tree.getCheckedNodes(); - - this.$bus.$emit("showMenuLayer", value); - - } else if (this.currentNode.data.serveType == "WFS") { - for (var i in window.Viewer.dataSources._dataSources) { - if (window.Viewer.dataSources._dataSources[i].name == label) { - window.Viewer.dataSources.remove( - window.Viewer.dataSources._dataSources[i] - ); - } - } - } else if (this.currentNode.data.serveType == "Tileset") { - for (var i in Viewer.scene.primitives._primitives) { - // Viewer.scene.primitives._primitives[i].show = checked; - if (Viewer.scene.primitives._primitives[i].id == label) { - Viewer.scene.primitives.remove( - Viewer.scene.primitives._primitives[i] - ); - } - } - var list = this.$store.state.setAlphaList; - for (var i = 0; i < list.length; i++) { - if (list[i].name == label) { - list.splice(i, 1) - } - } - - } - var layers_ol = window.map.getAllLayers(); - for (var i in layers_ol) { - var layerOl = layers_ol[i]; - if (layerOl.values_.name == label) { - window.map.removeLayer(layerOl); //鏄剧ず鍥惧眰 - } - } - - this.$refs.tree.remove(this.currentNode); - }, - //灞炴�ф樉绀� - showLayerAttribute(data) { - this.foo(); - this.menuVisible = false + // 灞炴�ф樉绀� + showLayerAttribute (data) { + this.rmListener(); this.currentData = data ? data : this.currentData; - var layer = this.currentData.enName.replaceAll("_", ""); + let layer = this.currentData.enName.replaceAll("_", ""); this.$store.state.mapSpaceQueryLayer = layer; this.$store.state.showPopBoxFlag = true; this.$store.state.mapPopBoxFlag = "2"; - - }, - //妯″瀷璁剧疆閫忔槑搴� - pellucidity() { - this.foo(); - this.menuVisible = false - var tile = this.currentData - for (var j in Viewer.scene.primitives._primitives) { - if (Viewer.scene.primitives._primitives[j].id == tile.cnName) { + // 瀹氫綅 + async positioning () { + this.rmListener(); + if (["Tileset", "3DML"].indexOf(this.currentData.serveType) > -1) { + for (let i in Viewer.scene.primitives._primitives) { + if (Viewer.scene.primitives._primitives[i].id == this.currentData.cnName) { + Viewer.flyTo(Viewer.scene.primitives._primitives[i]); + break; + } + } + return; + } + + if (["TMS", "DOM", "DEM"].indexOf(this.currentData.serveType) > -1 && this.currentData.pubid) { + let data = await comprehensive_selectPubById({ id: this.currentData.pubid }); + if (data.result && data.result.geom) { + let wkt = this.$wkt.parse(data.result.geom); + let height = this.getHeight(wkt.coordinates[2]); + Viewer.camera.flyTo({ + destination: Cesium.Cartesian3.fromDegrees(wkt.coordinates[1], wkt.coordinates[0], height), // 2000 + }); + } + return; + } + + if ("Mpt" == this.currentData.serveType) { + viewer.camera.flyTo({ destination: Cesium.Cartesian3.fromDegrees(101.8, 37.9, 10000000.0) }); // 涓浗 + } + }, + // 閽诲瓟鏌辩姸鍥� + async histogram () { + this.rmListener(); + let layer = this.currentData.enName.replaceAll("_", ""); + this.$store.state.mapSpaceQueryLayer = layer; + this.$store.state.mapPopBoxFlag = "2"; + this.$store.state.showPopBoxFlag = true; + }, + // 閫忔槑搴� + pellucidity () { + this.rmListener(); + for (let j in Viewer.scene.primitives._primitives) { + if (Viewer.scene.primitives._primitives[j].id == this.currentData.cnName) { this.$store.state.setAlphaDity = this.currentData; this.$bus.$emit("showPellucidity", true); break; } } }, + // 鑾峰彇楂樺害 + getHeight (level) { + if (level > -1 && level < 23) return this.levelArray[level]; + return this.levelArray[this.levelArray.length - 1]; + }, + // 鍥惧眰閫変腑浜嬩欢 + handleCheckChange (data, checked) { + if (this.isBusy) return; + let nodes = []; + this.getNodes(data, nodes); + let obj = { WMS: [], Tileset: [], TMS: [], Mpt: [], DEM: [] }; - //妯″瀷瀹氫綅 - async positioning() { - this.menuVisible = false - if (this.currentData.serveType == 'Tileset' || this.currentData.serveType == '3DML') { - for (var i in Viewer.scene.primitives._primitives) { - if ( - Viewer.scene.primitives._primitives[i].id == this.currentData.cnName - ) { - Viewer.flyTo(Viewer.scene.primitives._primitives[i]); + for (let i = 0, c = nodes.length; i < c; i++) { + let node = nodes[i]; + switch (node.serveType) { + case "WMS": + obj.WMS.push(node); + break; + case "3DML": + case "Tileset": + obj.Tileset.push(node); + break; + case "TMS": + obj.TMS.push(node); + break; + case "Mpt": + obj.Mpt.push(node); + break; + case "DEM": + obj.DEM.push(node); + break; + } + } + + if (obj.WMS.length) this.setChangeWMS(obj.WMS, checked); + if (obj.Tileset.length) this.setChangeTileset(obj.Tileset, checked); + if (obj.TMS.length) this.setChangeTMS(obj.TMS, checked); + if (obj.Mpt.length) this.setChangeMpt(obj.Mpt, checked); + if (obj.DEM.length) this.setChangeDEM(obj.DEM, checked); + }, + // 鑾峰彇瀛愯妭鐐� + getNodes (data, arr) { + if (data.children) { + for (let i = 0, c = data.children.length; i < c; i++) { + let node = data.children[i]; + if (node.children) { + this.getNodes(node, arr) + } else { + arr.push(node); } - } - } else if (this.currentData.pubid && this.currentData.serveType == 'TMS' || this.currentData.serveType == "DEM") { - const data = await comprehensive_selectPubById({ id: this.currentData.pubid }) - if (data.result.geom) { - var wkt = this.$wkt.parse(data.result.geom); - Viewer.camera.flyTo({ - destination: Cesium.Cartesian3.fromDegrees(wkt.coordinates[1], wkt.coordinates[0], 2000), - }); - } - } - }, - // 缂栬緫鑺傜偣 - editNode(data) { - this.foo(); - this.menuVisible = false - this.currentData = data ? data : this.currentData; - if (!this.currentData.isEdit) { - this.$set(this.currentData, "isEdit", true); - } - // 鑾峰彇鐒︾偣 - this.$nextTick(() => { - this.$refs["slotTreeInput" + this.currentData.id].focus(); - }); - }, - - menuMoveF(type) { - // 灏嗗彉鍔ㄤ箣鍓嶇殑node澶囦唤 - var node = this.currentNode; - var data = this.currentData; - let copyNode = this.currentNode; - - // copyNode.previousSibling = {...node. } - // copyNode.nextSibling = {...node.nextSibling} - // window.sessionStorage.setItem('menuNode',CircularJSON.stringify(copyNode)) - let nodeData = {}; - if (type === "up") { - // 涓婄Щ - if (node.previousSibling) { - // 鍒犻櫎鍘熷厛鐨刵ode - this.$refs.tree.remove(node.data); - // 鎷垮埌copy鐨刵ode - // nodeData = CircularJSON.parse(window.sessionStorage.getItem('menuNode')) - // // 澶嶅埗璇ode鍒版寚瀹氫綅缃�(鍙傛暟锛�1. 瑕佸鍔犵殑鑺傜偣鐨� data 2. 瑕佸鍔犵殑鑺傜偣鐨勫悗涓�涓妭鐐圭殑 data銆乲ey 鎴栬�� node) - // this.$refs.tree.insertBefore(nodeData.data,nodeData.previousSibling.data) - window.sessionStorage.removeItem("menuNode"); - } else { - this.$message.warning("璇ヨ彍鍗曞凡缁忔槸褰撳墠灞傛渶涓婄骇"); } } else { - // 涓嬬Щ - if (node.nextSibling) { - this.$refs.tree.remove(node.data); - nodeData = CircularJSON.parse( - window.sessionStorage.getItem("menuNode") - ); - // 鍙傛暟锛�1. 瑕佸鍔犵殑鑺傜偣鐨� data 2. 瑕佸鍔犵殑鑺傜偣鐨勫墠涓�涓妭鐐圭殑 data銆乲ey 鎴栬�� node - this.$refs.tree.insertAfter(nodeData.data, nodeData.nextSibling.data); - window.sessionStorage.removeItem("menuNode"); - } else { - this.$message.warning("璇ヨ彍鍗曞凡缁忔槸褰撳墠灞傛渶涓嬬骇"); - } + arr.push(data); } }, - - handleDragStart(node, ev) { - console.log("drag start", node); - }, - handleDragEnter(draggingNode, dropNode, ev) { - console.log("tree drag enter: ", dropNode.label); - }, - handleDragLeave(draggingNode, dropNode, ev) { - console.log("tree drag leave: ", dropNode.label); - }, - handleDragOver(draggingNode, dropNode, ev) { - console.log("tree drag over: ", dropNode.label); - }, - handleDragEnd(draggingNode, dropNode, dropType, ev) { - console.log("tree drag end: ", dropNode && dropNode.label, dropType); - }, - handleDrop(draggingNode, dropNode, dropType, ev) { - console.log("tree drop: ", dropNode.label, dropType); - }, - handleCheckChange(data, checked, indeterminate) { - if (data.type == 1) { - this.childOption = []; - this.getchilds(data); - var listWMS = []; - var listWFS = []; - var listTileset = []; - var listTMS = []; - var listMpt = []; - var listDEM = []; - for (var i in this.childOption) { - switch (this.childOption[i].serveType) { - case 'WMS': - listWMS.push(this.childOption[i]) - break; - case 'WFS': - listWFS.push(this.childOption[i]) - break; - case '3DML': - listTileset.push(this.childOption[i]) - break; - case 'Tileset': - listTileset.push(this.childOption[i]) - break; - case 'Mpt': - listMpt.push(this.childOption[i]) - break; - case 'TMS': - listTMS.push(this.childOption[i]) - break; - case 'DEM': - this.setChangeDEM([data], checked); - break; - } - } - this.setChangeWMS(listWMS, checked); - this.setChangeWFS(listWFS, checked); - this.setChangeTileset(listTileset, checked); - this.setChangeTMS(listTMS, checked); - this.setChangeMpt(listMpt, checked); - } else if (data.type == 2) { - if (data.serveType == "WMS") { - this.setChangeWMS([data], checked); - } else if (data.serveType == "Tileset" || data.serveType == "3DML") { - this.setChangeTileset([data], checked); - } else if (data.serveType == "TMS") { - this.setChangeTMS([data], checked); - } else if (data.serveType == "Mpt") { - this.setChangeMpt([data], checked); - } else if (data.serveType == "DEM") { - this.setChangeDEM([data], checked); - } + // 鑾峰彇鑺傜偣ID + getCheckNodesIds () { + let nodes = this.$refs.tree.getCheckedNodes(); + let ids = []; + for (let i in nodes) { + ids.push(nodes[i].id); } - // if (data.type != 2) return; - - - - // if (data.serveType == "WFS") { - // if (window.Viewer.dataSources._dataSources.length == 0) { - // this.setAddLayers(data); - // } else { - - // } - // } else if (data.serveType == "Tileset") { - - // if (Viewer.scene.primitives._primitives.length == 0) { - // this.setAddLayers(data); - // } else { - // var std = []; - // for (var i in Viewer.scene.primitives._primitives) { - // Viewer.scene.primitives._primitives[i].show = checked; - // if (Viewer.scene.primitives._primitives[i].id == data.cnName) { - // std.push(data.id); - // Viewer.flyTo(Viewer.scene.primitives._primitives[i]); - // } - // } - // } - // if (std.length == 0 && checked == true) { - // this.setAddLayers(data); - // } else { - // window.map.getLayers().getArray().forEach(item => { - // if (item.get("name") == data.cnName) { - // item.setVisible(checked); - - // } - // }); - // } - // } else if (data.serveType == "TMS") { - - // if (data.pubid) { - - // } else { - // var res; - // if (data.url.indexOf("{host}") != -1) { - // res = data.url.replace("{host}", iisHost); - // } else { - // res = data.url - // } - // var url = res.split(';') - - // window.sgworld.Creator.createImageryProvider('mpt褰卞儚', "wms", { - // url: url[0], - // layers: url[1] - // }, "0", undefined, true, ""); - // } - - // } - - - - - // var layers_ol = window.map.getAllLayers(); - // for (var i in layers_ol) { - // var layerOl = layers_ol[i]; - // if (layerOl.values_.name == data.label) { - // layerOl.setVisible(checked); //鏄剧ず鍥惧眰 - // } - // } + return ids; }, - setChangeWMS(result, checked) { - var value = this.$refs.tree.getCheckedNodes(); + // 鍒囨崲WMS鏈嶅姟 + setChangeWMS (layers, checked) { + let value = this.$refs.tree.getCheckedNodes(); this.$bus.$emit("showMenuLayer", value); }, - setChangeWFS(result, checked) { - var value = this.$refs.tree.getCheckedNodes(); - var std = []; - for (var i in value) { - std.push(value[i].id) - } - for (var i in result) { - var tile = result[i] - if (std.indexOf(tile.id) != -1) { - this.setAddLayers(tile) - } else { - for (var i in window.Viewer.dataSources._dataSources) { - if (window.Viewer.dataSources._dataSources[i].name == tile.cnName) { - window.Viewer.dataSources.remove(window.Viewer.dataSources._dataSources[i]); - } - } + // 鍒囨崲Tileset + setChangeTileset (layers, checked) { + let ids = this.getCheckNodesIds(), arr = []; + for (let k in layers) { + let layer = layers[k]; + if (ids.indexOf(layer.id) > -1) { + arr.push(layer); + continue; + } - var layers_ol = window.map.getAllLayers(); - for (var i in layers_ol) { - var layerOl = layers_ol[i]; - if (layerOl.values_.name == tile.cnName) { - window.map.removeLayer(layerOl) - } + for (let j in Viewer.scene.primitives._primitives) { + if (Viewer.scene.primitives._primitives[j].id == layer.cnName) { + Viewer.scene.primitives.remove(Viewer.scene.primitives._primitives[j]); + break; + } + } + + let list = this.$store.state.setAlphaList; + for (let i = 0; i < list.length; i++) { + if (list[i].name == layer.cnName) { + list.splice(i, 1); } } } + + if (arr.length) this.addTilesetLayers(arr); }, - setChangeTileset(result, checked) { - var value = this.$refs.tree.getCheckedNodes(); - var std = []; - for (var i in value) { - std.push(value[i].id) - } - for (var i in result) { - var tile = result[i] - if (std.indexOf(tile.id) != -1) { - this.setAddLayers(tile) - } else { - for (var j in Viewer.scene.primitives._primitives) { - if (Viewer.scene.primitives._primitives[j].id == tile.cnName) { - Viewer.scene.primitives.remove(Viewer.scene.primitives._primitives[j]) - } - } - var list = this.$store.state.setAlphaList; - for (var i = 0; i < list.length; i++) { - if (list[i].name == tile.cnName) { - list.splice(i, 1) - } - } - } - } + // 娣诲姞Tileset鍥惧眰 + addTilesetLayers (layers) { + for (let i in layers) { + let res = layers[i]; + let url = res.url.indexOf("{host}") > -1 ? res.url.replace("{host}", iisHost) : modelUrl + "/" + res.url; - - - // if (checked.checkedKeys) { - // for (var i in result) { - // - // } - // } else { - - // for (var j in result) { - // console.log(result[j]) - // // - // } - // } - }, - - - setChangeDEM(result, checked) { - var value = this.$refs.tree.getCheckedNodes(); - var std = []; - var val = []; - for (var i in value) { - if (value[i].serveType != 'DEM') { - val.push(value[i].id) - } - std.push(value[i].id) - } - - - if (window.terrainFlag == 'MPT') { - window.terrainLayer.deleteObject(); - } else if (window.terrainFlag == 'DEM') { - Viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider(); - window.terrainLayer = null; - } - - var tile = result[0] - - if (std.indexOf(tile.id) != -1) { - val.push(tile.id); - this.$refs.tree.setCheckedKeys(val); - window.terrainLayer = new Cesium.CesiumTerrainProvider({ - url: tile.url.replace("{host}", iisHost) - }); - Viewer.terrainProvider = window.terrainLayer - window.terrainFlag = 'DEM' - } else { - - var option = { - url: window.sceneConfig.SGUrl, - layerName: window.sceneConfig.mptName, - requestVertexNormals: true, - }; - window.terrainLayer = sgworld.Creator.sfsterrainprovider("", option, "", true, ""); - Viewer.camera.flyTo({ - destination: Cesium.Cartesian3.fromDegrees(110, 33, 8000000), - }); - window.terrainFlag = 'MPT' - } - - }, - - setChangeMpt(result, checked) { - var value = this.$refs.tree.getCheckedNodes(); - var std = []; - for (var i in value) { - std.push(value[i].id) - } - for (var i in result) { - var tile = result[i] - if (std.indexOf(tile.id) != -1) { - this.setAddLayers(tile) - - } else { - for (var i in this.mptLayer) { - if (this.mptLayer[i].treeobj.name == tile.cnName) { - this.mptLayer[i].deleteObject(); - this.mptLayer.splice(i, 1) - } - } - } - } - }, - setChangeTMS(result, checked) { - var value = this.$refs.tree.getCheckedNodes(); - var std = []; - for (var i in value) { - std.push(value[i].id) - } - for (var i in result) { - var tile = result[i] - if (std.indexOf(tile.id) != -1) { - this.setAddLayers(tile) - - } else { - for (var i = 0; i < window.Viewer.imageryLayers._layers.length; i++) { - var val_id = window.Viewer.imageryLayers._layers[i].name; - if (val_id == tile.cnName) { - window.Viewer.imageryLayers.remove( - window.Viewer.imageryLayers._layers[i] - ); - } - } - } - } - }, - getchilds(source) { - if (source.children) { - var child = source.children - for (var i in child) { - if (child[i].children) { - this.getchilds(child[i]) - } else { - this.childOption.push(child[i]) - } - } - } else { - this.childOption.push(source) - } - }, - - async setAddLayers(res) { - - if (res.serveType == "WMS") { - var resource = geoServerURl; - if (res.resource != null && res.resource != undefined) { - resource = res.resource; - } - var imageryLayers = window.Viewer.scene.imageryLayers; - let layerWMS = new Cesium.WebMapServiceImageryProvider({ - url: resource, - layers: res.url, - parameters: { - transparent: true, - format: "image/png", - srs: "EPSG:4490", - styles: "", - }, - tileWidth: 512, - tileHeight: 512, - }); - layerWMS.name = res.cnName; - //閫忔槑搴� - var tdtAnnoLayer = imageryLayers.addImageryProvider(layerWMS); - if (res.opacity) { - tdtAnnoLayer.alpha = parseInt(res.opacity) / 100; - } - var layer2 = new Image({ - name: res.cnName, - source: new ImageWMS({ - crossOrigin: "anonymous", - url: resource, - params: { - FORMAT: "image/png", - VERSION: "1.1.1", - LAYERS: res.url, - }, - }), - }); - if (res.opacity) { - layer2.setOpacity(parseInt(res.opacity) / 100); - } - window.map.addLayer(layer2); - } else if (res.serveType == "WFS") { - var url = - res.resource + - "?service=WFS&version=1.0.0&request=GetFeature&typeName=" + - res.url + - "&outputFormat=application%2Fjson"; - $.ajax({ - url: url, - cache: false, - async: true, - success: function (data) { - var datasource = Cesium.GeoJsonDataSource.load(data, { - stroke: Cesium.Color.YELLOW, - fill: Cesium.Color.YELLOW.withAlpha(0.1), - alpha: 0.1, - strokeWidth: 8, - clampToGround: true, //鏄惁璐村湴 - }); - datasource.then((data) => { - data.name = res.cnName; - window.Viewer.dataSources.add(data); - }); - }, - error: function (data) { - console.log("error"); - }, - }); - - var vectorLayer = new VectorLayer({ - name: res.cnName, - source: new VectorSource({ - url: url, - format: new GeoJSON(), - }), - }); - window.map.addLayer(vectorLayer); - } else if (res.serveType == "Tileset" || res.serveType == "3DML") { - var url; - if (res.url.indexOf("{host}") != -1) { - url = res.url.replace("{host}", iisHost); - } else { - url = modelUrl + "/" + res.url - } - - var tileset = Viewer.scene.primitives.add( + let tileset = Viewer.scene.primitives.add( new Cesium.Cesium3DTileset({ name: res.cnName, - url: url, //192.168.20.106,to4 - maximumScreenSpaceError: 64, // 鏈�澶у睆骞曠┖闂撮敊璇細16 - maximumMemoryUsage: 768, // 鏈�澶у唴瀛橈細512 - dynamicScreenSpaceError: true, // 鍑忓皯绂荤浉鏈鸿緝杩滅殑灞忓箷绌洪棿閿欒锛歠alse + url: url, skipLevelOfDetail: true, // 鍦ㄩ亶鍘嗘椂鍊欒烦杩囪鎯咃細false + baseScreenSpaceError: 1024, + maximumScreenSpaceError: 64, // 鏈�澶у睆骞曠┖闂撮敊璇細16锛屾暟鍊煎姞澶ц兘璁╂渶缁堟垚鍍忓彉妯$硦 + skipScreenSpaceErrorFactor: 16, + skipLevels: 1, + immediatelyLoadDesiredLevelOfDetail: false, + loadSiblings: true, // 鑷姩浠庝腑蹇冨紑濮嬭秴娓呭寲妯″瀷锛歠alse + cullWithChildrenBounds: true, // 浣跨敤瀛愰」杈圭晫浣撶Н鐨勫苟闆嗘潵鍓旈櫎鍥惧潡锛歵rue + cullRequestsWhileMoving: true, + cullRequestsWhileMovingMultiplier: 10, // 鍊艰秺灏忚兘澶熸洿蹇殑鍓旈櫎锛�60 + preloadWhenHidden: true, + preferLeaves: true, // 棰勮瀛愯妭鐐癸細false + maximumMemoryUsage: 768, // 鍐呭瓨鍒嗛厤鍙樺皬鏈夊埄浜庡唴瀛樺洖鏀讹紝鎻愬崌鎬ц兘浣撻獙 + progressiveResolutionHeightFraction: 0.5, // 鏁板�煎亸浜�0鑳藉璁╁垵濮嬪姞杞藉彉寰楁ā绯� + dynamicScreenSpaceErrorDensity: 0.5, // 鏁板�煎姞澶э紝鑳借鍛ㄨ竟鍔犺浇鍙樺揩 + dynamicScreenSpaceErrorFactor: 2, // 鍔ㄦ�佸睆骞曠┖闂磋宸殑绯绘暟 + dynamicScreenSpaceError: true, // 鍑忓皯绂荤浉鏈鸿緝杩滅殑灞忓箷绌洪棿閿欒锛歠alse锛屽叏灞忓姞杞藉畬涔嬪悗鎵嶆竻鏅板寲鎴垮眿 }) ); - tileset.readyPromise.then((tileset) => { tileset.id = res.cnName; tileset.layerId = res.id; tileset.pubid = res.pubid; - if (res.serveType != '3DML') { - // Cesium.Matrix4.equals(a,b)鍒ゆ柇涓や釜鍥涚淮鐭╅樀鏄惁鐩哥瓑 - // 鏁翠釜鏍硅妭鐐规ā鍨嬬煩闃碉紝璇ileSet=>涓栫晫鍧愭爣绯� - // 鍗曚綅鐭╅樀锛屽瑙掔嚎鍊间负1.0鐨�4*4鐭╅樀 + if (res.serveType != '3DML') { + // Cesium.Matrix4.equals(a,b) 鍒ゆ柇鐭╅樀鏄惁鐩哥瓑锛屾暣涓牴鑺傜偣妯″瀷鐭╅樀锛岃tileSet=>涓栫晫鍧愭爣绯伙紝鍗曚綅鐭╅樀瀵硅绾垮�间负1.0鐨�4*4鐭╅樀 if (!Cesium.Matrix4.equals(tileset.root.transform, Cesium.Matrix4.IDENTITY)) { - // 鑾峰彇妯″瀷鐨勪笘鐣屽潗鏍�(绗涘崱灏�) - // Cesium.Matrix4.getTranslation 閫氳繃浠垮皠鍙樻崲鐭╅樀鑾峰彇璇ileSet鐨勪笘鐣屽潗鏍� - const transformCenter = Cesium.Matrix4.getTranslation( - tileset.root.transform, - new Cesium.Cartesian3() - ); + // 鑾峰彇妯″瀷鐨勪笘鐣屽潗鏍�(绗涘崱灏�)锛孋esium.Matrix4.getTranslation 閫氳繃浠垮皠鍙樻崲鐭╅樀鑾峰彇璇ileSet鐨勪笘鐣屽潗鏍� + const transformCenter = Cesium.Matrix4.getTranslation(tileset.root.transform, new Cesium.Cartesian3()); // 灏嗙瑳鍗″皵鍧愭爣杞崲涓篧GS84缁忕含搴﹀潗鏍囷紙妯″瀷鐨勶級 - const transformCartographic = Cesium.Cartographic.fromCartesian( - transformCenter - ); + const transformCartographic = Cesium.Cartographic.fromCartesian(transformCenter); // 灏嗙瑳鍗″皵鍧愭爣杞崲涓篧GS84缁忕含搴﹀潗鏍囷紙鎴潰鐨勶級 - const boundingSphereCartographic = Cesium.Cartographic.fromCartesian( - tileset.boundingSphere.center - ); + const boundingSphereCartographic = Cesium.Cartographic.fromCartesian(tileset.boundingSphere.center); const height = boundingSphereCartographic.height - transformCartographic.height; // 浠庝竴涓狢artesian3瀵硅薄鐢熸垚Matrix4鍙樻崲鐭╅樀锛堣鍒囬潰鐨勶級 window.modelHeight = height; - } else window.modelHeight = 0; - this.getTilesetArgs(tileset, res); + } else { + window.modelHeight = 0; + } + this.setTilesetArgs(tileset, res); } }); - this.$store.state.setAlphaList.push({ - name: res.cnName, - alpha: 1 - }) - window.model = tileset - } else if (res.serveType == "TMS") { - var url = res.url; - if (res.url.indexOf("{host}") != -1) { - url = res.url.replace("{host}", iisHost); + } + }, + // 鍒囨崲TMS + setChangeTMS (layers, checked) { + let ids = this.getCheckNodesIds(), arr = []; + for (let j in layers) { + let layer = layers[j]; + if (ids.indexOf(layer.id) > -1) { + arr.push(layer); + continue; } + + for (let i = 0; i < window.Viewer.imageryLayers._layers.length; i++) { + if (window.Viewer.imageryLayers._layers[i].name == layer.cnName) { + window.Viewer.imageryLayers.remove(window.Viewer.imageryLayers._layers[i]); + break; + } + } + } + + if (arr.length) this.addTMSLayers(arr); + }, + // 娣诲姞TMS鍥惧眰 + addTMSLayers (layers) { + for (let i in layers) { + let res = layers[i]; + res.url = res.url.indexOf("{host}") > -1 ? res.url.replace("{host}", iisHost) : res.url; if (res.pubid) { - this.setQueryPubid(res); - } else { - - var layer = Viewer.imageryLayers.addImageryProvider( - new Cesium.UrlTemplateImageryProvider({ - url: url, - maximumLevel: 22, - }) - ); - layer.name = res.cnName; - this.setChangeWMS(); + this.setTMSLayerByPubid(res); + continue; } - } else if (res.serveType == "Mpt") { - - if (res.url.indexOf("{host}") != -1) { - res.url = res.url.replace("{host}", iisHost); - } - var url = res.url.split(';') - - var layer = sgworld.Creator.createImageryProvider(res.cnName, "wms", { - url: url[0], - layers: url[1] - }, "0", undefined, true, ""); - this.mptLayer.push(layer) - setTimeout(() => { - this.setChangeWMS(); - }, 500); - } - - }, - async getTilesetArgs(tileset, res) { - if (res.pubid > 0) { - const data = await comprehensive_selectPubById({ id: res.pubid }) - if (data.code != 200) { - - } else { - if (res.serveType != '3DML') { - this.reload(tileset, data.result.json) - } else { - this.tileSet(tileset, parseFloat(res.elev)) - } - - } - } else { - this.tileSet(tileset, parseFloat(res.elev)) - - } - - - - - }, - async setQueryPubid(res) { - const data = await comprehensive_selectPubById({ id: res.pubid }) - if (data.code != 200) { - - } else { - var url = data.result.url; - - if (res.url.indexOf("{host}") != -1) { - url = res.url.replace("{host}", iisHost); - } - var min = data.result.min; - var max = data.result.max; - var layer; - if (max > 0) { - layer = Viewer.imageryLayers.addImageryProvider( - new Cesium.UrlTemplateImageryProvider({ - url: url, - minimumLevel: min, - maximumLevel: max, - - }) - ); - } else { - layer = Viewer.imageryLayers.addImageryProvider( - new Cesium.UrlTemplateImageryProvider({ - url: url, - minimumLevel: min, - }) - ); - } - + let layer = Viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({ + url: res.url, + maximumLevel: 22, + })); + layer.id = res.id; layer.name = res.cnName; - - if (data.result.geom) { - // var wkt = this.$wkt.parse(data.result.geom); - // Viewer.camera.flyTo({ - // destination: Cesium.Cartesian3.fromDegrees(wkt.coordinates[1], wkt.coordinates[0], 2000), - // }); - } - this.setChangeWMS(); } }, - reload(tileset, res) { - var vm = JSON.parse(res) - var pos = Cesium.Cartesian3.fromDegrees(vm.lon, vm.lat, vm.height); - var converter = Cesium.Transforms.eastNorthUpToFixedFrame; - var hpr = new Cesium.HeadingPitchRoll(Cesium.Math.toRadians(vm.yaw), 0, 0); - var matrix = Cesium.Transforms.headingPitchRollToFixedFrame(pos, hpr, Cesium.Ellipsoid.WGS84, converter); - tileset._root.transform = matrix; - // Viewer.flyTo(tileset); + // 鍒囨崲Mpt + setChangeMpt (layers, checked) { + let ids = this.getCheckNodesIds(), arr = []; + for (let j in layers) { + let layer = layers[j]; + if (ids.indexOf(layer.id) != -1) { + arr.push(layer); + continue; + } + + for (let i in this.mptLayer) { + if (this.mptLayer[i].treeobj.name == layer.cnName) { + this.mptLayer[i].deleteObject(); + this.mptLayer.splice(i, 1); + } + } + } + + if (arr.length) this.addMptLayers(arr); }, - tileSet(tileset, height) { + // 娣诲姞Mpt鍥惧眰 + addMptLayers (layers) { + for (let i in layers) { + let res = layers[i]; + if (res.url.indexOf("{host}") > -1) res.url = res.url.replace("{host}", iisHost); + let urls = res.url.split(';') + + let layer = sgworld.Creator.createImageryProvider(res.cnName, "wms", { + url: urls[0], + layers: urls[1] + }, "0", undefined, true, ""); + this.mptLayer.push(layer); + } + }, + // 鍒囨崲DEM + setChangeDEM (layers, checked) { + let ids = this.getCheckNodesIds(), arr = [], isDel = false, useSG = false; + for (let i in layers) { + let layer = layers[i]; + if (ids.indexOf(layer.id) != -1) { + arr.push(layer.url); + continue; + } + + if (window.Viewer.terrainProvider._layers[0].resource._url == layer.url) isDel = true; // 鍒犻櫎DEM + } + + if (!arr.length && isDel) useSG = true; // demLayer + if (arr.length) this.addDEMLayers(arr[0], useSG); + }, + // 娣诲姞DEM鍥惧眰 + addDEMLayer (url, useSG) { + if (useSG) { + let option = { + url: window.sceneConfig.SGUrl, + layerName: window.sceneConfig.mptName, + requestVertexNormals: true + }; + window.terrainLayer = sgworld.Creator.sfsterrainprovider("", option, "", true, ""); + } else { + window.terrainLayer = new Cesium.CesiumTerrainProvider({ + url: url, + requestVertexNormals: true + }); + } + Viewer.terrainProvider = terrainLayer; + }, + // 璁剧疆Tileset鍙傛暟 + async setTilesetArgs (tileset, res) { + if (res.serveType == '3DML' || !res.pubid) { + this.setTilesetHeigth(tileset, parseFloat(res.elev)); + return; + } + + const data = await comprehensive_selectPubById({ id: res.pubid }) + if (data.code == 200) this.setTilesetCoord(tileset, data.result.json); + }, + // 璁剧疆Tileset楂樺害 + setTilesetHeigth (tileset, height) { //3dtile妯″瀷鐨勮竟鐣岀悆浣� - var boundingSphere = tileset.boundingSphere; + let boundingSphere = tileset.boundingSphere; //杩崱灏旂┖闂寸洿瑙掑潗鏍�=>鍦扮悊鍧愭爣锛堝姬搴﹀埗锛� - var cartographic_original = Cesium.Cartographic.fromCartesian(boundingSphere.center); + let cartographic_original = Cesium.Cartographic.fromCartesian(boundingSphere.center); //鍦扮悊鍧愭爣锛堝姬搴﹀埗锛�=>杩崱灏旂┖闂寸洿瑙掑潗鏍� - var Cartesian3_original = Cesium.Cartesian3.fromRadians(cartographic_original.longitude, cartographic_original.latitude, cartographic_original.height); - var Cartesian3_offset = Cesium.Cartesian3.fromRadians(cartographic_original.longitude, cartographic_original.latitude, height); + let Cartesian3_original = Cesium.Cartesian3.fromRadians(cartographic_original.longitude, cartographic_original.latitude, cartographic_original.height); + let Cartesian3_offset = Cesium.Cartesian3.fromRadians(cartographic_original.longitude, cartographic_original.latitude, height); //鑾峰緱鍦伴潰鍜宱ffset鐨勮浆鎹� - var translation = Cesium.Cartesian3.subtract(Cartesian3_offset, Cartesian3_original, new Cesium.Cartesian3()); + let translation = Cesium.Cartesian3.subtract(Cartesian3_offset, Cartesian3_original, new Cesium.Cartesian3()); //淇敼妯″瀷鐭╅樀 tileset.modelMatrix = Cesium.Matrix4.fromTranslation(translation); // Viewer.flyTo(tileset); }, - setTreeData(source) { - let cloneData = JSON.parse(JSON.stringify(source)); // 瀵规簮鏁版嵁娣卞害鍏嬮殕 - return cloneData.filter((father) => { - // 寰幆鎵�鏈夐」 - let branchArr = cloneData.filter((child) => father.id == child.pid); // 瀵规瘮ID锛屽垎鍒笂涓嬬骇鑿滃崟锛屽苟杩斿洖鏁版嵁 - branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊� - // 灞炰簬鍚屼竴瀵硅薄闂锛屼緥濡傦細浠� a=b銆乧=1 锛岀劧鍚庡啀浠� b.c=c 锛� 閭d箞 a.c=b.c=c=1 锛涘悓鐞嗭紝鍚庣画浠� c.d=2 ,閭d箞 a.c.d 涔熸槸=2锛� - // 鐢辨寰幆澶氭鍚庯紝灏辫兘褰㈡垚鐩稿簲鐨勬爲褰㈡暟鎹粨鏋� - return father.pid == 0; // 杩斿洖涓�绾ц彍鍗� - }); + // 璁剧疆Tileset鍧愭爣 + setTilesetCoord (tileset, json) { + let vm = JSON.parse(json); + let pos = Cesium.Cartesian3.fromDegrees(vm.lon, vm.lat, vm.height); + let converter = Cesium.Transforms.eastNorthUpToFixedFrame; + let hpr = new Cesium.HeadingPitchRoll(Cesium.Math.toRadians(vm.yaw), 0, 0); + let matrix = Cesium.Transforms.headingPitchRollToFixedFrame(pos, hpr, Cesium.Ellipsoid.WGS84, converter); + tileset._root.transform = matrix; + // Viewer.flyTo(tileset); }, - async layersStart() { - const data = await perms_selectLayers(); - if (data.code != 200) { - return this.$message.error("鍥惧眰鍒楄〃鏌ヨ澶辫触"); - } - var std = data.result; - var that = this; - var checkKey = []; - let checkedLayers = []; - var val = std.filter((str) => { - if (str.type == 1) { - return str; - } - if (str.url != null && str.type == 2) { - if (str.isShow == 1) { - checkKey.push(str.id); - // that.setAddLayers(str); - if (str.serveType == "WMS" && str.url) { - checkedLayers.push(str); - } - } - return str; - } - }); + // 鏍规嵁Pubid璁剧疆TMS鍥惧眰 + async setTMSLayerByPubid (res) { + const data = await comprehensive_selectPubById({ id: res.pubid }); + if (!data || data.code != 200) return; - //瀛樺偍閫変腑鍥惧眰 - sessionStorage.setItem("checkedLayers", JSON.stringify(checkedLayers)); - var res = this.setTreeData(val); + let provider = data.result.max > 0 ? + new Cesium.UrlTemplateImageryProvider({ + url: res.url, + minimumLevel: data.result.min, + maximumLevel: data.result.max + }) : + new Cesium.UrlTemplateImageryProvider({ + url: res.url, + minimumLevel: data.result.min + }); - // for (var i in res) { - // res[i].children = res[i].children.filter((val) => { - // if (val.children != null) { - // return val; - // } + let layer = Viewer.imageryLayers.addImageryProvider(provider); + layer.name = res.cnName; + + // if (data.result.geom) { + // let wkt = this.$wkt.parse(data.result.geom); + // Viewer.camera.flyTo({ + // destination: Cesium.Cartesian3.fromDegrees(wkt.coordinates[1], wkt.coordinates[0], 2000) // }); // } - this.treeData = res; - this.$refs.tree.setCheckedKeys(checkKey); }, - async treelayersStart() { - const data = await perms_selectLayers(); - if (data.code != 200) { - return this.$message.error("鍥惧眰鍒楄〃鏌ヨ澶辫触"); + // 鍒囨崲椤圭洰 + prjChanged (code) { + this.$store.state.pigCode = code; + if (code) { + this.isBusy = true; + let checkedLayers = this.getCheckedLayersByCode(code); + + let checkedKeys = []; + for (let i in checkedLayers) { + checkedKeys.push(checkedLayers[i].id); + } + + this.$refs.tree.setCheckedKeys(checkedKeys); + sessionStorage.setItem("checkedLayers", JSON.stringify(checkedLayers)); + this.isBusy = false; } - var std = []; - var layer_list = []; - var layer_groups = []; - for (var i in data.result) { - if (data.result[i].type == 1) { - layer_groups.push({ - id: data.result[i].id, - label: data.result[i].cnName, - type: data.result[i].type, - isEdit: false, - children: [], + + for (let i = 0, c = this.treeData.length; i < c; i++) { + this.handleCheckChange(this.treeData[i], true); + } + }, + // 鏍规嵁椤圭洰缂栫爜鑾峰彇閫変腑鍥惧眰 + getCheckedLayersByCode (code) { + let layers = []; + for (let i = 0, c = this.treeData.length; i < c; i++) { + this.getCheckedChildLayersByCode(this.treeData[i], code, layers, false); + } + + return layers; + }, + // 鏍规嵁椤圭洰缂栫爜鑾峰彇閫変腑瀛愬浘灞� + getCheckedChildLayersByCode (data, code, layers, isPrj) { + if (data.children && data.children.length) { + for (let i = 0, c = data.children.length; i < c; i++) { + let layer = data.children[i]; + if (layer.children && layer.children.length) { + let flag = layer.type == 1 && layer.isProject && layer.enName == code; + this.getCheckedChildLayersByCode(layer, code, layers, flag); + continue; + } + + if (layer.type == 2 && (layer.isProject || isPrj)) { + layers.push(layer); + } + } + return; + } + + if (data.type == 2 && (data.isProject || isPrj)) { + layers.push(data); + } + }, + // 娣诲姞WFS鍥惧眰 * + addWFSLayers (res) { + let url = + res.resource + + "?service=WFS&version=1.0.0&request=GetFeature&typeName=" + + res.url + + "&outputFormat=application%2Fjson"; + $.ajax({ + url: url, + cache: false, + async: true, + success: function (data) { + let datasource = Cesium.GeoJsonDataSource.load(data, { + stroke: Cesium.Color.YELLOW, + fill: Cesium.Color.YELLOW.withAlpha(0.1), + alpha: 0.1, + strokeWidth: 8, + clampToGround: true, //鏄惁璐村湴 }); - } else if (data.result[i].type == 2) { - if (data.result[i].url != null) { - var layer_entity = { - id: data.result[i].id, - pid: data.result[i].pid, - label: data.result[i].cnName, - resource: data.result[i].url, - type: data.result[i].type, - isEdit: false, - }; - layer_list.push(layer_entity); - } - } - } - for (var i in layer_list) { - for (var j in layer_groups) { - if (layer_list[i].pid === layer_groups[j].id) { - layer_groups[j].children.push(layer_list[i]); - } - } - } - layer_groups = layer_groups.filter((res) => { - if (res.children && res.children.length != 0) { - return res; - } + datasource.then((data) => { + data.name = res.cnName; + window.Viewer.dataSources.add(data); + }); + }, + error: function (data) { + console.log("error"); + }, }); - this.treeData = layer_groups; - - for (var i in data.result) { - if (data.result[i].type == 2 && data.result[i].url != null) { - for (var j = 0; j < window.Viewer.imageryLayers._layers.length; j++) { - var val_id = window.Viewer.imageryLayers._layers[j]; - if (val_id.show == true) { - if (val_id.imageryProvider.name == data.result[i].cnName) { - std.push(data.result[i].id); - } - } - } - } - } - this.$refs.tree.setCheckedKeys(std); - }, - // 鏌ヨ - filterNode(value, data) { - - if (!value) return true; - return data.cnName.indexOf(value) !== -1; - }, - - async setproChange(res) { - if (res) { - this.setCheeckedLayer = this.$refs.tree.getCheckedKeys(); - - this.$store.state.pigCode = res; - var st_code = this.optionts.filter(rs => { - if (rs.code == res) { - return rs - } - }) - - var val = this.$store.state.oldTree.filter(rs => { - if (rs.enName == st_code[0].code) { - return rs - } - }) - this.removeAllLayer(); - var obj = { - dirid: res, - pageIndex: 1, - pageSize: 10, - } - - const data = await project_selectByDirid(obj); - if (data.code != 200) { - this.$message.error("鍒楄〃鑾峰彇澶辫触"); - return; - } - - if (data.result[0]) { - var geom = data.result[0].geom - if (geom) { - var wkt = this.$wkt.parse(geom) - Viewer.camera.flyTo({ - destination: Cesium.Cartesian3.fromDegrees(wkt.coordinates[0].toFixed(6), wkt.coordinates[1].toFixed(6), 5000), - }); - } - - } - this.cannelTerrainLayer(); - this.setTerrainMptLayer(); - //娓呯┖鍥惧眰鏍戦�変腑鐘舵�� - this.$refs.tree.setCheckedKeys([]); - - - if (val.length > 0) { - - if (val[0].type == 1 && val[0].isProject == 1) {//椤圭洰鍒嗙被 - - var std_check = []; - for (var i in val) { - var std_val = this.getNewTree([this.$refs.tree.getNode(val[i].id).data], []) - for (var j in std_val) { - std_check.push(std_val[j]) - } - } - - - var value = this.$store.state.isProjectLayer; - for (var i in value) { - - std_check.push(value[i]) - } - this.setProjectLayer(std_check); - } else { - this.setChangeProLayer(); - } - } else { - this.setChangeProLayer(); - } - } else { - this.removeAllLayer(); - this.$store.state.pigCode = null; - this.$refs.tree.setCheckedKeys(this.setCheeckedLayer); - var std = []; - for (var i in this.setCheeckedLayer) { - std.push(this.$refs.tree.getNode(this.setCheeckedLayer[i]).data) - } - this.setProjectLayer(std); - } - }, - removeAllLayer() { - for (var j in Viewer.scene.primitives._primitives) { - Viewer.scene.primitives.remove(Viewer.scene.primitives._primitives[j]) - } - for (var i in window.Viewer.dataSources._dataSources) { - window.Viewer.dataSources.remove( - window.Viewer.dataSources._dataSources[i] - ); - } - for (var i = 0; i < window.Viewer.imageryLayers._layers.length; i++) { - var val_id = window.Viewer.imageryLayers._layers[i].id; - if (val_id == 'TMS') { - window.Viewer.imageryLayers.remove( - window.Viewer.imageryLayers._layers[i] - ); - } - } - for (var i in this.mptLayer) { - this.mptLayer[i].deleteObject(); - this.mptLayer.splice(i, 1) - } - this.mptLayer = []; - }, - setProjectLayer(res) { - var layerid = []; - for (var i in res) { - layerid.push(res[i].id) - } - this.$refs.tree.setCheckedKeys(layerid); - // var value = this.$refs.tree.getCheckedNodes(); - // this.$bus.$emit("showMenuLayer", value); - - var listWMS = []; - var listWFS = []; - var listTileset = []; - var listTMS = []; - var listMpt = []; - for (var i in res) { - if (res[i].type == 2) { - switch (res[i].serveType) { - case 'WMS': - listWMS.push(res[i]) - break; - case 'WFS': - listWFS.push(res[i]) - break; - case '3DML': - case 'Tileset': - listTileset.push(res[i]) - break; - case 'Mpt': - listMpt.push(res[i]) - break; - case 'TMS': - listTMS.push(res[i]) - break; - - } - } - } - // this.setChangeProLayer(); - this.setChangeWMS(listWMS, true); - this.setChangeWFS(listWFS, true); - this.setChangeTileset(listTileset, true); - this.setChangeTMS(listTMS, true); - this.setChangeMpt(listMpt, true); - }, - getNewTree(obj, result) { - for (const i in obj) { - console.log(obj[i].cnName) - result.push(obj[i]) - if (obj[i].children && obj[i].children.length > 0) { - this.getNewTree(obj[i].children, result) - } - } - return result - }, - cannelTerrainLayer() { - //娓呯┖鍦板舰 - if (window.terrainMptLayer) { - window.terrainMptLayer.deleteObject(); - window.terrainMptLayer = null; - } - if (window.terrainDemLayer) { - Viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider(); - window.terrainDemLayer = null; - } - }, - setTerrainMptLayer() { - // //榛樿鍦板舰MPT - // var option = { - // url: window.sceneConfig.SGUrl, - // layerName: window.sceneConfig.mptName, - // requestVertexNormals: true, - // }; - // window.terrainMptLayer = sgworld.Creator.sfsterrainprovider("", option, "", true, ""); - window.terrainDemLayer = new Cesium.CesiumTerrainProvider({ - // url: LFData + '/3d/terrain/dem20230321' - url: demLayer + let vectorLayer = new VectorLayer({ + name: res.cnName, + source: new VectorSource({ + url: url, + format: new GeoJSON(), + }), }); - Viewer.terrainProvider = window.terrainDemLayer - }, - setChangeProLayer() { - var value = this.$store.state.isProjectLayer; - if (value.length != 0) { - - var std = []; - for (var i in value) { - std.push(value[i].id) - } - this.$refs.tree.setCheckedKeys(std); - this.$bus.$emit("showMenuLayer", value); - } - - - }, - - async getMenuProject() { - const data = await project_selectDirAll(); - if (data.code != 200) { - return - } - this.optionts = data.result; - }, - }, - watch: { - filterText(val) { - this.$refs.tree.filter(val); - }, - }, - mounted() { - this.getMenuProject() - this.$bus.$on("treeDataCopy", (res) => { - this.$store.state.treeData = this.treeData; - this.$store.state.checkedKeys = this.$refs.tree.getCheckedKeys(); - }); - - if (this.$store.state.showAllLayers == true) { - this.layersStart(); - this.$store.state.showAllLayers = false; - } else { - this.treeData = this.$store.state.treeData; - this.$refs.tree.setCheckedKeys(this.$store.state.checkedKeys); + window.map.addLayer(vectorLayer); } }, }; @@ -1517,7 +717,6 @@ .tree-container /deep/ .el-tree-node { position: relative; padding-left: 10px; - // text-indent: 16px; } .tree-container /deep/ .el-tree-node__children { @@ -1641,9 +840,11 @@ position: absolute; right: auto; } + /deep/.el-table__placeholder { padding-left: 8px; } + /deep/.el-card__body { padding: 10px !important; > div { @@ -1654,15 +855,15 @@ } } } + /deep/ .el-form .el-form-item { padding-right: 0px !important; } + /deep/ .el-form-item { margin-bottom: 10px !important; } -/*.lalala {*/ -/*position: relative;*/ -/*}*/ + .text { font-size: 14px; } -- Gitblit v1.9.3