sdk版本更新，图层管理加载图层优化；空间查询图形下载优化

Surpriseplus

2023-08-31 c4ffe86a182a3a4fe1bbf00fe57e281a42fb2eeb

 src/components/mouseMove.vue

@@ -1,5 +1,8 @@
<template>
  <div class="mouseBox" @setMouseMove="setMouseMove">
  <div
    class="mouseBox"
    @setMouseMove="setMouseMove"
  >
    <div
      class="earthImage"
      :class="{ active: gridIsshow }"
@@ -9,6 +12,12 @@
    <div class="earthLable">{{ longitude }}</div>
    <div class="earthLable">纬度 :</div>
    <div class="earthLable">{{ latitude }}</div>
    <div class="earthLable">地形高度 :</div>
    <div class="earthLable">{{ altHeight }} </div>
    <div class="earthLable">米</div>
    <div class="earthLable">视角高度 :</div>
    <div class="earthLable">{{ alt }} </div>
    <div class="earthLable">千米</div>
    <div class="earthLable">分辨率 :</div>
    <div class="earthLable">{{ rate }}</div>
    <div class="earthLable">m/px</div>
@@ -27,6 +36,9 @@
const longitude = ref("0.00");
const latitude = ref("0.00");
const rate = ref("0.00");
const alt = ref("0.00");
const altHeight = ref("0.00");

let entitiesObj = reactive({
  lonLine: [],
  latLine: [],
@@ -60,45 +72,69 @@
      latitude.value = SmartEarth.Cesium.Math.toDegrees(
        cartographic.latitude
      ).toFixed(6);
      let scene = window.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)
      altHeight.value = window.Viewer.scene.globe.getHeight(
        Cesium.Cartographic.fromDegrees(longitude.value, latitude.value, 0)
      );
      var right = scene.camera.getPickRay(
        new SmartEarth.Cesium.Cartesian2((1 + width / 2) | 0, (height - 1) / 2)
      );

      var globe = scene.globe;
      var leftPosition = globe.pick(left, scene);
      var rightPosition = globe.pick(right, scene);

      if (!Cesium.defined(leftPosition) || !Cesium.defined(rightPosition)) {
        return;
      if (altHeight.value) {
        altHeight.value = altHeight.value.toFixed(2);
      }

      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(6); //分辨率
    }
  }, SmartEarth.Cesium.ScreenSpaceEventType.MOUSE_MOVE);

  Viewer.camera.changed.addEventListener(() => {
    // 视高 km
    let camera_alt = (Viewer.camera.positionCartographic.height / 1000).toFixed(
      2
    );
    alt.value = camera_alt;
    let scene = window.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 globe = scene.globe;
    var leftPosition = globe.pick(left, scene);
    var rightPosition = globe.pick(right, scene);
    if (!Cesium.defined(leftPosition) || !Cesium.defined(rightPosition)) {
      return;
    }
    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); //分辨率
  });
};
const gridSwitch = () => {
  gridIsshow.value = !gridIsshow.value;
  if (gridIsshow.value) {
    grid(10);
    // getHeight();
    // createPrimitives();
  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 {
    gridDel();
    window.graticules._enable = false;
  }
  // window.earthCtrl.wireframe = !window.earthCtrl.wireframe;
  // gridIsshow.value = !gridIsshow.value;
  // if (gridIsshow.value) {
  //   grid(10);
  //   // getHeight();
  //   // createPrimitives();
  // } else {
  //   gridDel();
  // }
};
const getHeight = () => {
  let removeListener = Viewer.camera.changed.addEventListener(() => {
@@ -292,10 +328,11 @@

  left: 128px;
  bottom: 20px;
  width: 596px;

  position: absolute;
  z-index: 30;
  padding-left: 10px;
  padding-right: 20px;
  display: flex;
  align-items: center;
  .earthImage {