|
|
@ -17,7 +17,7 @@ |
|
|
></el-button> |
|
|
></el-button> |
|
|
</el-input> --> |
|
|
</el-input> --> |
|
|
<div class="tool-btn"> |
|
|
<div class="tool-btn"> |
|
|
<div class="btn cursor-pointer" @click="showTreeBox = !showTreeBox"> |
|
|
<div class="btn cursor-pointer" @click="handleChangeTreeShow"> |
|
|
<img class="icon" src="../../../assets/icons/layer.png" alt="" /> |
|
|
<img class="icon" src="../../../assets/icons/layer.png" alt="" /> |
|
|
图层管理 |
|
|
图层管理 |
|
|
</div> |
|
|
</div> |
|
|
@ -36,7 +36,7 @@ |
|
|
:data="treeData" |
|
|
:data="treeData" |
|
|
default-expand-all |
|
|
default-expand-all |
|
|
node-key="id" |
|
|
node-key="id" |
|
|
ref="tree" |
|
|
ref="treeRef" |
|
|
show-checkbox |
|
|
show-checkbox |
|
|
highlight-current |
|
|
highlight-current |
|
|
:props="defaultProps" |
|
|
:props="defaultProps" |
|
|
@ -157,17 +157,21 @@ export default { |
|
|
}); |
|
|
}); |
|
|
let id = res1.records?.[0]?.id; |
|
|
let id = res1.records?.[0]?.id; |
|
|
let res2 = await getLayerData(id); |
|
|
let res2 = await getLayerData(id); |
|
|
this.treeData = res2.data.children; |
|
|
this.treeData = res2.data?.children || []; |
|
|
getSceneConfig(id).then((res) => { |
|
|
let res3 = await getSceneConfig(id); |
|
|
console.log("配置 >>>>> ", res); |
|
|
this.configData = res3.data || null; |
|
|
this.configData = res.data || null; |
|
|
if (res3.data?.layerId && typeof res3.data.layerId === "string") { |
|
|
if (res.data?.layerId) { |
|
|
this.checkList = JSON.parse(res3.data?.layerId); |
|
|
this.checkList = JSON.parse(res.data?.layerId); |
|
|
this.treeData.forEach((item) => { |
|
|
this.layerList = this.treeData.filter((item) => { |
|
|
if (item.layers) { |
|
|
return this.checkList.includes(item.id); |
|
|
let arr = item.layers?.filter((item) => |
|
|
}); |
|
|
this.checkList.includes(item.id) |
|
|
} |
|
|
); |
|
|
}); |
|
|
this.layerList.push(...arr); |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
this.initMap(); |
|
|
}, |
|
|
}, |
|
|
handleChangeMode() { |
|
|
handleChangeMode() { |
|
|
this.mapSceneType = this.mapSceneType === 3 ? 2 : 3; |
|
|
this.mapSceneType = this.mapSceneType === 3 ? 2 : 3; |
|
|
@ -182,10 +186,15 @@ export default { |
|
|
); |
|
|
); |
|
|
}, |
|
|
}, |
|
|
handleGetResInfo(data) { |
|
|
handleGetResInfo(data) { |
|
|
console.log("handleGetResInfo >>>>> ", data); |
|
|
|
|
|
this.resInfoData = data; |
|
|
this.resInfoData = data; |
|
|
}, |
|
|
}, |
|
|
initMap() { |
|
|
initMap() { |
|
|
|
|
|
if (!sycim) { |
|
|
|
|
|
setTimeout(() => { |
|
|
|
|
|
this.initMap(); |
|
|
|
|
|
}, 1000); |
|
|
|
|
|
return; |
|
|
|
|
|
} |
|
|
viewer = new sycim.Viewer("reservoir-map-container"); |
|
|
viewer = new sycim.Viewer("reservoir-map-container"); |
|
|
window.viewer = viewer; |
|
|
window.viewer = viewer; |
|
|
let baseLayer = sycim.ImageryLayerFactory.createImageryLayer( |
|
|
let baseLayer = sycim.ImageryLayerFactory.createImageryLayer( |
|
|
@ -207,32 +216,50 @@ export default { |
|
|
depthTestAgainstTerrain: true, |
|
|
depthTestAgainstTerrain: true, |
|
|
}, |
|
|
}, |
|
|
}); |
|
|
}); |
|
|
// 三维模型才需要 |
|
|
|
|
|
// viewer.on( |
|
|
|
|
|
// sycim.SceneEventType.CAMERA_CHANGED, |
|
|
|
|
|
// () => { |
|
|
|
|
|
// viewer.setOptions({ |
|
|
|
|
|
// globe: { |
|
|
|
|
|
// depthTestAgainstTerrain: viewer.cameraPosition.alt > 10000 ? false : true |
|
|
|
|
|
// } |
|
|
|
|
|
// }); |
|
|
|
|
|
// }, |
|
|
|
|
|
// viewer |
|
|
|
|
|
// ); |
|
|
|
|
|
setTimeout(() => { |
|
|
setTimeout(() => { |
|
|
viewer.scene.camera.setView({ |
|
|
if (this.layerList.length) { |
|
|
destination: new Cesium.Cartesian3.fromDegrees(113.27, 23.13, 600000), |
|
|
this.layerList.forEach((item) => { |
|
|
// orientation: { |
|
|
addLayer(item); |
|
|
// heading: 0, |
|
|
}); |
|
|
// pitch: -90, |
|
|
} |
|
|
// roll: 0, |
|
|
if (this.configData) { |
|
|
// }, |
|
|
let pos = JSON.parse(this.configData.cameraPosture); |
|
|
duration: 2, |
|
|
viewer.scene.camera.setView({ |
|
|
}); |
|
|
destination: new Cesium.Cartesian3.fromDegrees( |
|
|
|
|
|
pos.lng, |
|
|
|
|
|
pos.lat, |
|
|
|
|
|
pos.alt |
|
|
|
|
|
), |
|
|
|
|
|
|
|
|
|
|
|
duration: 2, |
|
|
|
|
|
}); |
|
|
|
|
|
} else { |
|
|
|
|
|
viewer.scene.camera.setView({ |
|
|
|
|
|
destination: new Cesium.Cartesian3.fromDegrees( |
|
|
|
|
|
113.27, |
|
|
|
|
|
23.13, |
|
|
|
|
|
600000 |
|
|
|
|
|
), |
|
|
|
|
|
// orientation: { |
|
|
|
|
|
// heading: 0, |
|
|
|
|
|
// pitch: -90, |
|
|
|
|
|
// roll: 0, |
|
|
|
|
|
// }, |
|
|
|
|
|
duration: 2, |
|
|
|
|
|
}); |
|
|
|
|
|
} |
|
|
this.viewerAddEventListener(); |
|
|
this.viewerAddEventListener(); |
|
|
}, 300); |
|
|
}, 300); |
|
|
}, |
|
|
}, |
|
|
|
|
|
handleChangeTreeShow() { |
|
|
|
|
|
this.showTreeBox = !this.showTreeBox; |
|
|
|
|
|
if (this.showTreeBox) { |
|
|
|
|
|
this.$nextTick(() => { |
|
|
|
|
|
this.$refs.treeRef?.setCheckedKeys(this.checkList); |
|
|
|
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
handleAddHtmlLayer(position, data) { |
|
|
handleAddHtmlLayer(position, data) { |
|
|
console.log("添加DivIcon >>>>> ", position, data); |
|
|
console.log("添加DivIcon >>>>> ", position, data); |
|
|
htmlLayer?.clear(); |
|
|
htmlLayer?.clear(); |
|
|
@ -316,13 +343,10 @@ export default { |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
handleCheckTree(data, checked) { |
|
|
handleCheckTree(data, checked) { |
|
|
console.log("data, checked >>>>> ", data, checked); |
|
|
|
|
|
console.log("getCheckedNodes >>>>> ", this.$refs.tree.getCheckedNodes()); |
|
|
|
|
|
if (data.pid === "root" || data.layers) return; |
|
|
if (data.pid === "root" || data.layers) return; |
|
|
if (checked) { |
|
|
if (checked) { |
|
|
this.checkList = [...this.checkList, data.id]; |
|
|
this.checkList = [...this.checkList, data.id]; |
|
|
const list = this.$refs.tree.getCheckedNodes(); |
|
|
const list = this.$refs.treeRef?.getCheckedNodes(); |
|
|
console.log("checkList >>>>> ", this.checkList); |
|
|
|
|
|
addLayer(data); |
|
|
addLayer(data); |
|
|
this.legendList = getSelectedLayersLegend(list); |
|
|
this.legendList = getSelectedLayersLegend(list); |
|
|
this.layerList.push(data); |
|
|
this.layerList.push(data); |
|
|
@ -334,7 +358,6 @@ export default { |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
created() { |
|
|
created() { |
|
|
this.initData(); |
|
|
|
|
|
emitter.on("openDialog", this.openDialog); |
|
|
emitter.on("openDialog", this.openDialog); |
|
|
// devRun(() => { |
|
|
// devRun(() => { |
|
|
// setTimeout(() => { |
|
|
// setTimeout(() => { |
|
|
@ -346,9 +369,7 @@ export default { |
|
|
// }); |
|
|
// }); |
|
|
}, |
|
|
}, |
|
|
mounted() { |
|
|
mounted() { |
|
|
setTimeout(() => { |
|
|
this.initData(); |
|
|
this.initMap(); |
|
|
|
|
|
}, 50); |
|
|
|
|
|
}, |
|
|
}, |
|
|
beforeDestroy() { |
|
|
beforeDestroy() { |
|
|
window.viewer = null; |
|
|
window.viewer = null; |
|
|
|
hejunjie
1 month ago