管道基础大数据平台系统开发-【前端】-新系統界面
王旭
2023-02-20 198b83ce825fbbf912cb26d592e3c7b0b586ca92
src/components/Screen/mapsdk.vue
@@ -1,16 +1,15 @@
<template>
  <div  class="ParentCentermapdiv">
  <div class="ParentCentermapdiv">
    <div id="Centermapdiv"></div>
  </div>
</template>
<script>
export default {
  name: "",
  components: {},
  data() {
    return{}
    return {}
  },
  mounted() {
    this.init3DMap()
@@ -22,13 +21,121 @@
        licenseServer: window.sceneConfig.licenseServer,
      })
      window.Viewer = window.sgworld._Viewer
      window.viewer = window.Viewer = window.sgworld._Viewer
      Viewer.imageryLayers._layers[0].show = false
      //定位
      Viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(110, 33, 25000000),
      // Viewer.camera.flyTo({
      //   destination: Cesium.Cartesian3.fromDegrees(110, 33, 25000000),
      // })
      // Viewer.camera.flyTo({
      //   destination: {
      //     x: -10834926.182758586,
      //     y: 50483318.61217012,
      //     z: 38375099.7193183,
      //   },
      //   orientation: {
      //     heading: 6.283185307179578,
      //     roll: 0,
      //     pitch: -1.56436861046299,
      //   },
      // })
      //开启 tick61.2
      });
      // Cesium.Camera.DEFAULT_VIEW_RECTANGLE = {
      //   west: -3.141592653589793,
      //   south: -1.5707963267948966,
      //   east: 3.141592653589793,
      //   north: 1.5707963267948966,
      // }
      viewer.clock.shouldAnimate = true
      //每次旋转的弧度 越小越慢
      var angle = Cesium.Math.toRadians(Math.PI * 1)
      // 旋转次数 用来控制停止
      var rotate_num = 0
      function onTickCallback() {
        viewer.scene.camera.rotate(Cesium.Cartesian3.UNIT_Z, angle)
        //以下用来控制 停止
        rotate_num++
        // 110 次旋转一周
        if (rotate_num == 1) {
          Viewer.camera.flyTo({
            destination: {
              x: -2395735.480669514,
              y: 35646557.30966785,
              z: 33320031.01620178,
            },
            orientation: {
              heading: 6.283185307179578,
              roll: 0,
              pitch: -1.5687480368906144,
            },
          })
        }
        if (rotate_num == 220) {
          Viewer.camera.flyTo({
            destination: {
              x: -4022999.313498903,
              y: 19214082.70976515,
              z: 13043510.373621361,
            },
            orientation: {
              heading: 6.283185307179577,
              roll: 0,
              pitch: -1.5643686104630592,
            },
          })
        }
        if (rotate_num === 330) {
          //结束旋转
          viewer.clock.onTick.removeEventListener(onTickCallback)
          //可以再接定位动画
          Viewer.camera.flyTo({
            destination: {
              x: -3919623.6069864673,
              y: 13752070.475126158,
              z: 8307291.863719194,
            },
            orientation: {
              heading: 6.283185307179582,
              roll: 0,
              pitch: -1.5707039123519846,
            },
          })
        }
      }
      // 利用时钟进行监听
      viewer.clock.onTick.addEventListener(onTickCallback)
      // setTimeout(() => {
      //   Viewer.camera.flyTo({
      //     destination: {
      //       x: -4022999.313498903,
      //       y: 19214082.70976515,
      //       z: 13043510.373621361,
      //     },
      //     orientation: {
      //       heading: 6.283185307179577,
      //       roll: 0,
      //       pitch: -1.5643686104630592,
      //     },
      //   })
      // }, 1000)
      // setTimeout(() => {
      //   Viewer.camera.flyTo({
      //     destination: {
      //       x: -3919623.6069864673,
      //       y: 13752070.475126158,
      //       z: 8307291.863719194,
      //     },
      //     orientation: {
      //       heading: 6.283185307179582,
      //       roll: 0,
      //       pitch: -1.5707039123519846,
      //     },
      //   })
      // }, 1000)
      Viewer.imageryLayers.addImageryProvider(
        new Cesium.UrlTemplateImageryProvider({
          url: gaoDeBaseUrl[0].url,
@@ -46,8 +153,6 @@
        })
      )
      Viewer._enableInfoOrSelection = false
      //显示fps
      Viewer.scene.debugShowFramesPerSecond = false
@@ -58,7 +163,6 @@
      //开启深度检测
      sgworld.Analysis.depthTestAgainstTerrain(true)
      Viewer.terrainProvider = new Cesium.CesiumTerrainProvider({
        url: demLayer,
      })
@@ -66,23 +170,20 @@
      //改变天空颜色为黑色
      Viewer.scene.skyBox.show = false //关闭天空盒,否则会显示天空颜色
      //背景透明
      Viewer.scene.backgroundColor = new Cesium.Color(0.0, 0.0, 0.0, 0.0);
      Viewer.scene.backgroundColor = new Cesium.Color(0.0, 0.0, 0.0, 0.0)
    },
  }
  },
}
</script>
<style scoped lang="scss">
.ParentCentermapdiv{
.ParentCentermapdiv {
  display: fixed;
  height: 100%;
    width: 100%;
  width: 100%;
}
  #Centermapdiv{
    height: 100%;
    width: 100%;
  }
#Centermapdiv {
  height: 100%;
  width: 100%;
}
</style>