分屏对比，等高线，坡度图，坐标定位功能添加

Surpriseplus

2023-07-13 f6dd93cb0d1b0fe17674e948f0daf6ceb792bb55

 src/assets/js/Map/menuTool.js

@@ -1,6 +1,7 @@
import * as turf from "@turf/turf";
import WKT from 'terraformer-wkt-parser'

import rightServer from "./rightServer";
import config from "./config";
import CryptoJS from 'crypto-js';

const menuTool = {
@@ -9,6 +10,7 @@
  oldLeftMenuId: null,

  squareOjb: [],
  localPoint: null,
  colorAll: {
    point: SmartEarth.Cesium.Color.fromCssColorString("#ff0000"),
    polyline: SmartEarth.Cesium.Color.fromCssColorString("#ffff0050"),
@@ -51,8 +53,10 @@
        this.createSimpleGraphic("polygon");
        break;
      case "d2"://等高线分析
        this.setcontour();
        break
      case "d3"://坡度分析
        this.setSlopeMap();
        break
      case "d4": //土方量计算
        this.Volumetric();
@@ -70,6 +74,92 @@
        this.Coordposition();
        break;
    }
  },
  setLocalPosition(res) {
    if (this.localPoint) {
      this.setLocalPositionClose();
    }
    var position = { X: parseFloat(res.lon), Y: parseFloat(res.lat), Altitude: parseFloat(res.alt) };
    this.localPoint = window.sgworld.Creator.CreateImageLabel(
      position,
      config.StaticFileBaseUrl + "/Workers/image/mark.png",
      {},
      0,
      "标签点"
    );
    var id = this.localPoint.item.id;
    window.sgworld.Navigate.flyToObj(this.localPoint.item);
  },
  setLocalPositionClose() {
    this.localPoint.deleteObject();
    this.localPoint = null;
  },
  //坡度分析
  setSlopeMap() {
    const globe = Viewer.scene.globe;
    if (window.material) {
      window.material = null;
      globe.material = null;
      Viewer.scene.globe.enableLighting = false;
      return
    }
    Viewer.scene.globe.enableLighting = true;
    let shadingUniforms = {};
    window.material = Cesium.Material.fromType("ElevationRamp");
    shadingUniforms = material.uniforms;
    shadingUniforms.minimumHeight = -10000;
    shadingUniforms.maximumHeight = 10000;

    shadingUniforms.image = this.getColorRamp();

    globe.material = material;
  },
  getColorRamp() {
    const ramp = document.createElement("canvas");
    ramp.width = 100;
    ramp.height = 1;
    const ctx = ramp.getContext("2d");
    let values = [0, 0.083, 0.166, 0.25, 0.333, 0.416, 0.5, 0.583, 0.666, 0.75, 0.833, 0.916, 0.999, 1];
    const grd = ctx.createLinearGradient(0, 0, 100, 0);
    grd.addColorStop(values[0], "rgb(56,168,0)"); //black
    grd.addColorStop(values[1], "rgb(77,179,0)"); //blue
    grd.addColorStop(values[2], "rgb(102,191,0)"); //pink
    grd.addColorStop(values[3], "rgb(126,204,0)"); //red
    grd.addColorStop(values[4], "rgb(155,217,0)"); //orange
    grd.addColorStop(values[5], "rgb(187,230,0)"); //yellow
    grd.addColorStop(values[6], "rgb(222,242,0)"); //white
    grd.addColorStop(values[7], "rgb(255,255,0)"); //white
    grd.addColorStop(values[8], "rgb(255,221,0)"); //white
    grd.addColorStop(values[9], "rgb(255,183,0)"); //white
    grd.addColorStop(values[10], "rgb(255,145,0)"); //white
    grd.addColorStop(values[11], "rgb(255,111,0)"); //white
    grd.addColorStop(values[12], "rgb(255,72,0)"); //white
    grd.addColorStop(values[13], "rgb(255,38,0)"); //white

    ctx.fillStyle = grd;
    ctx.fillRect(0, 0, 100, 1);

    return ramp;
  },

  //等高线
  setcontour() {
    var globe = window.Viewer.scene.globe;
    if (window.material) {
      window.material = null;
      globe.material = null
      return
    }

    var contourColor = new SmartEarth.Cesium.Color(117 / 255, 71 / 255, 18 / 255, 255 / 255);
    var contourUniforms = {};
    window.material = Cesium.Material.fromType('ElevationContour');
    contourUniforms = material.uniforms;
    contourUniforms.width = 1.0;
    contourUniforms.spacing = 100.0;
    contourUniforms.color = contourColor;
    globe.material = window.material;

  },
  //空间查询
  spatialQuery() {
@@ -263,13 +353,37 @@
  },

  //坐标定位
  Coordposition() { },
  Coordposition() {
    window.functionForJs({
      type: 'coordLocation',
      value: true
    })
  },
  //影像对比
  CurtainContrast() {
    this.toolMenu = earthCtrl.analysis.createCurtainContrast({
      leftIndex: 0,
      rightIndex: 1,
    if (window.DoubleScreen) {
      window.DoubleScreen && window.DoubleScreen.destroy();
      window.DoubleScreen = null;
      const compass = document.getElementsByClassName("bottom_btn")[0];
      compass.style.right = "70px";
      return
    }
    window.DoubleScreen = new SmartEarth.DoubleScreen(window.sgworld, {}, SmartEarth);
    DoubleScreen.right._Viewer.imageryLayers.removeAll()
    var terrain = new Cesium.CesiumTerrainProvider({
      url: config.moonTerrain,
      tilingScheme: new Cesium.GeographicTilingScheme({
        ellipsoid: Cesium.Ellipsoid.MOON,
      }),

    });
    DoubleScreen.right._Viewer.terrainProvider = terrain;
    rightServer.AddWmtesLayer(config.moonWmts)

    const compass = document.getElementsByClassName("bottom_btn")[0];
    compass.style.right = "calc(50% + 70px)";


  },
  //土方量计算
  Volumetric() {
@@ -330,42 +444,65 @@
  },
  //清除按钮
  clearALL(id) {
    debugger
    id.value.forEach((e) => {
      this.clearTopTools(e);
    });

    this.clearTopTools()
    // id.value.forEach((e) => {

    // });
  },
  //清除方法
  clearTopTools(id) {
    if (id) {
      switch (id) {
        case "a2":
          break;
        case "a3":
          break;
        case "b2"://距离测量
        case "b3"://面积测量
        case "b4"://高程测量
        case "b5"://高度测量
          sgworld.Analysis.clearMeasure()
          break;
        case "c2": //点
        case "c3": //文字
        case "c4": //线
        case "c5": //矩形
        case "c6": //多边形
          sgworld.Creator.SimpleGraphic.clear();
          break;
        case "d5":
          this.toolMenu.removeFromMap();
          break;
        case 'f1':
          sgworld.Creator.SimpleGraphic.clear();
          break;
      }
      // this.toolFlag = null;
      this.toolMenu = null;
    // if (id) {
    // switch (id) {
    //   case "a2":
    //     break;
    //   case "a3":
    //     break;
    //   case "b2"://距离测量
    //   case "b3"://面积测量
    //   case "b4"://高程测量
    //   case "b5"://高度测量

    //     break;
    //   case "c2": //点
    //   case "c3": //文字
    //   case "c4": //线
    //   case "c5": //矩形
    //   case "c6": //多边形

    //     break;
    //   case "d5":

    //     break;
    //   case 'f1':

    //     break;
    // }
    if (this.localPoint) {

      this.localPoint.deleteObject();
      this.localPoint = null;
    }
    const globe = Viewer.scene.globe;
    if (window.material) {
      window.material = null;
      globe.material = null;
      Viewer.scene.globe.enableLighting = false;
      return
    }
    if (window.DoubleScreen) {
      window.DoubleScreen && window.DoubleScreen.destroy();
      window.DoubleScreen = null;
      const compass = document.getElementsByClassName("bottom_btn")[0];
      compass.style.right = "70px";
    }
    sgworld.Analysis.clearMeasure()
    sgworld.Creator.SimpleGraphic.clear();
    this.toolMenu.removeFromMap();
    sgworld.Creator.SimpleGraphic.clear();
    // this.toolFlag = null;
    this.toolMenu = null;
    // }
  },
  clearLeftTools(res) { },
};