feat: 优化滚轮更新界面太慢

罗广辉

2025-04-03 23e922aa76e96d297930b2dd99ce384280f4bb7f

feat: 优化滚轮更新界面太慢

 src/views/Home/useMapAggregation/useMapAggregation.js

@@ -46,13 +46,10 @@
  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 => {
  const determineScaling = () => {
    console.log('确定缩放比例');
    if (!viewer) return;
    let height = viewer.camera.positionCartographic.height;
@@ -64,6 +61,7 @@
        active = item.name;
        removeEntities();
        removeLabel();
        if (!item.gJson && !item.splashedList?.length) return;
        item.gJson ? aggregation(item) : splashed(item);
        renderOutline(item);
        break;
@@ -216,7 +214,10 @@
  watch(
    selectedAreaCode,
    async (newValue, oldValue) => {
      initMapData(newValue);
      viewer.scene.postRender.removeEventListener(determineScaling)
      initMapData(newValue).then(()=>{
        viewer.scene.postRender.addEventListener(determineScaling)
      })
    },
    { deep: true }
  );
@@ -284,10 +285,10 @@
    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.center,
        data: item1.data,
        id: item1.region_code,
      }
    });
    // 遍历特征并添加实体
@@ -434,7 +435,8 @@
  const removeAll = () => {
    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 +446,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 +461,6 @@
  //     viewer = window.$viewer;
  //     handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
  //     handler.setInputAction(singleMachineEvent, Cesium.ScreenSpaceEventType.LEFT_CLICK);
  //     listenerHeight();
  //   });
  // });