智慧园区前端大屏
1
shuishen
2024-12-02 1dee40ea46601f2ee5d10aa0190625ebf03bdc4e
src/views/pd/components/dynamicPanel.vue
@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2024-11-09 15:41:35
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2024-11-26 19:08:39
 * @LastEditTime: 2024-11-28 19:36:24
 * @FilePath: \bigScreen\src\views\pd\components\dynamicPanel.vue
 * @Description: 
 * 
@@ -65,8 +65,8 @@
      fiveContent: '应急指挥部指导企业处理受污染废水, 监测公共应急池水质 ,确保达标后安全转运至绿源污水处理厂。',
      fivePointPosition: {
        lng: 115.10845441,
        lat: 27.27327366
        lng: 115.10843364,
        lat: 27.27320219
      },
      fivetime: 25000,
    },
@@ -96,10 +96,10 @@
      },
      twotime: 10000,
      threeContent: '园区启用北区公共应急池,将已拦截废水泵入应急池。',
      threeContent: '园区启用北区公共应急池(拟建),将已拦截废水泵入应急池。',
      threePointPosition: {
        lng: 115.10418532,
        lat: 27.29444603
        lng: 115.106600,
        lat: 27.296891
      },
      threetime: 15000,
@@ -156,9 +156,9 @@
  ]
})
const dynamicVectorLayer = new DC.VectorLayer('dynamicVectorLayer').addTo(window.$viewer)
const dynamicHtmlLayer = new DC.HtmlLayer('dynamicHtmlLayer').addTo(window.$viewer)
const dynamicLineVectorLayer = new DC.VectorLayer('dynamicLineVectorLayer').addTo(window.$viewer)
let dynamicVectorLayer = new DC.VectorLayer('dynamicVectorLayer').addTo(window.$viewer)
let dynamicHtmlLayer = new DC.HtmlLayer('dynamicHtmlLayer').addTo(window.$viewer)
let dynamicLineVectorLayer = new DC.VectorLayer('dynamicLineVectorLayer').addTo(window.$viewer)
let modelPosition = [
  {
@@ -196,13 +196,12 @@
]
let positions = modelPosition.map(i => [i.lng, i.lat, 60].join(',')).join(';')
console.log(positions, 1111111)
let positions = modelPosition.map(i => [i.lng, i.lat, 64].join(',')).join(';')
let tc = new DC.TrackController(window.$viewer)
let track = new DC.Track(positions, 5)
track.setModel(VITE_APP_BASE + 'gltf/111.gltf', {
  scale: 0.005,
  color: DC.Color.RED,
track.setModel(VITE_APP_BASE + 'gltf/car.gltf', {
  show: true,
  scale: 0.0025,
  // nodeTransformations: {
  //   rotation: window.$Cesium.Quaternion.fromHeadingPitchRoll(window.$Cesium.Math.toRadians(0), window.$Cesium.Math.toRadians(0), window.$Cesium.Math.toRadians(0)),
  // }
@@ -210,17 +209,24 @@
tc.addTrack(track)
const schemeStart = (item) => {
  emit('closePanel')
  clearAll()
  if (item.showModel) {
    window.$viewer.flyToPosition("115.10587903,27.28374884,400,0,-90", () => {
      track.setModel(VITE_APP_BASE + 'gltf/car.gltf', {
        show: true,
        scale: 0.0025,
        // nodeTransformations: {
        //   rotation: window.$Cesium.Quaternion.fromHeadingPitchRoll(window.$Cesium.Math.toRadians(0), window.$Cesium.Math.toRadians(0), window.$Cesium.Math.toRadians(0)),
        // }
      })
      tc.play()
      tc.viewTrack(track, {
        mode: '2',
        pitch: -90,
        pitch: -45,
        range: 400
      })
    })
@@ -407,6 +413,14 @@
  timeFour && (clearTimeout(timeFour), timeFour = null)
  timeFive && (clearTimeout(timeFive), timeFive = null)
  track.setModel(VITE_APP_BASE + 'gltf/car.gltf', {
    show: false,
    scale: 0.0025,
    // nodeTransformations: {
    //   rotation: window.$Cesium.Quaternion.fromHeadingPitchRoll(window.$Cesium.Math.toRadians(0), window.$Cesium.Math.toRadians(0), window.$Cesium.Math.toRadians(0)),
    // }
  })
  dynamicVectorLayer.clear()
  dynamicHtmlLayer.clear()
  dynamicLineVectorLayer.clear()
@@ -415,9 +429,16 @@
onUnmounted(() => {
  clearAll()
  dynamicVectorLayer && window.$viewer.removeLayer(dynamicVectorLayer)
  dynamicHtmlLayer && window.$viewer.removeLayer(dynamicHtmlLayer)
  dynamicLineVectorLayer && window.$viewer.removeLayer(dynamicLineVectorLayer)
  tc.clear()
  dynamicVectorLayer && window.$viewer && window.$viewer.removeLayer(dynamicVectorLayer)
  dynamicHtmlLayer && window.$viewer && window.$viewer.removeLayer(dynamicHtmlLayer)
  dynamicLineVectorLayer && window.$viewer && window.$viewer.removeLayer(dynamicLineVectorLayer)
  tc = null
  track = null
  dynamicVectorLayer = null
  dynamicHtmlLayer = null
  dynamicLineVectorLayer = null
})
</script>