月球大数据地理空间分析展示平台-【前端】-月球2期前端
surprise
2023-10-17 25ad6779e118f2f01e9cda45c67f7b27d55a984a
src/components/mouseMove.vue
@@ -25,6 +25,8 @@
</template>
<script lang="ts" setup>
import InitMap from "@/assets/js/Map";
import server from "@/assets/js/Map/server";
import {
  ref,
  onMounted,
@@ -86,6 +88,7 @@
    let camera_alt = (Viewer.camera.positionCartographic.height / 1000).toFixed(
      2
    );
    alt.value = camera_alt;
    let scene = window.Viewer.scene;
    // 获取画布的大小
@@ -104,37 +107,42 @@
    if (!Cesium.defined(leftPosition) || !Cesium.defined(rightPosition)) {
      return;
    }
    var ellipsoid = SmartEarth.Cesium.Ellipsoid.MOON200;
    var leftCartographic =
      globe.ellipsoid.cartesianToCartographic(leftPosition);
    var rightCartographic =
      globe.ellipsoid.cartesianToCartographic(rightPosition);
    var geodesic = new SmartEarth.Cesium.EllipsoidGeodesic();
    geodesic.setEndPoints(leftCartographic, rightCartographic);
    rate.value = geodesic.surfaceDistance.toFixed(2); //分辨率
    geodesic.setEndPoints(leftCartographic, rightCartographic, ellipsoid);
    // rate.value = geodesic.surfaceDistance.toFixed(2); //分辨率
  });
   Viewer.scene.postRender.addEventListener(() => {
      // // 获取画布的大小
      let scene = earthCtrl.Viewer.scene;
      var width = scene.canvas.clientWidth;
      var height = scene.canvas.clientHeight;
      //获取画布中心两个像素的坐标(默认地图渲染在画布中心位置)
      var left = scene.camera.getPickRay(new SmartEarth.Cesium.Cartesian2((width / 2) | 0, (height - 1) / 2));
      var right = scene.camera.getPickRay(new SmartEarth.Cesium.Cartesian2(1 + (width / 2) | 0, (height - 1) / 2));
      var leftPosition = scene.globe.pick(left, scene);
      var rightPosition = scene.globe.pick(right, scene);
      if (!SmartEarth.Cesium.defined(leftPosition) || !SmartEarth.Cesium.defined(rightPosition)) {
        return;
      }
      const ellipsoid = SmartEarth.Cesium.Ellipsoid.MOON2000
      var leftCartographic = ellipsoid.cartesianToCartographic(leftPosition);
      var rightCartographic = ellipsoid.cartesianToCartographic(rightPosition);
      var geodesic = new SmartEarth.Cesium.EllipsoidGeodesic(leftCartographic, rightCartographic, ellipsoid);
      var distance = geodesic.surfaceDistance;// 分辨率
      rate.value =distance.toFixed(2); //分辨率
    })
};
const gridSwitch = () => {
  if (!window.graticules) {
    window.graticules = new SmartEarth.Cesium.Graticules(
      earthCtrl.Viewer,
      SmartEarth.Cesium.Color.PALEGREEN
    );
    earthCtrl.Viewer.scene.preUpdate.addEventListener(function () {
      window.graticules.update();
    });
  } else {
    window.graticules._enable = false;
  }
  // window.earthCtrl.wireframe = !window.earthCtrl.wireframe;
  // gridIsshow.value = !gridIsshow.value;
  // if (gridIsshow.value) {
  //   grid(10);
  //   // getHeight();
  //   // createPrimitives();
  // } else {
  //   gridDel();
  // }
  server.showlonlatLine();
};
const getHeight = () => {
  let removeListener = Viewer.camera.changed.addEventListener(() => {
@@ -165,36 +173,6 @@
  return levelArray.length - 1;
};
const createPrimitives = (degree) => {
  // let ps = [];
  // for (let longitude = -180; longitude <= 180; longitude += 10) {
  //   ps.push(
  //     Cesium.Cartesian3.fromDegreesArray([
  //       longitude,
  //       -90,
  //       longitude,
  //       0,
  //       longitude,
  //       90,
  //     ])
  //   );
  // }
  // let polylineGeometry = new Cesium.PolylineGeometry({
  //   positions: ps,
  //   width: 5,
  //   id: "polylineGeometry",
  // });
  // Viewer.scene.primitives.add(
  //   new Cesium.Primitive({
  //     geometryInstances: new Cesium.GeometryInstance({
  //       geometry: polylineGeometry,
  //     }),
  //     // vertexFormat: Cesium.PolylineColorAppearance.VERTEX_FORMAT,
  //     appearance: new Cesium.EllipsoidSurfaceAppearance({
  //       material: Cesium.Material.fromType("Stripe"),
  //     }),
  //   })
  // );
  var GridImagery = new Cesium.GridImageryProvider();
  var imageryLayers = Viewer.imageryLayers;
  var GridImageryLayer = imageryLayers.addImageryProvider(GridImagery); // 添加网格图层