| | |
| | | <template> |
| | | <div class="layer-tree"> |
| | | <el-tree |
| | | ref="treeRef" |
| | | style="max-width: 600px" |
| | | show-checkbox |
| | | node-key="label" |
| | | :default-checked-keys="defaultSelectedKeys" |
| | | @check-change="handleCheckChange" |
| | | :data="treeData" |
| | | /> |
| | | <el-tree ref="treeRef" style="max-width: 600px" show-checkbox node-key="label" :default-checked-keys="defaultSelectedKeys" @check-change="handleCheckChange" :data="treeData" /> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | const treeRef = ref(null); |
| | | const treeMap = new Map(); |
| | | const defaultSelectedKeys = ref(["模型数据", "影像数据", "地形数据"]); |
| | | function handleCheckChange(data, checked, indeterminate) { |
| | | function handleCheckChange (data, checked, indeterminate) { |
| | | const label = data.label; |
| | | const list = treeMap.get(label); |
| | | if (list) { |
| | |
| | | break; |
| | | } |
| | | } |
| | | function initMap() { |
| | | function initMap () { |
| | | // let modelPromise = addTileset( |
| | | // `http://106.120.22.26:9103/gisserver/c3dserver/sunhugou3d/tileset.json` |
| | | // ) |
| | |
| | | // sourceType: "tms", |
| | | // url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom", |
| | | // }) |
| | | // let TerrainLayer = earthCtrl.factory.createTerrainLayer({ |
| | | // sourceType: "ctb", |
| | | // url: "http://106.120.22.26:9103/gisserver/ctsserver/sungugoudem", |
| | | // }); |
| | | let TerrainLayer = earthCtrl.factory.createTerrainLayer({ |
| | | sourceType: "ctb", |
| | | url: "https://tiles1.geovisearth.com/base/v1/terrain?token=486dac3bec56d7d7c2a581c150be2bd937462f1e8f3bc9c78b5658b396122405", |
| | | requestVertexNormals: true, |
| | | }); |
| | | url: "http://106.120.22.26:9103/gisserver/ctsserver/llmbdem", |
| | | }) |
| | | // let TerrainLayer = earthCtrl.factory.createTerrainLayer({ |
| | | // sourceType: "ctb", |
| | | // url: "https://tiles1.geovisearth.com/base/v1/terrain?token=486dac3bec56d7d7c2a581c150be2bd937462f1e8f3bc9c78b5658b396122405", |
| | | // requestVertexNormals: true, |
| | | // }); |
| | | // treeMap.set("影像数据", ImageryLayer) |
| | | treeMap.set("地形数据", TerrainLayer); |
| | | treeMap.set("地形数据", TerrainLayer) |
| | | } |
| | | |
| | | const devicetList = ref([ |
| | |
| | | }, |
| | | ]); |
| | | |
| | | function initDevicePoint() { |
| | | function initDevicePoint () { |
| | | let list = []; |
| | | |
| | | devicetList.value.forEach((item) => { |
| | |
| | | }, |
| | | ]); |
| | | |
| | | function initDistrictPoint() { |
| | | function initDistrictPoint () { |
| | | let list = []; |
| | | districtList.value.forEach((item) => { |
| | | item.showBillboard = true; |
| | |
| | | |
| | | let divPointList = []; |
| | | |
| | | function initDuanmianPoint() { |
| | | function initDuanmianPoint () { |
| | | getDuanMainData().then((res) => { |
| | | const duanmianList = res.data; |
| | | const list = []; |
| | |
| | | }); |
| | | } |
| | | |
| | | function addTetrahedron(visible) { |
| | | function addTetrahedron (visible) { |
| | | const emergencyAreaList = []; |
| | | |
| | | loadAreaPolygon("/json/emergency_area.geojson", true).then((entities) => { |
| | |
| | | }); |
| | | treeMap.set("避险点", emergencyAreaList); |
| | | } |
| | | function toggleLayerVisible(name, checked) { |
| | | function toggleLayerVisible (name, checked) { |
| | | const entityList = treeMap.get(name); |
| | | if (Array.isArray(entityList) && entityList.length > 0) { |
| | | entityList.forEach((entity) => { |
| | |
| | | treeMap.set(name, entityList); |
| | | } |
| | | |
| | | function getData() { |
| | | function getData () { |
| | | initDevicePoint(); |
| | | initDistrictPoint(); |
| | | initDuanmianPoint(); |