feat: 聚合40%

罗广辉

2025-04-02 169c68d481cefcf830329fcb20f89304394c5670

 src/views/Home/useUavHome/useUavHome.js

@@ -1,21 +1,23 @@
import * as Cesium from 'cesium';
import data2 from '@/assets/images/home/homeRight/data2.png';
import data1 from '@/assets/images/home/homeRight/data1.png';
import jiangxishi from '@/assets/geojson/jiangxishi.json';
import jiangxi from '@/assets/geojson/jiangxi.json';
import zg from '@/assets/geojson/zg.json';
import MapPopUpBox from '@/views/Home/useUavHome/MapPopUpBox.vue';
import { render } from 'vue';
import { useStore } from 'vuex';
import { getCenterPoint } from '@/utils/cesium/mapUtil';
import cesiumOperation from '@/utils/cesium-tsa';
import { HeadingPitchRange } from 'cesium';

/**
 * 机巢聚合功能
 */
export const useUavHome = () => {
  const scalingJudgment = [
    { name: '县', value: [0, 48651], gJson: null },
    { name: '市', value: [48651, 314863], gJson: jiangxishi },
    { name: '省', value: [314863, 1169651], gJson: jiangxi },
    { name: '国', value: [1169651, 37962800], gJson: zg },
  const { flyTo } = cesiumOperation();

  let scalingJudgment = [
    { name: '县', value: [0, 48651], gJson: null, height: 31753,show:false },
    { name: '市', value: [48651, 314863], gJson: null, height: 257731,show:false },
    { name: '省', value: [314863, 3796280000], gJson: null, height: 1987280,show:false, },
  ];
  let viewer = null;
  let active = null;
@@ -27,22 +29,97 @@
  };

  // 确定缩放比例
  const determineScaling = () => {
    if(!viewer) return
  const determineScaling = index => {
    console.log(8989);
    if (!viewer) return;
    let height = viewer.camera.positionCartographic.height;
    // 根据高度展示对应的 gJson
    for (let item of scalingJudgment) {
    for (let [index, item] of scalingJudgment.entries()) {
      if (!item.show) return;
      if (height > item.value[0] && height <= item.value[1]) {
        if (active !== item.name) {
          removeEntities();
          removeLabel();
          active = item.name;
          item.gJson ? aggregation(item) : splashed();
        active = item.name;
        removeEntities();
        removeLabel();
        if (item.gJson && item.name !== '县'){
          aggregation(item)
        }else{
          splashed()
        }
        break;
      }
    }
  };

  function convertToHierarchy(code) {
    const codeStr = code.toString();
    const provinceCode = codeStr.slice(0, 2) + '0000';
    const cityCode = codeStr.slice(0, 4) + '00';
    if (codeStr.slice(2, 4) === '00' && codeStr.slice(4, 6) === '00') {
      return [provinceCode];
    } else if (codeStr.slice(4, 6) === '00') {
      return [provinceCode, cityCode];
    }
    return [provinceCode, cityCode, code];
  }

  const store = useStore();
  const selectedAreaCode = computed(() => store.state.user.selectedAreaCode);

  watch(
    selectedAreaCode,
    async (newValue, oldValue) => {
      if (newValue) {
        const code = newValue.slice(0, 6);
        const hierarchy = convertToHierarchy(code);
        const jsonPath = hierarchy.join('/');
        console.log(jsonPath);
        const { VITE_APP_BASE } = import.meta.env;
        if (hierarchy.length === 1) {
          scalingJudgment = scalingJudgment.map(item => ({...item,show:true}))
          scalingJudgment[0].gJson = null;
          scalingJudgment[1].gJson = await import(
            `${VITE_APP_BASE}public/geoJson/100000/${jsonPath}/indexDistrict.json`
          );
          scalingJudgment[2].gJson = await import(
            `${VITE_APP_BASE}public/geoJson/100000/${jsonPath}/index.json`
          );
          const center = getCenterPoint(scalingJudgment[2].gJson.features.map(item => item.properties.center))
          flyTo({longitude: center.lng, latitude: center.lat},0,scalingJudgment[2].height)
          // determineScaling(2);
        }
        if (hierarchy.length === 2) {
          scalingJudgment = scalingJudgment.map(item => ({...item,show:true}))
          scalingJudgment[0].gJson = null;
          scalingJudgment[1].gJson = await import(
            `${VITE_APP_BASE}public/geoJson/100000/${jsonPath}/index.json`
          );
          scalingJudgment[2].gJson = null;
          scalingJudgment[2].show = false;
          const center = getCenterPoint(scalingJudgment[1].gJson.features.map(item => item.properties.center))
          flyTo({longitude: center.lng, latitude: center.lat},0,scalingJudgment[1].height)
          // determineScaling(1);
        }
        if (hierarchy.length === 3) {
          const gJson = await import(
            `${VITE_APP_BASE}public/geoJson/100000/${jsonPath.slice(0, -7)}/index.json`
          );
          const gJson1 = gJson.features.find(
            item => item.properties.adcode === Number(hierarchy[hierarchy.length - 1])
          );
          // scalingJudgment[0].gJson = { type: "FeatureCollection", features: [gJson1] }
          scalingJudgment[0].gJson = null
          scalingJudgment[1].gJson = null;
          scalingJudgment[1].show = null;
          scalingJudgment[2].gJson = null;
          scalingJudgment[2].show = false;
          const center = gJson1.properties.center
          flyTo({longitude: center[0], latitude: center[1]},0,scalingJudgment[0].height)
          // determineScaling(0);
        }
      }
    },
    { immediate: true, deep: true }
  );

  //散点机巢
  function splashed() {
@@ -73,7 +150,8 @@
  }

  // 聚合机巢
  const aggregation = item => {
  const aggregation = (item, flyTo) => {
    if (!item.gJson) return;
    const featuresList = item.gJson.features.map(item => ({
      name: item.properties.name,
      position: item.properties.center,
@@ -122,6 +200,15 @@
        entity.polygon.outline = new Cesium.ConstantProperty(true); // 显示边框
        entity.polygon.outlineColor = new Cesium.ConstantProperty(Cesium.Color.YELLOW); // 黑色边框
      });
      flyTo &&
        viewer.flyTo(dataSource, {
          offset: new Cesium.HeadingPitchRange(
            0, // heading: 0 (朝向不变)
            Cesium.Math.toRadians(-90), // pitch: -90° (垂直向下)
            0 // range: 0 (默认距离)
          ),
          duration: 0.5,
        });
    });
  };

@@ -186,7 +273,7 @@
    handler?.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
    handler?.destroy();
    viewer = null;
    active = null
    active = null;
    handler = null;
    positionC3 = null;
  };
@@ -205,5 +292,5 @@
  //   });
  // });

  return { init,removeAll };
  return { init, removeAll };
};