地形压平添加参数；坡度分析 添加图例，数据上传，元数据管理，资料馆添加元数据查询，综合展示图片更换

Surpriseplus

2023-02-27 4b8943bd66fc721f8381b74eff259a2f7ffef513

 src/components/mapol.vue

@@ -2,32 +2,41 @@
  <div id="mapol">
    <div style="display: flex">
      <div
          @click="changeMenulayer"
          class="center CenDiv"
          :class="{ center1: centerFlag }"
        @click="changeMenulayer"
        class="center CenDiv"
        :class="{ center1: centerFlag }"
      >
        <div
            id="cenBg"
            v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
          id="cenBg"
          v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
        ></div>

      </div>
      <div @click="changeMapType" class="changeMapType">
        <div id="cenBg" :class="show2DMap ? 'mapTypeTwo' : 'mapTypeThree'"></div>
      <div
        @click="changeMapType"
        class="changeMapType"
      >
        <div
          id="cenBg"
          :class="show2DMap ? 'mapTypeTwo' : 'mapTypeThree'"
        ></div>
      </div>
    </div>
<!--    <div-->
<!--      @click="changeMenulayer"-->
<!--      class="center CenDiv"-->
<!--      :class="{ center1: centerFlag }"-->
<!--    >-->
<!--      <div-->
<!--        id="cenBg"-->
<!--        v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"-->
<!--      ></div>-->
    <!--    <div-->
    <!--      @click="changeMenulayer"-->
    <!--      class="center CenDiv"-->
    <!--      :class="{ center1: centerFlag }"-->
    <!--    >-->
    <!--      <div-->
    <!--        id="cenBg"-->
    <!--        v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"-->
    <!--      ></div>-->

<!--    </div>-->
    <div v-show="$store.state.isNaviget"  class="sindagis-map-compass">
    <!--    </div>-->
    <div
      v-show="$store.state.isNaviget"
      class="sindagis-map-compass"
    >
      <span
        class="left"
        @click="leftClick"
@@ -74,7 +83,7 @@
      isMenuLayer: false,
      rotate: 0,
      currentDir: '',
      show2DMap:false,
      show2DMap: false,
    }
  },
  mounted() {
@@ -99,7 +108,7 @@
        target: "mapol",
        layers: [imageLayer, vectorLayer],
        view: new View({
          center:  [105.02, 34.9] ,
          center: [105.02, 34.9],
          zoom: 4,
          projection: "EPSG:4326",
        }),
@@ -122,11 +131,11 @@
    },

    //二维/三维地图切换
    changeMapType(){
    changeMapType() {
      // debugger
      this.show2DMap = !this.show2DMap;
      //二维
      if (this.show2DMap){
      if (this.show2DMap) {
        this.$bus.$emit("changemap", 2);
      }
      //三维
@@ -316,7 +325,7 @@
  background: url("../assets/img/compass.png") -89px -5px / 266px no-repeat;
}

.changeMapType{
.changeMapType {
  position: absolute;
  bottom: 1%;
  left: calc(1% + 75px);
@@ -326,26 +335,25 @@
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 3px 3px 6px #666;
  // box-shadow: 3px 3px 6px #666;
  border-radius: 5px;
  background: #fff;
  // background: #fff;
  cursor: pointer;
}
.mapTypeTwo{
.mapTypeTwo {
  width: 100%;
  height: 100%;
  margin-left: 10px;
  background-image: url("../assets/img/3dmap.png");
  background-image: url("../assets/img/synthesis/3D.png");
  background-repeat: no-repeat;
  background-size: contain;
}
.mapTypeThree{
.mapTypeThree {
  width: 100%;
  height: 100%;
  margin-left: 10px;
  background-image: url("../assets/img/2dmap.png");
  background-image: url("../assets/img/synthesis/2D 拷贝 2.png");
  background-repeat: no-repeat;
  background-size: contain;
}

</style>