Merge branch 'master' of http://139.196.74.78:10010/r/drone/command-center-...

chenyao

2025-04-12 80790ccc8b8ee6ac8db201f0f6c2d136fefd5a69

 src/views/Home/useMapAggregation/useMapAggregation.js

@@ -16,6 +16,14 @@
/**
 * 机巢聚合功能
 */

let arrColor = ["rgb(15,176,255)", "rgb(18,76,154)", "#40C4E4", "#42B2BE", "rgb(51,176,204)", "#8CB7E5", "rgb(0,244,188)", "#139FF0"]

let index = 0
function getColor () {
  return arrColor[++index % arrColor.length]
}

export const useMapAggregation = type => {
  const { flyTo } = cesiumOperation()

@@ -198,12 +206,27 @@
    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)
    const height = scalingJudgment[(hierarchy.length - 3) * (-1)].height
    setCenterPosition({ longitude, latitude, height })
    flyTo({ longitude, latitude }, 0, height)
  }

  const userAreaPosition = computed(() => store.state.home.userAreaPosition)

  const setCenterPosition = (position) => {
    store.commit('setCurrentAreaPosition', position)
    if (!userAreaPosition.value.longitude) {
      store.commit('setUserAreaPosition', position)
    }
  }


  let needFly = true

  watch(
    selectedAreaCode,
    async (newValue, oldValue) => {
      needFly = true
      if (!viewer) return
      viewer.scene.postRender.removeEventListener(determineScaling)
      initMapData(newValue).then(() => {
@@ -220,7 +243,6 @@
        id: `aggregation-splashed-${index}`,
        position: Cesium.Cartesian3.fromDegrees(item.longitude, item.latitude),
        label: {
          // 随机整数
          text: item.nickname,
          font: '12pt Source Han Sans CN',
          fillColor: Cesium.Color.WHITE,
@@ -248,15 +270,31 @@
  const renderOutline = item => {
    item.outline &&
      Cesium.GeoJsonDataSource.load(item.outline).then(dataSource => {
        viewer.dataSources.add(dataSource)
        const entities = dataSource.entities.values
        entities.forEach(entity => {
          // 隐藏多边形填充
          entity.polygon.material = Cesium.Color.TRANSPARENT
          entity.polygon.outline = false // 关闭原生轮廓
        entities.forEach((entity, index) => {
          // 创建独立折线作为轮廓
          const positions = entity.polygon.hierarchy.getValue().positions
          const randomInt = Math.floor(Math.random() * 5) + 1

          let polygon = {}

          if (item.name == '县') {
            let material = new PolyGradientMaterial({
              color: Cesium.Color.fromCssColorString(arrColor[randomInt]),
              opacity: 0.7,
              alphaPower: 1.3
            })

            entity.polygon.extrudedHeight = (entity.properties.childrenNum._value || 1) * 500

            entity.polygon.material = material

            polygon = entity.polygon
            entity.polygon.outline = false // 显示边框
          }

          viewer.entities.add({
            id: `aggregation-outline-${index}`,
            polyline: {
              positions: positions,
              width: 5, // 直接设置宽度
@@ -264,15 +302,16 @@
                glowPower: 0.5,
                color: Cesium.Color.AQUA,
              }),
              clampToGround: true, // 贴地显示
            },

            polygon
          })
        })
      })
  }

  // 聚合机巢
  const aggregation = (item, flyTo) => {
  const aggregation = (item) => {
    if (!item.gJson) return
    const featuresList = item.gJson.features.map(item1 => {
      // const {lng,lat} = getCenterPoint(item1.geometry.coordinates[0][0])
@@ -286,7 +325,7 @@
    // 遍历特征并添加实体
    featuresList.forEach((feature, index) => {
      if (!feature.position) return
      const position = Cesium.Cartesian3.fromDegrees(feature.position[0], feature.position[1])
      const position = Cesium.Cartesian3.fromDegrees(feature.position[0], feature.position[1], 0)
      viewer.entities.add({
        position: position,
        id: `aggregation-name-${index}`,
@@ -326,17 +365,10 @@
      })
    })

    let arrColor = ["rgb(15,176,255)", "rgb(18,76,154)", "#40C4E4", "#42B2BE", "rgb(51,176,204)", "#8CB7E5", "rgb(0,244,188)", "#139FF0"]

    let index = 0
    function getColor () {
      return arrColor[++index % arrColor.length]
    }

    // 加载新的 GeoJSON 数据
    // 加载边界
    Cesium.GeoJsonDataSource.load(item.gJson).then(dataSource => {
      viewer.dataSources.add(dataSource)
      item.dataSource = dataSource // 保存数据源以便后续删除
      item.BJDataSource = dataSource // 保存数据源以便后续删除
      // 获取数据源中的实体
      const entities = dataSource.entities.values

@@ -347,20 +379,19 @@
          alphaPower: 1.3
        })

        entity.polygon.extrudedHeight = (entity.propertyNames.length || 1) * 500
        const randomInt = Math.floor(Math.random() * 8) + 1

        entity.polygon.extrudedHeight = (entity.properties.childrenNum._value || randomInt) * 500

        entity.polygon.material = material
        entity.polygon.outline = false // 显示边框
      })

      flyTo && viewer.flyTo(dataSource, {
        offset: new Cesium.HeadingPitchRange(
          0, // heading: 0 (朝向不变)
          Cesium.Math.toRadians(-60), // pitch: -90° (垂直向下)
          0 // range: 0 (默认距离)
        ),
      needFly && viewer.flyTo(dataSource, {
        offset: new Cesium.HeadingPitchRange(0, Cesium.Math.toRadians(-60), 0),
        duration: 0.5,
      })
      needFly = false
    })
  }

@@ -391,32 +422,41 @@
    }
  }

  /**
   * 根据条件获取项
   * @param {Array} arr 数据源
   * @param {Function} condition 条件
   * @returns 
   */
  const findTypeItem = (arr, condition) => {
    return arr.find(item => condition(item))
  }

  // 左键单机事件
  const singleMachineEvent = async click => {
    const pickedObject = viewer.scene.pick(click.position)
    if (Cesium.defined(pickedObject) && pickedObject.id) {
      const entity = pickedObject.id
      currentEntity = entity
      positionC3 = entity?.position?._value
      if (!positionC3) return
      removeLabel()
      const customData = entity.properties.customData._value.data
      console.log('customData', customData)
      switch (customData.type) {
        case 'deviceAggregation':
          viewer.scene.postRender.addEventListener(labelBoxRender)
          break
        case 'device':
          store.commit('setSingleUavHome', { id: '123' })
          break
        case 'eventAggregation':
          break
        case 'event':
          viewer.scene.postRender.addEventListener(labelBoxRender)
          break
        default:
          break
      }
    let clickTargets = viewer.scene.drillPick(click.position).map(item => item.id)
    if (!clickTargets.length) return

    let deviceAggregationFind = findTypeItem(clickTargets, (item) => item?.properties?.customData?._value?.data?.type == 'deviceAggregation')
    let deviceFind = findTypeItem(clickTargets, (item) => item?.properties?.customData?._value?.data?.type == 'device')
    let eventFind = findTypeItem(clickTargets, (item) => item?.properties?.customData?._value?.data?.type == 'event')

    const curEntity = deviceAggregationFind || deviceFind || eventFind

    if (!curEntity) return

    currentEntity = curEntity
    const entityPosition = curEntity?.position?._value
    if (!entityPosition) return
    if (entityPosition) {
      positionC3 = entityPosition
    }

    if (deviceAggregationFind || eventFind) {
      viewer.scene.postRender.addEventListener(labelBoxRender)
    }
    if (deviceFind) {
      store.commit('setSingleUavHome', { id: '123' })
    }
  }

@@ -429,8 +469,12 @@

  // 移除 点 和 gjson 实体
  const removeEntities = () => {
    viewer.dataSources?.removeAll(true)
    // viewer.entities?.removeAll();
    // dataSources移除
    scalingJudgment.forEach(item => {
      item.BJDataSource && viewer.dataSources.remove(item.BJDataSource)
      item.BJDataSource = null
    })
    // entities移除
    const entitiesIDs = viewer.entities.values.map(i => i.id)
    entitiesIDs.forEach(item => {
      item.includes('aggregation-') && viewer.entities.removeById(item)
@@ -438,7 +482,7 @@
  }
  // 移除弹框标签
  const removeLabel = () => {
    viewer.scene.postRender.removeEventListener(labelBoxRender)
    viewer?.scene.postRender.removeEventListener(labelBoxRender)
    removeDom()
  }