From cbec4308b61d0147cd60abfcbbb90db24c4a8e7f Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Tue, 08 Apr 2025 15:22:29 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
src/views/Home/useMapAggregation/useMapAggregation.js | 75 +++++++++++++++++++------------------
1 files changed, 39 insertions(+), 36 deletions(-)
diff --git a/src/views/Home/useMapAggregation/useMapAggregation.js b/src/views/Home/useMapAggregation/useMapAggregation.js
index 95b05e6..7d0da18 100644
--- a/src/views/Home/useMapAggregation/useMapAggregation.js
+++ b/src/views/Home/useMapAggregation/useMapAggregation.js
@@ -46,14 +46,11 @@
const store = useStore();
const userAreaCode = computed(() => store.state.user.userInfo.detail.areaCode);
const selectedAreaCode = computed(() => store.state.user.selectedAreaCode);
- const listenerHeight = () => {
- determineScaling();
- viewer.camera.moveEnd.addEventListener(determineScaling);
- };
+
// 确定缩放比例
- const determineScaling = index => {
- console.log('确定缩放比例');
+ const determineScaling = () => {
+ // console.log('确定缩放比例');
if (!viewer) return;
let height = viewer.camera.positionCartographic.height;
// 根据高度展示对应的 gJson
@@ -64,8 +61,9 @@
active = item.name;
removeEntities();
removeLabel();
- item.gJson ? aggregation(item) : splashed(item);
renderOutline(item);
+ if (!item.gJson && !item.splashedList?.length) return;
+ item.gJson ? aggregation(item) : splashed(item);
break;
}
}
@@ -162,8 +160,6 @@
const splashedList = type === 'device'
? await getDeviceList(areaCode)
: eventList.map(i=>({eventId:i.id,latitude:Number(i.latitude),longitude:Number(i.longitude),type:'event'}))
- console.log(list, 'list');
- console.log(splashedList, 'splashedList');
const hierarchy = convertToHierarchy(areaCode.slice(0, 6));
const jsonPath = hierarchy.join('/');
const jsonPathPre = hierarchy.slice(0, hierarchy.length - 1).join('/');
@@ -171,14 +167,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 => {
@@ -186,10 +178,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) {
@@ -197,8 +186,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) {
@@ -206,25 +193,31 @@
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(
selectedAreaCode,
async (newValue, oldValue) => {
- initMapData(newValue);
+ if (!viewer) return
+ viewer.scene.postRender.removeEventListener(determineScaling)
+ initMapData(newValue).then(()=>{
+ viewer.scene.postRender.addEventListener(determineScaling)
+ })
},
{ deep: true }
);
//散点机巢
function splashed(row) {
- row.splashedList.forEach(item => {
+ row.splashedList.forEach((item,index) => {
viewer.entities.add({
+ id: `aggregation-splashed-${index}`,
position: Cesium.Cartesian3.fromDegrees(item.longitude, item.latitude),
label: {
// 随机整数
@@ -284,18 +277,19 @@
const featuresList = item.gJson.features.map(item1 => {
// const {lng,lat} = getCenterPoint(item1.geometry.coordinates[0][0])
return {
- name: item.properties.name,
- position: item.properties.center,
- data: item.data,
- id: item.region_code,
+ name: item1.properties.name,
+ position: item1.properties.centroid,
+ data: item1.data,
+ id: item1.region_code,
}
});
// 遍历特征并添加实体
- featuresList.forEach(feature => {
+ featuresList.forEach((feature,index) => {
if (!feature.position) return;
const position = Cesium.Cartesian3.fromDegrees(feature.position[0], feature.position[1]);
viewer.entities.add({
position: position,
+ id: `aggregation-name-${index}`,
label: {
text: feature.name,
font: '14pt Source Han Sans CN',
@@ -308,12 +302,13 @@
},
});
viewer.entities.add({
- id: feature.id,
+ id: `aggregation-count-${index}`,
position: position,
label: {
- text: feature.data.total_device_count.toString(),
+ text: (feature.data.total_device_count || 0).toString(),
font: '12pt Source Han Sans CN',
fillColor: Cesium.Color.BLACK,
+ outlineColor: Cesium.Color.BLACK,
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
eyeOffset: new Cesium.Cartesian3(0, 0, -10), // 让label "浮" 在广告牌前面
},
@@ -422,7 +417,11 @@
// 移除 点 和 gjson 实体
const removeEntities = () => {
viewer.dataSources?.removeAll(true);
- viewer.entities?.removeAll();
+ // viewer.entities?.removeAll();
+ const entitiesIDs = viewer.entities.values.map(i=>i.id)
+ entitiesIDs.forEach(item => {
+ item.includes('aggregation-') && viewer.entities.removeById(item)
+ })
};
// 移除弹框标签
const removeLabel = () => {
@@ -432,9 +431,11 @@
// 移除所有监听事件，变量置空
const removeAll = () => {
+ if (!viewer) return
removeEntities();
removeLabel();
- viewer.camera.moveEnd.removeEventListener(determineScaling);
+ // viewer.camera.moveEnd.removeEventListener(determineScaling);
+ viewer.scene.postRender.removeEventListener(determineScaling)
handler?.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
handler?.destroy();
viewer = null;
@@ -444,11 +445,14 @@
currentEntity = null;
};
const init = () => {
- initMapData(selectedAreaCode.value || userAreaCode.value);
viewer = window.$viewer;
+ viewer.scene.postRender.removeEventListener(determineScaling)
+ initMapData(selectedAreaCode.value || userAreaCode.value).then(()=>{
+ viewer.scene.postRender.addEventListener(determineScaling)
+ })
handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
handler.setInputAction(singleMachineEvent, Cesium.ScreenSpaceEventType.LEFT_CLICK);
- listenerHeight();
+
};
onBeforeUnmount(() => {});
// onMounted(() => {
@@ -456,7 +460,6 @@
// viewer = window.$viewer;
// handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
// handler.setInputAction(singleMachineEvent, Cesium.ScreenSpaceEventType.LEFT_CLICK);
- // listenerHeight();
// });
// });
--
Gitblit v1.9.3