飞行器图片

lixuliang

2024-04-19 95d1e83afa65f1d52eaabc4fe58374cd4edbc9c5

 src/components/viewer.vue

@@ -1,5 +1,9 @@
<template>
  <div>
    <div class="imgbox" v-if="showFlyimg">
      <img src="../assets/image/feixingqi.png" alt="" />
    </div>

    <div id="app1"></div>
  </div>
</template>
@@ -22,7 +26,9 @@
export default {
  name: "App",
  data () {
    return {};
    return {
      showFlyimg: false,
    };
  },
  methods: {
    init () {
@@ -61,6 +67,7 @@
          window.Viewer=webgis.Viewer;
          window.viewer=webgis.Viewer;
          window.Cesium=Cesium;
          let that = this;

          window.layers=window.sgworld.Viewer.scene.imageryLayers;
          // const blackMarble = layers.addImageryProvider(
@@ -95,6 +102,34 @@
              heading: 1.249372341578318,
              pitch: -0.7222154573481174,
              roll: 0,
            },
            complete: function callback() {
              viewer.camera.changed.addEventListener(() => {
                // 视高 km
                let alt = (
                  viewer.camera.positionCartographic.height / 1000
                ).toFixed(2);
                // 方位角
                let heading = Cesium.Math.toDegrees(
                  viewer.camera.heading
                ).toFixed(2);
                // 俯仰角
                let pitch = Cesium.Math.toDegrees(viewer.camera.pitch).toFixed(
                  2
                );
                // 翻滚角
                let roll = Cesium.Math.toDegrees(viewer.camera.roll).toFixed(2);
                // 级别
                let level = 0;
                let tileRender = viewer.scene._globe._surface._tilesToRender;
                if (tileRender && tileRender.length > 0) {
                  level = viewer.scene._globe._surface._tilesToRender[0]._level;
                }
                // let str = `级数：${level} 视高：${alt}km  方位角：${heading}° 俯仰角：${pitch}° 翻滚角：${roll}°`;
                console.log(pitch);
                that.showFlyimg = pitch > -25 ? true : false;
                // console.log(that.showFlyimg);
              });
            },
          });
          let urldian1=
@@ -139,28 +174,7 @@
            }
          });
          // window.Viewer.shadows = false;
          viewer.camera.changed.addEventListener(() => {
            // 视高 km
            let alt = (
              viewer.camera.positionCartographic.height / 1000
            ).toFixed(2);
            // 方位角
            let heading = Cesium.Math.toDegrees(viewer.camera.heading).toFixed(
              2
            );
            // 俯仰角
            let pitch = Cesium.Math.toDegrees(viewer.camera.pitch).toFixed(2);
            // 翻滚角
            let roll = Cesium.Math.toDegrees(viewer.camera.roll).toFixed(2);
            // 级别
            let level = 0;
            let tileRender = viewer.scene._globe._surface._tilesToRender;
            if (tileRender && tileRender.length > 0) {
              level = viewer.scene._globe._surface._tilesToRender[0]._level;
            }
            let str = `级数：${level} 视高：${alt}km  方位角：${heading}° 俯仰角：${pitch}° 翻滚角：${roll}°`;
            console.log(str);
          });

          //深度检测
          window.Sgworld.Analysis.depthTestAgainstTerrain(true);
          /*
@@ -309,6 +323,19 @@
</script>

<style>
.imgbox {
  position: absolute;
  /* background-color: #fff; */
  /* opacity: 0.2;. */
  /* top:50px; */
  width: 100%;
  height: 500px;
}
img {
  width: 100%;
  height: 100%;
  -webkit-user-drag: none;
}
#app1 {
  font-family: "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;