From c711e82c4b1685a4b00884d7aab70d9d3b0265ff Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Thu, 30 Oct 2025 11:10:31 +0800
Subject: [PATCH] feat:地图渲染添加点
---
src/views/layerManagement/index.vue | 33 +++++++++++++++++----------------
1 files changed, 17 insertions(+), 16 deletions(-)
diff --git a/src/views/layerManagement/index.vue b/src/views/layerManagement/index.vue
index 6a4d83e..6a2f096 100644
--- a/src/views/layerManagement/index.vue
+++ b/src/views/layerManagement/index.vue
@@ -74,7 +74,7 @@
provide('layerParams', layerParams);
const handleClick = tab => {
const clickedTab = tabData.value.find(item => item.type === tab.paneName);
- console.log(clickedTab, '5555')
+
activeType.value = clickedTab.type;
activeName.value = clickedTab.name;
};
@@ -86,7 +86,7 @@
viewer.entities.removeAll();
layerParams.value.editDetailData = val;
drawPolygonExample.editThePatch(true);
- const positions = parseGeoDataToPositions(val.geo_data, val.altitude);
+ const positions = parseGeoDataToPositions(val.geo_data, val.altitude);
if (positions.length < 3) return; // 少于3个点无法构成多边形
drawPolygonExample.drawTheArea(true)
drawPolygonExample.initPolygon(viewer, positions, true);
@@ -107,7 +107,6 @@
// 点击显示区域
const handleCoverDataUpdate = data => {
selectDataList.value = data;
-
if (selectDataList.value.length > 0) {
loadDataToMap(selectDataList.value);
} else {
@@ -120,12 +119,12 @@
// 存储所有有效坐标，用于后续定位
tbJwdList = [];
dataList.forEach(item => {
- const positions = parseGeoDataToPositions(item.geo_data, item.altitude);
+ let positions = parseGeoDataToPositions(item.geo_data, item.altitude);
+ positions.push(positions[0])
if (positions.length < 3) {
console.warn(`数据 ${item.name} 坐标点不足，无法绘制`);
return;
}
-
tbJwdList.push(...positions);
// 转换为 Cesium 所需的 [lng, lat, lng, lat, ...] 扁平数组格式
let degreesArray = [];
@@ -232,9 +231,10 @@
// 编辑/绘制
const loadPlanarRoute = async (positions = null, save = false) => {
+
if (positions) {
curPolygonPosition = positions.map(item => {
- let cartographic = Cesium.Cartographic.fromCartesian(item);
+ let cartographic = Cesium.Cartographic.fromCartesian(item);
let lng = Cesium.Math.toDegrees(cartographic.longitude); // 经度
let lat = Cesium.Math.toDegrees(cartographic.latitude); // 纬度
let height = Cesium.Math.toDegrees(cartographic.height); //高度
@@ -245,21 +245,22 @@
};
});
}
+
+
let polygon = curPolygonPosition.map(item => [item?.lng, item?.lat]);
- polygon.push([curPolygonPosition[0]?.lng, curPolygonPosition[0]?.lat]);
- // console.log('绘制的多边形顶点坐标（Cartesian3）：', polygon);
-layerParams.value.polygonPosition = polygon
- console.log('polygon', layerParams.value.polygonPosition);
-};
-const throttleLoadPlanarRoute = throttle(loadPlanarRoute, 200);
-drawPolygonExample.subscribe('getPolygonPositions', data => {
- throttleLoadPlanarRoute(data);
-});
+ let polygonString = JSON.stringify(polygon);
+ // polygon.push([curPolygonPosition[0]?.lng, curPolygonPosition[0]?.lat]);
+ layerParams.value.polygonPosition = polygonString
+
+ };
+ const throttleLoadPlanarRoute = throttle(loadPlanarRoute, 200);
+ drawPolygonExample.subscribe('getPolygonPositions', data => {
+ throttleLoadPlanarRoute(data);
+ });
// 地图销毁
const destroyMap = () => {
drawPolygonExample.destroy();
-
if (viewer) {
viewer.destroy();
viewer = null;
--
Gitblit v1.9.3