maxx0329 1 өдөр өмнө
parent
commit
038fd1f74a
1 өөрчлөгдсөн 271 нэмэгдсэн , 205 устгасан
  1. 271 205
      src/utils/MapHelper/map.js

+ 271 - 205
src/utils/MapHelper/map.js

@@ -1,242 +1,308 @@
 let rollerShutterConfig;
-let setstore = true
+let setstore = true;
 export function initroller() {
-    if (rollerShutterConfig) {
-        return;
-    }
-    let windowWidth = document.body.clientWidth; // 窗口宽度
-    let windowHeight = document.body.clientHeight; // 窗口高度
-    // 卷帘配置参数,以对象方式实现地址传递
-    rollerShutterConfig = {
-        splitDirection: Cesium.SplitDirection.NONE,
-        verticalSplitPosition: windowWidth / 2,
-        horizontalSplitPosition: windowHeight / 2,
-    };
-    if (!document.getElementById("verticalSlider")) {
-        let f = document.getElementById("cesiumContainer");
-        let v = document.createElement("div");
-        let h = document.createElement("div");
-        v.classList.add("verticalSlider");
-        v.id = "verticalSlider";
-        h.id = "horizontalSlider";
-        v.style.display = "none";
-        h.style.display = "none";
-        f.appendChild(v);
-        f.appendChild(h);
-    }
-    setRollerShutterSplit();
-    bindSliderEvt();
+  if (rollerShutterConfig) {
+    return;
+  }
+  let windowWidth = document.body.clientWidth; // 窗口宽度
+  let windowHeight = document.body.clientHeight; // 窗口高度
+  // 卷帘配置参数,以对象方式实现地址传递
+  rollerShutterConfig = {
+    splitDirection: Cesium.SplitDirection.NONE,
+    verticalSplitPosition: windowWidth / 2,
+    horizontalSplitPosition: windowHeight / 2
+  };
+  if (!document.getElementById("verticalSlider")) {
+    let f = document.getElementById("cesiumContainer");
+    let v = document.createElement("div");
+    let h = document.createElement("div");
+    v.classList.add("verticalSlider");
+    v.id = "verticalSlider";
+    h.id = "horizontalSlider";
+    v.style.display = "none";
+    h.style.display = "none";
+    f.appendChild(v);
+    f.appendChild(h);
+  }
+  setRollerShutterSplit();
+  bindSliderEvt();
 }
 export function setImageryRollerMode() {
-    setstore && store.setrollerType(rollerShutterConfig.splitDirection);
-    // let imageryLayers = viewer.imageryLayers;
-    // for (let i = 0; i < imageryLayers.length; i++) {
-    //   let imageryLayer = imageryLayers.get(i);
-    //   if (this.imageryRoller) this.setImageryRoller(imageryLayer)
-    //   else this.hideImageryRoller(imageryLayer)
-    // }
+  setstore && store.setrollerType(rollerShutterConfig.splitDirection);
+  // let imageryLayers = viewer.imageryLayers;
+  // for (let i = 0; i < imageryLayers.length; i++) {
+  //   let imageryLayer = imageryLayers.get(i);
+  //   if (this.imageryRoller) this.setImageryRoller(imageryLayer)
+  //   else this.hideImageryRoller(imageryLayer)
+  // }
 
-    //案例展示
-    // let imageryLayer = viewer.imageryLayers.get(1);
-    // if (this.imageryRoller) setImageryRoller(imageryLayer);
-    // else hideImageryRoller(imageryLayer);
+  //案例展示
+  // let imageryLayer = viewer.imageryLayers.get(1);
+  // if (this.imageryRoller) setImageryRoller(imageryLayer);
+  // else hideImageryRoller(imageryLayer);
 }
 
 export function setImageryRoller(imageryLayer, layersplit) {
-    // console.log("-splitDirection--", rollerShutterConfig.splitDirection)
-    let direction = layersplit ? layersplit : rollerShutterConfig.splitDirection
-    switch (direction) {
-        case Cesium.SplitDirection.LEFT://1
-            imageryLayer.splitDirection = new Cesium.Cartesian2(
-                Cesium.ImagerySplitDirection.RIGHT,
-                Cesium.ImagerySplitDirection.NONE
-            );
-            break;
-        case Cesium.SplitDirection.RIGHT://2
-            imageryLayer.splitDirection = new Cesium.Cartesian2(
-                Cesium.ImagerySplitDirection.LEFT,
-                Cesium.ImagerySplitDirection.NONE
-            );
-            break;
-        case Cesium.SplitDirection.TOP://-1
-            imageryLayer.splitDirection = new Cesium.Cartesian2(
-                Cesium.ImagerySplitDirection.NONE,
-                Cesium.ImagerySplitDirection.BOTTOM
-            );
-            break;
-        case Cesium.SplitDirection.BOTTOM://-2
-            imageryLayer.splitDirection = new Cesium.Cartesian2(
-                Cesium.ImagerySplitDirection.NONE,
-                Cesium.ImagerySplitDirection.TOP
-            );
-            break;
-        default:
-            imageryLayer.splitDirection = new Cesium.Cartesian2(
-                Cesium.ImagerySplitDirection.NONE,
-                Cesium.ImagerySplitDirection.NONE
-            );
-            break;
-    }
-}
-export function hideImageryRoller(imageryLayer) {
-    imageryLayer.splitDirection = new Cesium.Cartesian2(
+  // console.log("-splitDirection--", rollerShutterConfig.splitDirection)
+  let direction = layersplit ? layersplit : rollerShutterConfig.splitDirection;
+  switch (direction) {
+    case Cesium.SplitDirection.LEFT: //1
+      imageryLayer.splitDirection = new Cesium.Cartesian2(
+        Cesium.ImagerySplitDirection.RIGHT,
+        Cesium.ImagerySplitDirection.NONE
+      );
+      break;
+    case Cesium.SplitDirection.RIGHT: //2
+      imageryLayer.splitDirection = new Cesium.Cartesian2(
+        Cesium.ImagerySplitDirection.LEFT,
+        Cesium.ImagerySplitDirection.NONE
+      );
+      break;
+    case Cesium.SplitDirection.TOP: //-1
+      imageryLayer.splitDirection = new Cesium.Cartesian2(
+        Cesium.ImagerySplitDirection.NONE,
+        Cesium.ImagerySplitDirection.BOTTOM
+      );
+      break;
+    case Cesium.SplitDirection.BOTTOM: //-2
+      imageryLayer.splitDirection = new Cesium.Cartesian2(
+        Cesium.ImagerySplitDirection.NONE,
+        Cesium.ImagerySplitDirection.TOP
+      );
+      break;
+    default:
+      imageryLayer.splitDirection = new Cesium.Cartesian2(
         Cesium.ImagerySplitDirection.NONE,
         Cesium.ImagerySplitDirection.NONE
-    );
+      );
+      break;
+  }
+}
+export function hideImageryRoller(imageryLayer) {
+  imageryLayer.splitDirection = new Cesium.Cartesian2(
+    Cesium.ImagerySplitDirection.NONE,
+    Cesium.ImagerySplitDirection.NONE
+  );
 }
 /**
-     * 注册卷帘分割条的拖拽事件。
-     */
+ * 注册卷帘分割条的拖拽事件。
+ */
 export function bindSliderEvt() {
-    let verticalSlider = document.getElementById("verticalSlider");
-    let horizontalSlider = document.getElementById("horizontalSlider");
-    verticalSlider.addEventListener("mousedown", mouseDown, false);
-    horizontalSlider.addEventListener("mousedown", mouseDown, false);
-    let windowHeight = document.body.clientHeight;
-    let me = this;
-    document.addEventListener("mouseup", mouseUp, false);
+  let verticalSlider = document.getElementById("verticalSlider");
+  let horizontalSlider = document.getElementById("horizontalSlider");
+  verticalSlider.addEventListener("mousedown", mouseDown, false);
+  horizontalSlider.addEventListener("mousedown", mouseDown, false);
+  let windowHeight = document.body.clientHeight;
+  let me = this;
+  document.addEventListener("mouseup", mouseUp, false);
 
-    function mouseUp(e) {
-        document.removeEventListener("mousemove", sliderMove, false);
-    }
+  function mouseUp(e) {
+    document.removeEventListener("mousemove", sliderMove, false);
+  }
 
-    function mouseDown(e) {
-        document.addEventListener("mousemove", sliderMove, false);
-    }
+  function mouseDown(e) {
+    document.addEventListener("mousemove", sliderMove, false);
+  }
 
-    function sliderMove(e) {
-        // 鼠标拖拽时执行
-        // 解决拖拽鼠标粘滞的问题
-        if (e.preventDefault) {
-            e.preventDefault();
-        } else {
-            e.returnValue = false;
-        }
-        if (
-            rollerShutterConfig.splitDirection === Cesium.SplitDirection.LEFT ||
-            rollerShutterConfig.splitDirection === Cesium.SplitDirection.RIGHT
-        ) {
-            verticalSlider.style.left = e.clientX + "px";
-            rollerShutterConfig.verticalSplitPosition = e.clientX;
-        } else if (
-            rollerShutterConfig.splitDirection === Cesium.SplitDirection.TOP ||
-            rollerShutterConfig.splitDirection === Cesium.SplitDirection.BOTTOM
-        ) {
-            let clientY = e.clientY;
-            if (clientY < 0) {
-                clientY = 0;
-            } else if (clientY > windowHeight) {
-                clientY = windowHeight - document.body.clientHeight;
-            }
-            horizontalSlider.style.top = clientY + "px";
-            rollerShutterConfig.horizontalSplitPosition = windowHeight - clientY;
-        }
-        setRollerShutterSplit();
+  function sliderMove(e) {
+    // 鼠标拖拽时执行
+    // 解决拖拽鼠标粘滞的问题
+    if (e.preventDefault) {
+      e.preventDefault();
+    } else {
+      e.returnValue = false;
     }
-}
-
-/**
-    * 设置卷帘的分割方向及分割条的位置。
-    *
-    */
-export function setRollerShutterSplit() {
-    let splitPosition = null;
     if (
-        rollerShutterConfig.splitDirection === Cesium.SplitDirection.LEFT ||
-        rollerShutterConfig.splitDirection === Cesium.SplitDirection.RIGHT
+      rollerShutterConfig.splitDirection === Cesium.SplitDirection.LEFT ||
+      rollerShutterConfig.splitDirection === Cesium.SplitDirection.RIGHT
     ) {
-        splitPosition = rollerShutterConfig.verticalSplitPosition;
-        viewer.scene.imagerySplitPosition.x =
-            rollerShutterConfig.verticalSplitPosition / document.body.clientWidth;
+      verticalSlider.style.left = e.clientX + "px";
+      rollerShutterConfig.verticalSplitPosition = e.clientX;
     } else if (
-        rollerShutterConfig.splitDirection === Cesium.SplitDirection.TOP ||
-        rollerShutterConfig.splitDirection === Cesium.SplitDirection.BOTTOM
+      rollerShutterConfig.splitDirection === Cesium.SplitDirection.TOP ||
+      rollerShutterConfig.splitDirection === Cesium.SplitDirection.BOTTOM
     ) {
-        splitPosition = rollerShutterConfig.horizontalSplitPosition;
-        viewer.scene.imagerySplitPosition.y =
-            rollerShutterConfig.horizontalSplitPosition /
-            document.body.clientHeight;
+      let clientY = e.clientY;
+      if (clientY < 0) {
+        clientY = 0;
+      } else if (clientY > windowHeight) {
+        clientY = windowHeight - document.body.clientHeight;
+      }
+      horizontalSlider.style.top = clientY + "px";
+      rollerShutterConfig.horizontalSplitPosition = windowHeight - clientY;
     }
-    for (let layer of scene.layers.layerQueue) {
-        layer.splitDirection = rollerShutterConfig.splitDirection;
-        if (splitPosition) {
-            // 如果禁用卷帘就没有必要设置分割位置
-            layer.splitPosition = splitPosition;
-        }
+    setRollerShutterSplit();
+  }
+}
+
+/**
+ * 设置卷帘的分割方向及分割条的位置。
+ *
+ */
+export function setRollerShutterSplit() {
+  let splitPosition = null;
+  if (
+    rollerShutterConfig.splitDirection === Cesium.SplitDirection.LEFT ||
+    rollerShutterConfig.splitDirection === Cesium.SplitDirection.RIGHT
+  ) {
+    splitPosition = rollerShutterConfig.verticalSplitPosition;
+    viewer.scene.imagerySplitPosition.x =
+      rollerShutterConfig.verticalSplitPosition / document.body.clientWidth;
+  } else if (
+    rollerShutterConfig.splitDirection === Cesium.SplitDirection.TOP ||
+    rollerShutterConfig.splitDirection === Cesium.SplitDirection.BOTTOM
+  ) {
+    splitPosition = rollerShutterConfig.horizontalSplitPosition;
+    viewer.scene.imagerySplitPosition.y =
+      rollerShutterConfig.horizontalSplitPosition / document.body.clientHeight;
+  }
+  for (let layer of scene.layers.layerQueue) {
+    layer.splitDirection = rollerShutterConfig.splitDirection;
+    if (splitPosition) {
+      // 如果禁用卷帘就没有必要设置分割位置
+      layer.splitPosition = splitPosition;
     }
+  }
 }
 export function useRoller(val, lrtbRoller, lrRoller, tbRoller, setst = true) {
-    setstore = setst
-    let verticalSlider = document.getElementById("verticalSlider");
-    let horizontalSlider = document.getElementById("horizontalSlider");
-    if (val) {
-        switch (lrtbRoller) {
-            case "lrRoller":
-                verticalSlider.style.display = "block";
-                horizontalSlider.style.display = "none";
-                updataLrRoller(lrRoller);
-                break;
-            case "tbRoller":
-                verticalSlider.style.display = "none";
-                horizontalSlider.style.display = "block";
-                updaeTbRoller(tbRoller);
-                break;
-            default:
-                break;
-        }
-    } else {
-        rollerShutterConfig.splitDirection = Cesium.SplitDirection.NONE;
-        verticalSlider.style.display = "none";
+  setstore = setst;
+  let verticalSlider = document.getElementById("verticalSlider");
+  let horizontalSlider = document.getElementById("horizontalSlider");
+  if (val) {
+    switch (lrtbRoller) {
+      case "lrRoller":
+        verticalSlider.style.display = "block";
         horizontalSlider.style.display = "none";
-        setImageryRollerMode();
-        setRollerShutterSplit();
+        updataLrRoller(lrRoller);
+        break;
+      case "tbRoller":
+        verticalSlider.style.display = "none";
+        horizontalSlider.style.display = "block";
+        updaeTbRoller(tbRoller);
+        break;
+      default:
+        break;
     }
+  } else {
+    rollerShutterConfig.splitDirection = Cesium.SplitDirection.NONE;
+    verticalSlider.style.display = "none";
+    horizontalSlider.style.display = "none";
+    setImageryRollerMode();
+    setRollerShutterSplit();
+  }
 }
 
 export function lrtbRoller(val, lrRoller, tbRoller) {
-    let verticalSlider = document.getElementById("verticalSlider");
-    let horizontalSlider = document.getElementById("horizontalSlider");
-    switch (val) {
-        case "lrRoller":
-            verticalSlider.style.display = "block";
-            horizontalSlider.style.display = "none";
-            updataLrRoller(lrRoller);
-            break;
-        case "tbRoller":
-            verticalSlider.style.display = "none";
-            horizontalSlider.style.display = "block";
-            updaeTbRoller(tbRoller);
-            break;
-        default:
-            break;
-    }
+  let verticalSlider = document.getElementById("verticalSlider");
+  let horizontalSlider = document.getElementById("horizontalSlider");
+  switch (val) {
+    case "lrRoller":
+      verticalSlider.style.display = "block";
+      horizontalSlider.style.display = "none";
+      updataLrRoller(lrRoller);
+      break;
+    case "tbRoller":
+      verticalSlider.style.display = "none";
+      horizontalSlider.style.display = "block";
+      updaeTbRoller(tbRoller);
+      break;
+    default:
+      break;
+  }
 }
 // 更新卷帘
 export function updataLrRoller(lrRoller) {
-    switch (lrRoller) {
-        case "leftRoller":
-            rollerShutterConfig.splitDirection = Cesium.SplitDirection.LEFT;
-            break;
-        case "rightRoller":
-            rollerShutterConfig.splitDirection = Cesium.SplitDirection.RIGHT;
-            break;
-        default:
-            break;
-    }
-    setImageryRollerMode();
-    setRollerShutterSplit();
+  switch (lrRoller) {
+    case "leftRoller":
+      rollerShutterConfig.splitDirection = Cesium.SplitDirection.LEFT;
+      break;
+    case "rightRoller":
+      rollerShutterConfig.splitDirection = Cesium.SplitDirection.RIGHT;
+      break;
+    default:
+      break;
+  }
+  setImageryRollerMode();
+  setRollerShutterSplit();
 }
 export function updaeTbRoller(tbRoller) {
-    switch (tbRoller) {
-        case "topRoller":
-            rollerShutterConfig.splitDirection = Cesium.SplitDirection.TOP;
-            break;
-        case "bomRoller":
-            rollerShutterConfig.splitDirection = Cesium.SplitDirection.BOTTOM;
-            break;
-        default:
-            break;
+  switch (tbRoller) {
+    case "topRoller":
+      rollerShutterConfig.splitDirection = Cesium.SplitDirection.TOP;
+      break;
+    case "bomRoller":
+      rollerShutterConfig.splitDirection = Cesium.SplitDirection.BOTTOM;
+      break;
+    default:
+      break;
+  }
+  setImageryRollerMode();
+  setRollerShutterSplit();
+}
+
+export function addLight() {
+  //   console.log(viewer.scene.skyAtmosphere, "---", Cesium.LightType);
+  //   // 添加太阳光源
+  //   viewer.scene.skyAtmosphere.glowFactor = 0.9; // 设置大气辉光强度
+  //   viewer.scene.sunBloom = true; // 启用太阳辉光
+  //   viewer.scene.globe.enableLighting = true; // 启用光照
+
+  const scene = viewer.scene;
+  // 3.1 设置环境光(基础光照,无方向)
+  //   scene.light = new Cesium.Light({
+  //     type: Cesium.LightType.AMBIENT, // 环境光类型
+  //     intensity: 1, // 强度(0-1)
+  //     color: Cesium.Color.WHITE // 颜色
+  //   });
+  //   scene.atmosphere.dynamicLighting =
+  //     Cesium.DynamicAtmosphereLightingType.SUNLIGHT;
+  // Turn on dynamic lighting using whatever light source is in the scene
+  let directionalLight = new Cesium.DirectionalLight(
+    { x: -2022518.2831168969, y: 5709381.740701799, z: 1992063.465460857 },
+    {
+      intensity: 5,
+      color: new Cesium.Color(1.0, 1.0, 1.0, 1.0), //Cesium.Color.fromCssColorString(this.dgyform.color),
+      targetPosition: {
+        x: -2023404.1605023292,
+        y: 5709087.619535593,
+        z: 1991687.8679887278
+      }
     }
-    setImageryRollerMode();
-    setRollerShutterSplit();
+  );
+  scene.addLightSource(directionalLight);
+  console.log(scene.light, "--00-", scene.sun);
+  // 3.2 设置方向光(模拟太阳光,最常用)
+  // scene.light = new Cesium.DirectionalLight({
+  // //   direction: new Cesium.Cartesian3(-0.5, -0.5, -1.0), // 光源方向(笛卡尔坐标)
+  //   // intensity: 1, // 强度
+  // //   color: new Cesium.Color(1.0, 1.0, 0.0, 1.0) // 光源颜色(红绿蓝透明度)
+  // });
+  //   var light = new Cesium.DirectionalLight({
+  //     direction: new Cesium.Cartesian3(-1.0, -1.0, -1.0), // 光源方向,例如指向左上角
+  //     color: new Cesium.Color(1.0, 1.0, 1.0, 1.0) // 白色光源
+  //   });
+  //   viewer.scene.globe.environmentSaturationShift = -0.1; // 环境饱和度偏移,正值增加饱和度,负值减少饱和度
+  //   viewer.scene.globe.brightness = 1.2; // 环境亮度增加,使场景更亮
+
+  //   // 3.3 绑定方向光到太阳位置(模拟真实日照)
+  scene.light = new Cesium.SunLight(); // 使用太阳位置作为方向光
+  //   // 调整太阳光照强度
+  scene.sun.intensity = 1.5;
+
+  //   // 3.4 动态修改光源参数(示例:点击按钮调整强度)
+  //   document.getElementById("increaseLight").onclick = () => {
+  //     scene.light.intensity += 0.1;
+  //     if (scene.light.intensity > 2.0) scene.light.intensity = 2.0;
+  //   };
+  console.log(scene.light, "light", "--light-");
+}
+
+export function layerAddLight() {
+  // 3.5 给特定 3D 图层单独设置光源(超图扩展)
+  s3mLayer.lightMode = Cesium.LightMode.SCENE_LIGHT; // 使用场景光源
+  // 或自定义图层光源
+  s3mLayer.customLight = new Cesium.DirectionalLight({
+    direction: new Cesium.Cartesian3(0, 0, -1),
+    intensity: 0.8
+  });
 }