Merge branch 'main' of http://139.196.74.78:10010/r/zhyq/bigScreen

shuishen

2024-11-22 8e72ebbb44dba3ec5cf6dd3cd2613e6e9aed31ef

 src/pages/layout/components/scomponents/layersControl.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2024-10-31 10:47:29
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2024-11-19 15:53:37
 * @LastEditTime: 2024-11-22 15:37:11
 * @FilePath: \bigScreen\src\pages\layout\components\scomponents\layersControl.vue
 * @Description:
 *
@@ -74,10 +74,13 @@

const { VITE_APP_BASE } = import.meta.env

let indexPoint = ref(['1'])
let indexPoint = ref(['5', '7', '1'])

const treeRef = ref(null)
const Cesium = DC.getLib('Cesium')

console.log(Cesium, 45646465)

const treeProps = {
  indent: 16,
  showLabelLine: true,
@@ -166,7 +169,8 @@
          addPupoLayers[attrParams.name] = new DC.HtmlLayer(attrParams.name)
          window.$viewer.addLayer(addPupoLayers[attrParams.name])
          let iconEl = `<div class="marsBlueGradientPnl">
                  <img src="${attrParams.imageUrl}" width="160" height="160" />
            <div>${attrParams.fullName}</div>      
            <img src="${attrParams.imageUrl}" />
                </div>`
          let divIcon = new DC.DivIcon(
            new DC.Position(attrParams.lng, attrParams.lat, 64),
@@ -205,6 +209,7 @@
          addPupoLayers[attrParams.name] = new DC.HtmlLayer(attrParams.name)
          window.$viewer.addLayer(addPupoLayers[attrParams.name])
          let iconEl = `<div class="marsBlueGradientPnl">
                  <div>${attrParams.fullName}</div>
                  <img src="${attrParams.imageUrl}" width="160" height="160" />
                </div>`
          let divIcon = new DC.DivIcon(
@@ -290,6 +295,7 @@
          addPupoLayers[attrParams.name] = new DC.HtmlLayer(attrParams.name)
          window.$viewer.addLayer(addPupoLayers[attrParams.name])
          let iconEl = `<div class="marsBlueGradientPnl">
                  <div>${attrParams.fullName}</div>
                  <img src="${attrParams.imageUrl}" width="160" height="160" />
                </div>`
          let divIcon = new DC.DivIcon(
@@ -330,6 +336,7 @@
          addPupoLayers[attrParams.name] = new DC.HtmlLayer(attrParams.name)
          window.$viewer.addLayer(addPupoLayers[attrParams.name])
          let iconEl = `<div class="marsBlueGradientPnl">
                   <div>${attrParams.fullName}</div>
                  <img src="${attrParams.imageUrl}" width="160" height="160" />
                </div>`
          let divIcon = new DC.DivIcon(
@@ -370,6 +377,7 @@
          addPupoLayers[attrParams.name] = new DC.HtmlLayer(attrParams.name)
          window.$viewer.addLayer(addPupoLayers[attrParams.name])
          let iconEl = `<div class="marsBlueGradientPnl">
                  <div>${attrParams.fullName}</div>
                  <img src="${attrParams.imageUrl}" width="160" height="160" />
                </div>`
          let divIcon = new DC.DivIcon(
@@ -410,6 +418,7 @@
          addPupoLayers[attrParams.name] = new DC.HtmlLayer(attrParams.name)
          window.$viewer.addLayer(addPupoLayers[attrParams.name])
          let iconEl = `<div class="marsBlueGradientPnl">
                  <div>${attrParams.fullName}</div>
                  <img src="${attrParams.imageUrl}" width="160" height="160" />
                </div>`
          let divIcon = new DC.DivIcon(
@@ -545,9 +554,9 @@
  }
}

let addTileLayers = {}
let tileLayers = new DC.TilesetLayer('tileLayers')
window.$viewer.addLayer(tileLayers)
window.addTileLayers = {}
window.tileLayers = new DC.TilesetLayer('tileLayers')
window.$viewer.addLayer(window.tileLayers)

const handleCheckChange = (data) => {
  let options = treeRef.value?.getCheckedNodes()
@@ -559,22 +568,40 @@

      //  const Cesium  = DC
      if (item.subType == '3Dtile') {
        if (!addTileLayers[item.layerName]) {
          addTileLayers[item.layerName] = item.urlData.map(i => {
            let tile = new DC.Tileset(i.url)
        if (!window.addTileLayers[item.layerName]) {
          // window.addTileLayers[item.layerName] = []
          // let tile = window.$viewer.delegate.scene.primitives.add(new Cesium.Cesium3DTileset({
          //   url: '/zhyq/mx/tile_01/tileset.json',
          // }))

            tileLayers.addOverlay(tile)
          // console.log(tile, new Cesium.Cesium3DTileset({
          //   url: '/zhyq/mx/tile_01/tileset.json',
          // }), 121323)
          // item.urlData.forEach(i => {

          // })



          window.addTileLayers[item.layerName] = item.urlData.map(i => {
            let tile = new DC.Tileset(i.url, {
              maximumMemoryUsage: 1024 * 1024 * 1024,
              maximumScreenSpaceError: 48,
              skipLevels: 5,
              skipLevelOfDetail: true,
              skipScreenSpaceErrorFactor: 128
            })

            window.tileLayers.addOverlay(tile)
            return tile
          })

        } else {
          addTileLayers[item.layerName].forEach(i => i.show = true)
          window.addTileLayers[item.layerName].forEach(i => i.show = true)
        }
        window.$viewer.flyTo(addTileLayers[item.layerName][0])
      } else if (item.subType == 'labelPoint') {
        if (!addTileLayers[item.layerName]) {
          addTileLayers[item.layerName] = new DC.HtmlLayer(item.layerName)
          window.$viewer.addLayer(addTileLayers[item.layerName])
        if (!window.addTileLayers[item.layerName]) {
          window.addTileLayers[item.layerName] = new DC.HtmlLayer(item.layerName)
          window.$viewer.addLayer(window.addTileLayers[item.layerName])

          item.method(item.params).then(res => {
            let data = res.data.data.records
@@ -613,16 +640,16 @@

              divIcon.on(DC.MouseEventType.CLICK, incident)

              addTileLayers[item.layerName].addOverlay(divIcon)
              window.addTileLayers[item.layerName].addOverlay(divIcon)
            })
          })
        } else {
          addTileLayers[item.layerName].show = true
          window.addTileLayers[item.layerName].show = true
        }
      } else if (item.subType == 'geojsonWall') {
        if (!addTileLayers[item.layerName]) {
          addTileLayers[item.layerName] = new DC.VectorLayer(item.layerName)
          window.$viewer.addLayer(addTileLayers[item.layerName])
        if (!window.addTileLayers[item.layerName]) {
          window.addTileLayers[item.layerName] = new DC.VectorLayer(item.layerName)
          window.$viewer.addLayer(window.addTileLayers[item.layerName])

          item.source.features.forEach(i => {
            let wall = new DC.Wall(
@@ -632,20 +659,22 @@
            wall.setStyle({
              material: new DC.WallTrailMaterialProperty({
                color: Cesium.Color.fromBytes(0, 123, 255, 180),
                speed: 10
                speed: 8
              })
            })
            addTileLayers[item.layerName].addOverlay(wall)
            window.addTileLayers[item.layerName].addOverlay(wall)
          })
        } else {
          addTileLayers[item.layerName].show = true
          window.addTileLayers[item.layerName].show = true
        }
        window.$viewer.flyTo(addTileLayers[item.layerName])
        console.log(addTileLayers[item.layerName], "22222222222222222222222222222222")
      } else if (item.subType == 'geojsonPipe') {
        if (!addTileLayers[item.layerName]) {
          addTileLayers[item.layerName] = new DC.VectorLayer(item.layerName)
          window.$viewer.addLayer(addTileLayers[item.layerName])
        if (!window.addTileLayers[item.layerName]) {
          window.addTileLayers[item.layerName] = new DC.VectorLayer(item.layerName)
          window.$viewer.addLayer(window.addTileLayers[item.layerName])

          function computeCircle(radius) {
          function computeCircle (radius) {
            var positions = []
            for (var i = 0; i < 360; i++) {
              var radians = DC.Math.toRadians(i)
@@ -666,29 +695,29 @@
            polylineVolume.setStyle({
              material: item.color
            })
            addTileLayers[item.layerName].addOverlay(polylineVolume)
            window.addTileLayers[item.layerName].addOverlay(polylineVolume)
          })
        } else {
          addTileLayers[item.layerName].show = true
          window.addTileLayers[item.layerName].show = true
        }
      }
    } else {
      if (addTileLayers[item.layerName]) {
      if (window.addTileLayers[item.layerName]) {
        if (item.subType == '3Dtile') {
          addTileLayers[item.layerName].forEach(i => i.show = false)
          window.addTileLayers[item.layerName].forEach(i => i.show = false)
        } else if (item.subType == 'labelPoint') {
          addTileLayers[item.layerName].show = false
          window.addTileLayers[item.layerName].show = false
        } else if (item.subType == 'geojsonWall') {
          addTileLayers[item.layerName].show = false
          window.addTileLayers[item.layerName].show = false
        } else if (item.subType == 'geojsonPipe') {
          addTileLayers[item.layerName].show = false
          window.addTileLayers[item.layerName].show = false
        }
      }
    }
  })
}

function findObjectById(data, id) {
function findObjectById (data, id) {
  // 遍历数据数组
  for (let i = 0; i < data.length; i++) {
    const item = data[i]
@@ -747,7 +776,7 @@
// });

// 销毁
function destroy() {
function destroy () {
  let arr = Object.keys(addPupoLayers)
  arr.filter(i => i != 'hgyq').forEach(i => {
    addPupoLayers[i] && window.$viewer.removeLayer(addPupoLayers[i])
@@ -756,10 +785,11 @@
}

onUnmounted(() => {
  tileLayers && window.$viewer.removeLayer(tileLayers)
  let arr = Object.keys(addTileLayers)
  window.tileLayers && window.$viewer.removeLayer(window.tileLayers)
  delete window.tileLayers
  let arr = Object.keys(window.addTileLayers)
  arr.filter(i => i != 'hgyq').forEach(i => {
    addTileLayers[i] && window.$viewer.removeLayer(addTileLayers[i])
    addTileLwindow.addTileLayersayers[i] && window.$viewer.removeLayer(window.addTileLayers[i])
  })
  // 弹窗销毁
  destroy()