xieb
2023-11-16 2ff44773a8dabed87dc1f70c0676961939310e75
Merge remote-tracking branch 'origin/demo' into demo
2 files modified
73 ■■■■ changed files
src/components/g-map/DroneControlPanel.vue 45 ●●●●● patch | view | raw | blame | history
src/hooks/use-cesium-tsa.ts 28 ●●●● patch | view | raw | blame | history
src/components/g-map/DroneControlPanel.vue
@@ -525,8 +525,10 @@
  flyByArea(sn, dockPoint, jsonPath, radius, deviceSn, payloadIndex).then(res => {
    const targetPoint = res.data
    console.log('targetPoint====', targetPoint)
    // 获取到点之后在图上绘点
    targetPoint.forEach((point, index) => {
      console.log(point)
      const setting = {
        longitude: point.lon,
        latitude: point.lat,
@@ -546,8 +548,49 @@
        },
        id: 'target' + index,
      }
      cesiumFunc.addPoint(setting)
      // 根据点画连线
      let polylineSetting = {}
      if (index === (targetPoint.length - 1)) {
        polylineSetting = {
          polyline: {
            positions: Cesium.Cartesian3.fromDegreesArrayHeights([
              point.lon,
              point.lat,
              0,
              targetPoint[0].lon,
              targetPoint[0].lat,
              0
            ]),
            width: 10,
            arcType: Cesium.ArcType.NONE,
            material: new Cesium.PolylineArrowMaterialProperty(
              Cesium.Color.RED
            ),
          },
          id: 'fxTarget' + index
        }
      } else {
        polylineSetting = {
          polyline: {
            positions: Cesium.Cartesian3.fromDegreesArrayHeights([
              point.lon,
              point.lat,
              0,
              targetPoint[index + 1].lon,
              targetPoint[index + 1].lat,
              0
            ]),
            width: 10,
            arcType: Cesium.ArcType.NONE,
            material: new Cesium.PolylineArrowMaterialProperty(
              Cesium.Color.RED
            ),
          },
          id: 'fxTarget' + index
        }
      }
      cesiumFunc.addPolyline(polylineSetting)
    })
  })
}
src/hooks/use-cesium-tsa.ts
@@ -26,8 +26,8 @@
  [key: string]: any
}
interface pointOption {
  longitude: number
  latitude: number
  longitude?: number
  latitude?: number
  point?: pointSetting
  billboard?: billboardSetting
  polyline?: polyline
@@ -146,7 +146,7 @@
    }
  }
  function removeAllDataSource () {
  function removeAllDataSource() {
    viewer.dataSources.removeAll()
  }
@@ -179,10 +179,21 @@
      ellipse: {
        semiMinorAxis: 7000.0,
        semiMajorAxis: 7000.0,
        material: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.3),
        outline: true,
        material: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.3)
      }
    })
    console.log(viewer?.entities)
  }
  // 添加点击事件
  const addClickEvent = (sid: string, cb: Function) => {
    const handler = new Cesium.ScreenSpaceEventHandler(viewer?.scene.canvas)
    handler.setInputAction(function (click: { position: Cesium.Cartesian2 }) {
      const pick = viewer?.scene.pick(click.position)
      if (pick && pick.id._id === sid) {
        cb(click, pick, viewer)
      }
    }, Cesium.ScreenSpaceEventType.LEFT_CLICK)
  }
  // 添加线段
@@ -277,7 +288,7 @@
  }
  // 加载json文件
  const loadGeoJson = (url:string) => {
  const loadGeoJson = (url: string) => {
    const option = {
      stroke: Cesium.Color.HOTPINK,
      fill: Cesium.Color.PINK,
@@ -287,7 +298,7 @@
    promise.then(dataSource => {
      console.log(dataSource)
      viewer.dataSources.add(dataSource)
      viewer?.dataSources.add(dataSource)
    })
  }
@@ -336,6 +347,7 @@
    addPolyline,
    addEllipse,
    loadGeoJson,
    removeAllDataSource
    removeAllDataSource,
    addClickEvent
  }
}