From 7635213630830c4cbb9ff6ada69ba9b5c8a35d42 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Thu, 03 Apr 2025 11:05:34 +0800
Subject: [PATCH] feat: 地图居中点调整
---
src/views/SignMachineNest/components/MachineRight/MachineStatus.vue | 15 ++++++++-------
src/views/SignMachineNest/components/MachineRight/components/MachineTableDetails.vue | 4 +++-
src/views/Home/useMapAggregation/useMapAggregation.js | 24 ++++++++----------------
3 files changed, 19 insertions(+), 24 deletions(-)
diff --git a/src/views/Home/useMapAggregation/useMapAggregation.js b/src/views/Home/useMapAggregation/useMapAggregation.js
index 1e4f0b2..c3f6248 100644
--- a/src/views/Home/useMapAggregation/useMapAggregation.js
+++ b/src/views/Home/useMapAggregation/useMapAggregation.js
@@ -50,7 +50,7 @@
// 确定缩放比例
const determineScaling = () => {
- console.log('确定缩放比例');
+ // console.log('确定缩放比例');
if (!viewer) return;
let height = viewer.camera.positionCartographic.height;
// 根据高度展示对应的 gJson
@@ -61,9 +61,9 @@
active = item.name;
removeEntities();
removeLabel();
+ renderOutline(item);
if (!item.gJson && !item.splashedList?.length) return;
item.gJson ? aggregation(item) : splashed(item);
- renderOutline(item);
break;
}
}
@@ -169,14 +169,10 @@
scalingJudgment[0].gJson = null;
scalingJudgment[0].splashedList = splashedList;
active = null;
- // 轮廓
- const outlineGJson = await getOutLine(jsonPathPre, hierarchy);
- scalingJudgment.forEach(item => item.show && (item.outline = outlineGJson));
// 省
if (hierarchy.length === 1) {
const gJson1 = await getFiler(`${defaultDir}${jsonPath}/indexDistrict.json`);
const gJson2 = await getFiler(`${defaultDir}${jsonPath}/index.json`);
-
scalingJudgment[1].gJson = {
...gJson1,
features: gJson1.features.map(item => {
@@ -184,10 +180,7 @@
return { ...item, data: {...findData,type: type + 'Aggregation'} }
}),
};
- console.log(injectData(gJson2, list));
scalingJudgment[2].gJson = injectData(gJson2, list);
- const { lng, lat } = getCenterPoint(gJson2.features.map(item => item.properties.center));
- flyTo({ longitude: lng, latitude: lat }, 0, scalingJudgment[2].height);
}
// 市
if (hierarchy.length === 2) {
@@ -195,8 +188,6 @@
scalingJudgment[2].show = false;
const gJson1 = await getFiler(`${defaultDir}${jsonPath}/index.json`);
scalingJudgment[1].gJson = injectData(gJson1, list);
- const center = getCenterPoint(gJson1.features.map(item => item.properties.center));
- flyTo({ longitude: center.lng, latitude: center.lat }, 0, scalingJudgment[1].height);
}
// 区县
if (hierarchy.length === 3) {
@@ -204,11 +195,12 @@
scalingJudgment[1].show = false;
scalingJudgment[2].gJson = null;
scalingJudgment[2].show = false;
- const outlineGJson = await getOutLine(jsonPathPre, hierarchy);
- const center = outlineGJson.features[0].properties.center;
- flyTo({ longitude: center[0], latitude: center[1] }, 0, scalingJudgment[0].height);
}
- determineScaling()
+ // 轮廓
+ const outlineGJson = await getOutLine(jsonPathPre, hierarchy);
+ scalingJudgment.forEach(item => item.show && (item.outline = outlineGJson));
+ const [longitude,latitude] = outlineGJson.features[0].properties.centroid
+ flyTo({ longitude, latitude }, 0, scalingJudgment[(hierarchy.length-3) * (-1)].height);
};
watch(
@@ -287,7 +279,7 @@
// const {lng,lat} = getCenterPoint(item1.geometry.coordinates[0][0])
return {
name: item1.properties.name,
- position: item1.properties.center,
+ position: item1.properties.centroid,
data: item1.data,
id: item1.region_code,
}
diff --git a/src/views/SignMachineNest/components/MachineRight/MachineStatus.vue b/src/views/SignMachineNest/components/MachineRight/MachineStatus.vue
index 197277b..16d9c0c 100644
--- a/src/views/SignMachineNest/components/MachineRight/MachineStatus.vue
+++ b/src/views/SignMachineNest/components/MachineRight/MachineStatus.vue
@@ -66,7 +66,7 @@
</div>
</div>
</div>
- <!-- <MachineTableDetails :dialogVisible="isShowDetails" /> -->
+ <MachineTableDetails v-model:show="isShowDetails"/>
</template>
<script setup>
@@ -75,6 +75,7 @@
import { EModeCode, EDockModeText, EModeText } from '@/utils/staticData/device';
import { getLnglatAltitude } from '@/utils/cesium/mapUtil.js';
import { useStore } from 'vuex';
+import MachineTableDetails from '@/views/SignMachineNest/components/MachineRight/components/MachineTableDetails.vue';
const store = useStore();
// 获取机巢信息
@@ -269,7 +270,7 @@
);
opacity: 0.85;
margin: 2px 0 13 0;
-
+
padding: 8px 0px 20px 18px;
.info {
display: flex;
@@ -323,16 +324,16 @@
color: #FFB26A;
margin-right: 10px;
}
- .wb {
+ .wb {
width: 60px;
- height: 20px;
+ height: 20px;
background: rgba(255,106,106,0.2);
border-radius: 4px 4px 4px 4px;
border: 1px solid #FF6A6A;
color: #FF6A6A;
}
}
-
+
}
}
.status {
@@ -341,7 +342,7 @@
gap: 10px 20px;
margin-top: 18px;
.card {
- width: calc(33.33% - 14px);
+ width: calc(33.33% - 14px);
}
img {
width: 16px;
@@ -370,4 +371,4 @@
}
}
}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/SignMachineNest/components/MachineRight/components/MachineTableDetails.vue b/src/views/SignMachineNest/components/MachineRight/components/MachineTableDetails.vue
index bf11138..9708b45 100644
--- a/src/views/SignMachineNest/components/MachineRight/components/MachineTableDetails.vue
+++ b/src/views/SignMachineNest/components/MachineRight/components/MachineTableDetails.vue
@@ -4,7 +4,7 @@
</div>
<el-dialog
- v-model="props.dialogVisible"
+ v-model="isShowDetails"
title="机巢详情"
width="800px"
:close-on-click-modal="false"
@@ -27,6 +27,8 @@
},
});
+const isShowDetails = defineModel('show')
+
// const dialogVisible = ref(false);
const tableData = ref([
{
--
Gitblit v1.9.3