| | |
| | | </div> |
| | | <!-- 地图 --> |
| | | <div class="mapContainer"> |
| | | <!-- <div class="tool-tip warning" v-show="isShowWaringTip"> |
| | | <span class="icon"> |
| | | <el-icon><WarningFilled /></el-icon> |
| | | </span> |
| | | <span>测区不支持交叉面,无法生成航线</span> |
| | | </div> --> |
| | | <div class="tool-tip" v-if="layerParams.addNest">点击地图生成测绘区域</div> |
| | | <div id="layMap" class="ztzf-cesium"></div> |
| | | <leftList |
| | |
| | | editFolderData: null, |
| | | editingIsProhibited: false, //禁止编辑 |
| | | isDetailShow: false, |
| | | isSingleLocating:false |
| | | }); |
| | | |
| | | const handleClick = tab => { |
| | |
| | | const handleCoverDataUpdate = data => { |
| | | selectDataList.value = data; |
| | | if (selectDataList.value.length > 0) { |
| | | |
| | | loadDataToMap(selectDataList.value); |
| | | } else { |
| | | viewer.entities.removeAll(); |
| | |
| | | zIndex: 99, |
| | | }); |
| | | }); |
| | | focusOnAllFeatures(); |
| | | |
| | | |
| | | if (!layerParams.value.isSingleLocating) { |
| | | focusOnAllFeatures(); |
| | | } |
| | | viewInstance.value?.addLeftClickEvent(null, handleFenceClick); |
| | | }; |
| | | const focusOnAllFeatures = () => { |
| | |
| | | flyVisual({ |
| | | positionsData, |
| | | viewer, |
| | | multiple: 13, // 缩放倍数 |
| | | multiple:activeName.value == '国土空间规划' ? 13 :4, // 缩放倍数 |
| | | pitch: -90 |
| | | }); |
| | | }; |
| | |
| | | const handleFenceClick = movement => { |
| | | if (!viewer) return; |
| | | layerParams.value.editDetailData = null; |
| | | const pickedObject = viewer.scene.pick(movement.position); |
| | | if (Cesium.defined(pickedObject) && pickedObject.id?.customType === 'fence_polygon') { |
| | | const selectedEntity = pickedObject.id; |
| | | const selectedData = selectedEntity.customInfo; |
| | | // viewer.entities.values.forEach(entity => { |
| | | |
| | | if(activeName.value !== '国土空间规划') { |
| | | const pickedObjects = viewer.scene.drillPick(movement.position, 10); |
| | | // 遍历所有被点击的实体,找到围栏类型(customType: 'fence_polygon') |
| | | let selectedEntity = null; |
| | | for (let i = 0; i < pickedObjects.length; i++) { |
| | | const pick = pickedObjects[i]; |
| | | if (Cesium.defined(pick.id) && pick.id?.customType === 'fence_polygon') { |
| | | selectedEntity = pick.id; |
| | | break; |
| | | } |
| | | } |
| | | // viewer.entities.values.forEach(entity => { |
| | | // if (entity.customType === 'fence_polygon') { |
| | | // entity.polygon.material = entity === selectedEntity |
| | | // ? Cesium.Color.RED.withAlpha(0.5) |
| | | // : Cesium.Color.YELLOW.withAlpha(0.5); |
| | | // } |
| | | // }); |
| | | if (selectedEntity) { |
| | | const selectedData = selectedEntity.customInfo; |
| | | if (activeName.value !== '国土空间规划') { |
| | | layerParams.value.editNest = true; // 显示右侧编辑组件 |
| | | layerParams.value.decideWhetherToAddOrEdit = 2; // 标记为编辑模式 |
| | | // 根据围栏类型设置fenceType |
| | | layerParams.value.editNest = true; |
| | | layerParams.value.decideWhetherToAddOrEdit = 2; |
| | | if (activeName.value === '自定义识别区') { |
| | | layerParams.value.fenceType = 1; |
| | | } else if (activeName.value === '自定义禁飞区') { |
| | |
| | | layerParams.value.editingIsProhibited = true; |
| | | } |
| | | } |
| | | }else { |
| | | |
| | | |
| | | } |
| | | |
| | | }; |
| | | let publicCesiumInstance = null; |
| | | let viewer = null; |
| | |
| | | dom: 'layMap', |
| | | flatMode: false, |
| | | terrain: true, |
| | | layerMode: 4, |
| | | contour: false, |
| | | layerMode: 4, //轮廓线 |
| | | dockOptions:{showDock:true}//机巢 |
| | | }); |
| | | viewer = publicCesiumInstance.getViewer(); |
| | | viewInstance.value = publicCesiumInstance; |
| | |
| | | } |
| | | }; |
| | | provide('layerParams', layerParams); |
| | | // onMounted(() => { |
| | | // initMap(); |
| | | // cesiumContextMenu(); |
| | | // getdataFolderApi(); |
| | | // EventBus.on('deleteMapEntityById', deleteMapEntityById); |
| | | // EventBus.on('deleteMapEntitiesByFolderId', deleteMapEntitiesByFolderId); |
| | | |
| | | // }); |
| | | onMounted(() => { |
| | | initMap(); |
| | | cesiumContextMenu(); |
| | | getdataFolderApi(); |
| | | // 监听定位事件 |
| | | EventBus.on('focusOnNode', (nodeData) => { |
| | | focusOnNode(nodeData); |
| | | }); |
| | | EventBus.on('deleteMapEntityById', deleteMapEntityById); |
| | | EventBus.on('deleteMapEntitiesByFolderId', deleteMapEntitiesByFolderId); |
| | | |
| | | }); |
| | | |
| | | //定位到指定节点 |
| | | const focusOnNode = (nodeData) => { |
| | | |
| | | if (!viewer || !nodeData?.geo_data) return; |
| | | |
| | | // 解析节点坐标 |
| | | const positions = parseGeoDataToPositions(nodeData.geo_data, nodeData.altitude); |
| | | if (positions.length < 3) { |
| | | |
| | | return; |
| | | } |
| | | flyVisual({ |
| | | positionsData: positions.map(pos => [pos.lng, pos.lat, pos.height || 0]), |
| | | viewer, |
| | | multiple:activeName.value == '国土空间规划' ? 13 :7, // 缩放倍数 |
| | | pitch: -90 |
| | | }); |
| | | |
| | | }; |
| | | onBeforeUnmount(() => { |
| | | destroyMap(); |
| | | cesiumContextMenu(false); |
| | |
| | | position: relative; |
| | | width: 100%; |
| | | height: 80vh; |
| | | .warning { |
| | | position: absolute; |
| | | top: 234px; |
| | | color: #fff; |
| | | background: rgba(140, 0, 0, 0.4); |
| | | |
| | | .icon { |
| | | display: flex; |
| | | align-items: center; |
| | | color: #ff1f1f; |
| | | } |
| | | } |
| | | #layMap { |
| | | width: 100%; |
| | | height: 100%; |