北京经济技术开发区经开区虚拟城市项目-【前端】-移动端Web
11
少年
2024-01-22 b215847e8958a91c1ddbf71020938941e2c9725e
11
已修改2个文件
150 ■■■■■ 文件已修改
src/components/sideMenu/layerMenu/layerPanel.vue 112 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/sideMenu/sliderAlpha/alpha.vue 38 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/sideMenu/layerMenu/layerPanel.vue
@@ -133,7 +133,6 @@
import store from "@/utils/store.js";
import ZTTitem from "@/utils/ztt.js";
import { layers } from "../../../../static/json/layer.js";
import { set } from "ol/transform.js";
export default {
  name: "LayerPanel",
  data() {
@@ -474,36 +473,11 @@
        //   // store.setThematicLayerItemId(result.id);
      }
    },
    //加载地块模型
    loadLayer() {
      window.tdglLayer = sgworld.Creator.createImageryProvider(
        layers[8].name,
        "tms",
        {
          id: layers[8].children[0].id,
          url: layers[8].children[0].urls,
          fileExtension: layers[8].children[0].img || "png",
          enablePickFeatures: false,
          level: layers[8].children[0].Level,
          minimumLevel: layers[8].children[0].minimumLevel,
          maximumLevel: layers[8].children[0].maximumLevel,
          tilingScheme:
            layers[8].children[0].tileType === "Geo"
              ? new Cesium.GeographicTilingScheme()
              : new Cesium.WebMercatorTilingScheme(),
          // alpha: layers[8].children[0].alpha,
          alpha: this.state1.alpha,
        },
        "0",
        layers[8].children[0].zIndex,
        true,
        ""
      );
    },
    // 第三行 专题功能 点击
    handleFuncClick(index) {
      if (this.curFuncIndex == index) {
        store.setTdglFlag(false);
        store.setSliderShow(false);
        store.setPoplayerListAction({});
        divPoint3 && divPoint3.deleteObject();
        store.setPoplayerShowAction(false);
@@ -516,29 +490,52 @@
        if (window.tdglLayer) {
          sgworld.Creator.DeleteObject(window.tdglLayer);
        }
      }
      // 隐藏底部图层面版
      store.setLayerPanelShow(false);
      // 隐藏右上角菜单面板
      store.setMenuListShow(false);
      // 隐藏底部漫游面板
      store.setRoamPanelShow(false);
      //显示滑动条
      store.setSliderShow(true);
      this.curFuncIndex = index;
      switch (index) {
        case 0:
          this.loadLayer();
          store.setTdglFlag(true);
          break;
        case 1:
          this.curFuncIndex = -1;
          store.setTdglFlag(false);
          if (window.tdglLayer) {
            sgworld.Creator.DeleteObject(window.tdglLayer);
          }
          store.setHistoryShow(true);
          break;
      } else {
        // 隐藏底部图层面版
        store.setLayerPanelShow(false);
        // 隐藏右上角菜单面板
        store.setMenuListShow(false);
        // 隐藏底部漫游面板
        store.setRoamPanelShow(false);
        //显示滑动条
        store.setSliderShow(true);
        this.curFuncIndex = index;
        switch (index) {
          case 0:
            window.tdglLayer = sgworld.Creator.createImageryProvider(
              layers[8].name,
              "tms",
              {
                id: layers[8].children[0].id,
                url: layers[8].children[0].urls,
                fileExtension: layers[8].children[0].img || "png",
                enablePickFeatures: false,
                level: layers[8].children[0].Level,
                minimumLevel: layers[8].children[0].minimumLevel,
                maximumLevel: layers[8].children[0].maximumLevel,
                tilingScheme:
                  layers[8].children[0].tileType === "Geo"
                    ? new Cesium.GeographicTilingScheme()
                    : new Cesium.WebMercatorTilingScheme(),
                // alpha: layers[8].children[0].alpha,
                alpha: this.alpha,
              },
              "0",
              layers[8].children[0].zIndex,
              true,
              ""
            );
            store.setTdglFlag(true);
            break;
          case 1:
            this.curFuncIndex = -1;
            store.setTdglFlag(false);
            if (window.tdglLayer) {
              sgworld.Creator.DeleteObject(window.tdglLayer);
            }
            store.setHistoryShow(true);
            break;
        }
      }
    },
    showLayerTree() {
@@ -585,11 +582,16 @@
      immediate: true, //刷新加载 立马触发一次handler
      deep: true, // 可以深度检测到 obj 对象的属性值的变化
    },
    "state1.alpha": {
      handler: function (newVal) {
        this.handleFuncClick(0);
      },
      deep: true,
    // "state1.alpha": {
    //   handler: function (newVal) {
    //     this.handleFuncClick(0);
    //   },
    //   deep: true,
    // },
  },
  computed: {
    alpha() {
      return store.tdglInfo.alpha;
    },
  },
};
src/components/sideMenu/sliderAlpha/alpha.vue
@@ -1,12 +1,21 @@
<template>
  <div class="sliders">
    <el-slider v-model="alpha" vertical height="200px" :max="1" :min="0" :step="0.01"  @input="changeSlider">
    <el-slider
      v-model="alpha"
      vertical
      height="200px"
      :max="1"
      :min="0"
      :step="0.01"
      @input="changeSlider"
    >
    </el-slider>
  </div>
</template>
<script>
import store from "@/utils/store.js";
import { layers } from "../../../../static/json/layer.js";
export default {
  data() {
    return {
@@ -15,7 +24,32 @@
  },
  methods: {
    changeSlider(val) {
      store.setAlpha(val);
      if (window.tdglLayer) {
        sgworld.Creator.DeleteObject(window.tdglLayer);
      }
      window.tdglLayer = sgworld.Creator.createImageryProvider(
        layers[8].name,
        "tms",
        {
          id: layers[8].children[0].id,
          url: layers[8].children[0].urls,
          fileExtension: layers[8].children[0].img || "png",
          enablePickFeatures: false,
          level: layers[8].children[0].Level,
          minimumLevel: layers[8].children[0].minimumLevel,
          maximumLevel: layers[8].children[0].maximumLevel,
          tilingScheme:
            layers[8].children[0].tileType === "Geo"
              ? new Cesium.GeographicTilingScheme()
              : new Cesium.WebMercatorTilingScheme(),
          // alpha: layers[8].children[0].alpha,
          alpha:val,
        },
        "0",
        layers[8].children[0].zIndex,
        true,
        ""
      );
    },
  },
};