From 39a7cf29b63be85e5fbb12cb83a6fbc9d903a9cb Mon Sep 17 00:00:00 2001
From: surprise <15810472099@163.com>
Date: 星期三, 31 一月 2024 14:31:16 +0800
Subject: [PATCH] 代码更新

---
 src/components/mapsdk.vue | 1061 +++++++++++++++++++++++++++++++++-------------------------
 1 files changed, 597 insertions(+), 464 deletions(-)

diff --git a/src/components/mapsdk.vue b/src/components/mapsdk.vue
index 999a8b7..6b254c2 100644
--- a/src/components/mapsdk.vue
+++ b/src/components/mapsdk.vue
@@ -1,199 +1,107 @@
 <template>
   <div class="mapBox">
     <div id="mapdiv">
-      <div
-        class="menu_Top box_divm"
-        v-if="$store.state.mapMenuBoolean"
-      >
+      <div class="menu_Top box_divm" v-if="$store.state.mapMenuBoolean">
         <map-menu-top v-if="$store.state.mapMenuBoxFlag == '1'" />
         <map-space-top v-if="$store.state.mapMenuBoxFlag == '2'" />
       </div>
-      <div
-        class="bufferBox"
-        v-if="showBufferBoxDialog"
-      >
+      <div class="bufferBox" v-if="showBufferBoxDialog">
         <el-card class="box-card box_divm">
-          <div
-            slot="header"
-            class="clearfix"
-          >
+          <div slot="header" class="clearfix">
             <span>缂撳啿鍖哄垎鏋�</span>
             <div style="float: right; cursor: pointer">
-              <i
-                class="el-icon-close"
-                @click="closeBufferBox(1)"
-              ></i>
+              <i class="el-icon-close" @click="closeBufferBox(1)"></i>
             </div>
           </div>
           <div class="box-body">
-            <el-form
-              ref="form"
-              :model="bufFrom"
-              label-width="100px"
-            >
+            <el-form ref="form" :model="bufFrom" label-width="100px">
               <el-form-item label="缂撳啿鍗婂緞(绫�):">
                 <el-input v-model="bufFrom.val"></el-input>
               </el-form-item>
               <el-form-item>
-                <el-button
-                  @click="addBuffer(1)"
-                  type="info"
-                >鐐�</el-button>
-                <el-button
-                  @click="addBuffer(2)"
-                  type="info"
-                >绾�</el-button>
-                <el-button
-                  @click="addBuffer(3)"
-                  type="info"
-                >闈�</el-button>
-                <el-button
-                  @click="clearBuffer"
-                  type="info"
-                >娓呴櫎</el-button>
+                <el-button @click="addBuffer(1)" type="info">鐐�</el-button>
+                <el-button @click="addBuffer(2)" type="info">绾�</el-button>
+                <el-button @click="addBuffer(3)" type="info">闈�</el-button>
+                <el-button @click="clearBuffer" type="info">娓呴櫎</el-button>
               </el-form-item>
             </el-form>
           </div>
         </el-card>
       </div>
       <!--鍧愭爣鐐逛綅-->
-      <div
-        class="coordLocalBox"
-        v-if="showCoordLocalBoxDialog"
-      >
+      <div class="coordLocalBox" v-if="showCoordLocalBoxDialog">
         <el-card class="box-card">
           <div slot="header">
             <span>鍧愭爣瀹氫綅</span>
             <div style="float: right; cursor: pointer">
-              <i
-                class="el-icon-close"
-                @click="closeBufferBox(2)"
-              ></i>
+              <i class="el-icon-close" @click="closeBufferBox(2)"></i>
             </div>
           </div>
           <div class="box-body">
-            <el-form
-              ref="form"
-              :model="coordFrom"
-              label-width="50px"
-            >
+            <el-form ref="form" :model="coordFrom" label-width="70px">
               <el-form-item label="缁忓害:">
-                <el-input v-model="coordFrom.lon"></el-input>
+                <el-input v-model="coordFrom.lon" placeholder="璇疯緭鍏ョ粡搴�"></el-input>
               </el-form-item>
               <el-form-item label="绾害:">
-                <el-input v-model="coordFrom.lat"></el-input>
+                <el-input v-model="coordFrom.lat" placeholder="璇疯緭鍏ョ淮搴�"></el-input>
               </el-form-item>
               <el-form-item label="楂樺害:">
-                <el-input v-model="coordFrom.height"></el-input>
+                <el-input v-model="coordFrom.height" placeholder="璇疯緭鍏ラ珮搴�"></el-input>
               </el-form-item>
               <el-form-item>
-                <el-button
-                  @click="setCoordLocal"
-                  type="info"
-                >瀹氫綅</el-button>
+                <el-button @click="setCoordLocal" type="info">瀹氫綅</el-button>
               </el-form-item>
             </el-form>
           </div>
         </el-card>
       </div>
       <!--鍦板舰骞虫暣-->
-      <div
-        class="terrainLevelBox"
-        v-if="showTerrainLevelDialog"
-      >
+      <div class="terrainLevelBox" v-if="showTerrainLevelDialog">
         <el-card class="box-card">
           <div slot="header">
             <span>鍦板舰骞虫暣</span>
             <div style="float: right; cursor: pointer">
-              <i
-                class="el-icon-close"
-                @click="closeBufferBox(5)"
-              ></i>
+              <i class="el-icon-close" @click="closeBufferBox(5)"></i>
             </div>
           </div>
           <div class="box-body">
-            <el-form
-              ref="form"
-              :model="terrainFrom"
-              label-width="100px"
-            >
+            <el-form ref="form" :model="terrainFrom" label-width="100px">
               <el-form-item label="骞虫暣楂樺害:">
                 <el-input v-model="terrainFrom.height"></el-input>
               </el-form-item>
 
               <el-form-item>
-                <el-button
-                  @click="drawTerrainLevel"
-                  type="parmary"
-                >缁樺埗</el-button>
-                <el-button
-                  @click="clearTerrainLevel"
-                  type="info"
-                >娓呴櫎</el-button>
+                <el-button @click="drawTerrainLevel" type="parmary">缁樺埗</el-button>
+                <el-button @click="clearTerrainLevel" type="info">娓呴櫎</el-button>
               </el-form-item>
             </el-form>
           </div>
         </el-card>
       </div>
-      <div
-        class="toponymicLocalBox"
-        v-if="showToponymicLocalBoxDialog"
-      >
+      <div class="toponymicLocalBox" v-if="showToponymicLocalBoxDialog">
         <el-card class="box-card">
-          <div
-            slot="header"
-            class="clearfix"
-          >
+          <div slot="header" class="clearfix">
             <span>鍦板悕瀹氫綅</span>
             <div style="float: right; cursor: pointer">
-              <i
-                class="el-icon-close"
-                @click="closeBufferBox(3)"
-              ></i>
+              <i class="el-icon-close" @click="closeBufferBox(3)"></i>
             </div>
           </div>
           <div class="box-body">
-            <el-form
-              :model="comprehensive"
-              :inline="true"
-            >
+            <el-form :model="comprehensive" :inline="true">
               <el-form-item label="鍦板悕:">
-                <el-input
-                  style="width: 160px"
-                  v-model="comprehensive.name"
-                ></el-input>
+                <el-input size="small" style="width: 160px" v-model="comprehensive.name"
+                  placeholder="璇疯緭鍏ュ湴鍚�...."></el-input>
               </el-form-item>
               <el-form-item>
-                <el-button
-                  @click="setQueryTable"
-                  type="info"
-                >鏌ヨ</el-button>
+                <el-button @click="setQueryTable" type="info" size="small">鏌ヨ</el-button>
               </el-form-item>
             </el-form>
-            <el-table
-              :data="tableData"
-              height="200px"
-              border
-              style="width: 100%"
-            >
-              <el-table-column
-                align="center"
-                type="index"
-                label="搴忓彿"
-              />
-              <el-table-column
-                prop="name"
-                align="center"
-                label="鍦板悕"
-              >
+            <el-table :data="tableData" height="200px" border style="width: 100%">
+              <el-table-column align="center" type="index" label="搴忓彿" width="70" />
+              <el-table-column prop="name" align="center" label="鍦板悕">
                 <template slot-scope="scope">
-                  <el-button
-                    @click="handleLocation(scope.$index, scope.row)"
-                    size="small"
-                  >{{scope.row.name}}<i
-                      class="el-icon-place"
-                      style="padding-left: 5px"
-                    ></i></el-button>
+                  <el-button @click="handleLocation(scope.$index, scope.row)" size="small">{{ scope.row.name }}<i
+                      class="el-icon-place" style="padding-left: 5px"></i></el-button>
                 </template>
               </el-table-column>
               <!--              <el-table-column-->
@@ -217,132 +125,99 @@
               <!--              </el-table-column>-->
             </el-table>
             <div class="pagination_box">
-              <el-pagination
-                @size-change="handleSizeChange"
-                @current-change="handleCurrentChange"
-                :current-page="listData.pageIndex"
-                :page-sizes="[10, 20, 50, 100]"
-                :pager-count="3"
-                :page-size="listData.pageSize"
-                layout="total, prev, pager, next"
-                :total="count"
-              >
+              <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
+                :current-page="listData.pageIndex" :page-sizes="[10, 20, 50, 100]" :pager-count="3"
+                :page-size="listData.pageSize" layout="total, prev, pager, next" :total="count">
               </el-pagination>
             </div>
           </div>
         </el-card>
       </div>
       <!-- 璺緞鍒嗘瀽寮圭獥-->
-      <div
-        class="pathAnalysisBox"
-        v-if="showPathAnalysisBoxDialog"
-      >
+      <div class="pathAnalysisBox" v-if="showPathAnalysisBoxDialog">
         <el-card class="box-card">
-          <div
-            slot="header"
-            class="clearfix"
-          >
+          <div slot="header" class="clearfix">
             <span>璺緞鍒嗘瀽</span>
             <div style="float: right; cursor: pointer">
-              <i
-                class="el-icon-close"
-                @click="closeBufferBox(4)"
-              ></i>
+              <i class="el-icon-close" @click="closeBufferBox(4)"></i>
             </div>
           </div>
           <div class="box-body">
-            <el-form
-              ref="form"
-              :model="pathFrom"
-              :rules="rules"
-              label-width="55px"
-            >
-              <el-form-item
-                label="璧风偣:"
-                prop="lon"
-              >
-                <el-input
-                  style="width: 250px"
-                  v-model="pathFrom.lon"
-                  placeholder="鍧愭爣鏍煎紡:116.799,39.979"
-                ></el-input>
-                <el-link
-                  :underline="false"
-                  @click="showMouseLeftClick(1)"
-                  style="margin-left: 10px"
-                ><i class="el-icon-plus"></i></el-link>
+            <el-form ref="form" :model="pathFrom" :rules="rules" label-width="55px">
+              <el-form-item label="璧风偣:" prop="lon">
+                <el-input style="width: 250px" v-model="pathFrom.lon" placeholder="鍧愭爣鏍煎紡:116.799,39.979"></el-input>
+                <el-link :underline="false" @click="showMouseLeftClick(1)" style="margin-left: 10px"><i
+                    class="el-icon-plus"></i></el-link>
               </el-form-item>
-              <el-form-item
-                label="缁堢偣:"
-                prop="lat"
-              >
-                <el-input
-                  style="width: 250px"
-                  v-model="pathFrom.lat"
-                  placeholder="鍧愭爣鏍煎紡:116.824,39.938"
-                ></el-input>
-                <el-link
-                  :underline="false"
-                  @click="showMouseLeftClick(2)"
-                  style="margin-left: 10px"
-                ><i class="el-icon-plus"></i></el-link>
+              <el-form-item label="缁堢偣:" prop="lat">
+                <el-input style="width: 250px" v-model="pathFrom.lat" placeholder="鍧愭爣鏍煎紡:116.824,39.938"></el-input>
+                <el-link :underline="false" @click="showMouseLeftClick(2)" style="margin-left: 10px"><i
+                    class="el-icon-plus"></i></el-link>
               </el-form-item>
               <el-form-item>
-                <el-button
-                  @click="showMouseLeftClick(3)"
-                  type="info"
-                >鏌ヨ</el-button>
+                <el-button @click="showMouseLeftClick(3)" type="info">鏌ヨ</el-button>
               </el-form-item>
             </el-form>
           </div>
         </el-card>
       </div>
       <!--      <div style="display: flex;">-->
-      <div
+      <!-- <div
         class="changeTerrain"
         @click="changeTerrainLayer"
+        style="  position: absolute;
+  bottom: 84px;
+  right: 46px;
+  height: 30px;
+  width: 30px;
+  z-index: 101;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+  border: 1px solid rgba(255, 255, 255, 0.5);"
       >
         <div
           title="鍦板舰鍒囨崲"
           id="cenBg"
           class="mapTerrain"
         ></div>
-      </div>
+      </div> -->
       <!--      class="center CenDiv"-->
-      <div
-        @click="changeMenulayer"
-        class="changeLayer"
-      >
-        <div
-          title="搴曞浘鍒囨崲"
-          id="cenBg"
-          class="mapBaseMap"
-        ></div>
+      <div @click="changeMenulayer" class="changeLayer" style="  position: absolute;
+  bottom: 116px;
+  right: 46px;
+  height: 30px;
+  width: 30px;
+  z-index: 101;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+  border: 1px solid rgba(255, 255, 255, 0.5);">
+        <div title="搴曞浘鍒囨崲" id="cenBg" class="mapBaseMap"></div>
       </div>
 
-      <div
-        @click="changeMapType"
-        class="changeMapType"
-      >
-        <div
-          title="2/3缁村垏鎹�"
-          id="cenBg"
-          :class="show2DMap ? 'mapTypeTwo' : 'mapTypeThree'"
-        ></div>
+      <div @click="changeMapType" class="changeMapType" v-if="$store.state.setChangeBaseMap" style="  position: absolute;
+  bottom: 85px;
+  right: 46px;
+  height: 30px;
+  width: 30px;
+  z-index: 101;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+  border: 1px solid rgba(255, 255, 255, 0.5);">
+        <div title="2/3缁村垏鎹�" id="cenBg" :class="show2DMap ? 'mapTypeTwo' : 'mapTypeThree'"></div>
       </div>
       <!--      </div>-->
       <!-- 鍧″害鍒嗘瀽寮圭獥-->
-      <div
-        class="lengend"
-        v-show="showLengendDialog"
-      >
+      <div class="lengend" v-show="showLengendDialog">
         <el-card class="box-card">
           <div class="lengendBox">
             <div>
-              <img
-                class="lengendImg"
-                src="../assets/img/colors.png"
-              />
+              <img class="lengendImg" src="../assets/img/colors.png" />
             </div>
             <div class="lengendSpan">
               <div>0掳</div>
@@ -354,10 +229,7 @@
           </div>
         </el-card>
       </div>
-      <div
-        class="HistLeng"
-        v-show="$store.state.histLenged"
-      >
+      <div class="HistLeng" v-show="$store.state.histLenged">
         <el-card class="box-card">
           <table>
             <tr>
@@ -409,101 +281,69 @@
                 </div>
               </td>
             </tr>
+            <tr>
+              <td>娣ゆ偿璐ㄥ湡</td>
+              <td>
+                <div style="width:100px;height:20px;background:rgba(75,74,78,1)">
+                </div>
+              </td>
+            </tr>
+            <tr>
+              <td>鍏朵粬</td>
+              <td>
+                <div style="width:100px;height:20px;background:rgba(225,225,225,1)">
+                </div>
+              </td>
+            </tr>
           </table>
         </el-card>
       </div>
       <!--灞炴�т俊鎭脊绐�-->
-      <div
-        class="propertiesPop"
-        v-if="$store.state.propertiesFlag == '1'"
-        v-drag
-      >
+      <div class="propertiesPop" v-if="$store.state.propertiesFlag == '1'" v-drag>
         <el-card class="box-card">
           <div slot="header">
             <span>灞炴�т俊鎭�</span>
             <div style="float: right; cursor: pointer">
-              <el-link
-                v-if="$store.state.propertiesName.enName == 's_surveyworksite'"
-                type="primary"
-                :underline="false"
-                @click="getPointInfo"
-                style="margin-right: 10px"
-              >鍕樺療淇℃伅琛�</el-link>
-              <el-link
-                type="primary"
-                :underline="false"
-                @click="getAttatchList"
-                style="margin-right: 10px"
-              >鏌ョ湅闄勪欢</el-link>
-              <i
-                class="el-icon-close"
-                @click="closeBufferBox(6)"
-              ></i>
+              <el-link v-if="$store.state.surfaceDeForm.flag && this.$store.state.surfaceDeForm.gid" type="primary"
+                :underline="false" @click="setSurfaceDeForm" style="margin-right: 10px">鍦拌〃褰㈠彉鏃跺簭鍥�</el-link>
+              <el-link v-if="$store.state.propertiesName.enName == 's_surveyworksite'" type="primary" :underline="false"
+                @click="getPointInfo" style="margin-right: 10px">鍕樺療淇℃伅琛�</el-link>
+              <el-link type="primary" :underline="false" @click="getAttatchList" style="margin-right: 10px">鏌ョ湅闄勪欢</el-link>
+              <i class="el-icon-close" @click="closeBufferBox(6)"></i>
             </div>
           </div>
-          <div
-            class="pointInfoBoxContext"
-            style="height:250px;overflow-y: auto"
-          >
-            <div
-              style="line-height: 20px"
-              v-for="(value, key) in $store.state.propertiesInfo"
-              :key="key"
-            >
-              <span
-                v-if="key != 'eventid'"
-                style="font-size: 14px;font-weight: bold;margin-right: 5px"
-              >{{key}}:</span>
-              <span v-if="key != 'eventid'">{{value}}</span>
+          <div class="pointInfoBoxContext" style="height:250px;overflow-y: auto">
+            <div style="line-height: 20px" v-for="(value, key) in $store.state.propertiesInfo" :key="key">
+              <span v-if="key != 'eventid'" style="font-size: 14px;font-weight: bold;margin-right: 5px">{{ key }}:</span>
+              <span v-if="key != 'eventid'">{{ value }}</span>
             </div>
           </div>
         </el-card>
       </div>
       <!--鍕樺療淇℃伅寮圭獥-->
-      <div
-        v-drag
-        class="attributionPop"
-        v-if="showAttribute"
-      >
+      <div v-drag class="attributionPop" v-if="showAttribute">
         <el-card class="box-card">
           <div slot="header">
             <span>鍕樺療淇℃伅</span>
             <div style="float: right; cursor: pointer">
-              <i
-                class="el-icon-close"
-                @click="showAttribute=false"
-              ></i>
+              <i class="el-icon-close" @click="showAttribute = false"></i>
             </div>
           </div>
-          <div
-            class="pointInfoBoxContext"
-            style="height:250px;overflow-y: auto"
-          >
-            <div
-              style="line-height: 20px"
-              v-for="(item, index) in attributeList"
-              :key="index"
-            >
-              <span style="font-size: 14px;font-weight: bold;margin-right: 5px">{{item.alias}}:</span>
-              <span>{{item.value ? item.value :'鏆傛棤鏁版嵁'}}</span>
+          <div class="pointInfoBoxContext" style="height:250px;overflow-y: auto">
+            <div style="line-height: 20px" v-for="(item, index) in attributeList" :key="index">
+              <span style="font-size: 14px;font-weight: bold;margin-right: 5px">{{ item.alias }}:</span>
+              <span>{{ item.value ? item.value : '鏆傛棤鏁版嵁' }}</span>
             </div>
           </div>
         </el-card>
       </div>
 
-      <div
-        class="propertiesPop"
-        style="right:22%"
-        v-if="$store.state.propertiesFlag == '2'"
-      >
+      <div class="propertiesPop" style="right:22%" v-if="$store.state.propertiesFlag == '2'">
         <el-card class="box-card">
           <div slot="header">
             <span>{{ $store.state.propertiesInfo.title }}</span>
           </div>
-          <div
-            class="pointInfoBoxContext"
-            style="height:250px;overflow-y: auto"
-          >
+          <div class="pointInfoBoxContext" style="height:250px;overflow-y: auto">
             <div style="line-height: 20px">宀╁湡鍚嶇О锛� {{ $store.state.propertiesInfo.name }}</div>
             <div style="line-height: 20px">宀╁湡绫诲瀷锛� {{ $store.state.propertiesInfo.type }}</div>
             <div style="line-height: 20px">灞傚簳娣卞害锛� {{ $store.state.propertiesInfo.botdepth }} 绫�</div>
@@ -513,138 +353,96 @@
         </el-card>
       </div>
       <!--涓夌淮鎴潰鍒嗘瀽寮圭獥-->
-      <div
-        class="modelClipPop"
-        v-if="$store.state.propertiesFlag == '3'"
-      >
+      <div class="modelClipPop" v-if="$store.state.propertiesFlag == '3'">
         <div class="slide-bg">
-          <el-slider
-            class="slide"
-            @change="valveChange()"
-            :min="-300"
-            :max="300"
-            v-model="valueX"
-          ></el-slider>
+          <el-slider class="slide" @change="valveChange()" :min="-300" :max="300" v-model="valueX"></el-slider>
           <span>宸﹀彸鎴潰</span>
-        </div>
+        </div>SpatialQuery
         <div class="slide-bg">
-          <el-slider
-            class="slide"
-            @change="valveChange()"
-            :min="-300"
-            :max="300"
-            v-model="valueY"
-          ></el-slider>
+          <el-slider class="slide" @change="valveChange()" :min="-300" :max="300" v-model="valueY"></el-slider>
           <span>鍓嶅悗鎴潰</span>
         </div>
         <div class="slide-bg">
-          <el-slider
-            class="slide"
-            @change="valveChange()"
-            :min="-300"
-            :max="300"
-            v-model="valueZ"
-          ></el-slider>
+          <el-slider class="slide" @change="valveChange()" :min="-300" :max="300" v-model="valueZ"></el-slider>
           <span>涓婁笅鎴潰</span>
         </div>
       </div>
+      <!-- 鍦拌〃褰㈠彉鏃跺簭鍥� -->
+      <div class="surfaceDeFormPop" style="    width: 800px;
+      height: 800px;" v-show="surfaceDeFormFlag" v-drag>
+        <el-card class="box-card">
+          <div slot="header">
+            <span>鍦拌〃褰㈠彉鏃跺簭鍥�</span>
+            <div style="float: right; cursor: pointer">
+              <i class="el-icon-close" @click="closeBufferBox(7)"></i>
+            </div>
+          </div>
+          <div id="surfaceDeFormEchart" class="pointInfoBoxContext" style="height:500px;width:750px;">
 
+          </div>
+        </el-card>
+      </div>
       <!--闄勪欢鍒楄〃寮圭獥-->
-      <el-dialog
-        title="闄勪欢鍒楄〃"
-        :append-to-body="false"
-        :visible.sync="showAttach"
-        width="35%"
-        :close-on-click-modal="false"
-      >
+      <el-dialog title="闄勪欢鍒楄〃" :append-to-body="false" :visible.sync="showAttach" width="35%"
+        :close-on-click-modal="false">
         <div>
-          <el-table
-            :data="attachList"
-            height="100%"
-            style="width: 100%"
-            border
-          >
-            <el-table-column
-              align="center"
-              type="index"
-              label="搴忓彿"
-              width="50"
-            />
-            <el-table-column
-              prop="name"
-              label="鍚嶇О"
-            >
+          <el-table :data="attachList" height="100%" style="width: 100%" border>
+            <el-table-column align="center" type="index" label="搴忓彿" width="50" />
+            <el-table-column prop="name" label="鍚嶇О">
             </el-table-column>
-            <el-table-column
-              label="鏃堕棿"
-              width="180"
-            >
+            <el-table-column label="鏃堕棿" width="180">
               <template slot-scope="scope">
-                <span>{{format(scope.row.createTime)}}</span>
+                <span>{{ format(scope.row.createTime) }}</span>
               </template>
             </el-table-column>
-            <el-table-column
-              label="鎿嶄綔"
-              width="100"
-            >
+            <el-table-column label="鎿嶄綔" width="100">
               <template slot-scope="scope">
-                <el-button
-                  v-if="showAttachDetailBtn(scope.row)"
-                  @click="showAttachDetail(scope.row)"
-                  type="text"
-                  size="small"
-                >鏌ョ湅</el-button>
+                <el-button v-if="showAttachDetailBtn(scope.row)" @click="showAttachDetail(scope.row)" type="text"
+                  size="small">鏌ョ湅</el-button>
               </template>
             </el-table-column>
           </el-table>
         </div>
       </el-dialog>
       <!--闄勪欢寮圭獥-->
-      <el-dialog
-        title="棰勮"
-        :append-to-body="false"
-        :visible.sync="dialog.dialogVisible"
-        width="70%"
-        :close-on-click-modal="false"
-      >
-        <div
-          v-if="dialog.isPdf"
-          class="pdfClass"
-        >
-          <iframe
-            :src="dialog.src"
-            type="application/x-google-chrome-pdf"
-            width="100%"
-            height="100%"
-          >
+      <el-dialog title="棰勮" :append-to-body="false" :visible.sync="dialog.dialogVisible" width="70%"
+        :close-on-click-modal="false">
+        <div v-if="dialog.isPdf" class="pdfClass">
+          <iframe :src="dialog.src" type="application/x-google-chrome-pdf" width="100%" height="100%">
           </iframe>
         </div>
-        <div
-          v-if="dialog.isJpg"
-          class="pdfClass"
-        >
-          <el-image
-            style="width:100%; height:100%"
-            :src="dialog.src"
-            :preview-src-list="[dialog.src]"
-          >
+        <div v-if="dialog.isJpg" class="pdfClass">
+          <el-image style="width:100%; height:100%" :src="dialog.src" :preview-src-list="[dialog.src]">
           </el-image>
 
         </div>
       </el-dialog>
-      <!--      <div-->
-      <!--        @click="changeMenulayer"-->
-      <!--        class="center CenDiv"-->
-      <!--        :class="{ center1: centerFlag }"-->
-      <!--      >-->
-      <!--        <div-->
-      <!--          id="cenBg"-->
-      <!--          v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"-->
-      <!--        ></div>-->
-      <!--      </div>-->
 
+      <el-dialog title="鐡︾墖涓嬭浇" :append-to-body="false" :visible.sync="downTitleFlag" :close-on-click-modal="false"
+        :show-close="false" width="30%">
+        <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
+          <el-form-item label="鍚嶇О" prop="title">
+            <el-input v-model="ruleForm.title" size="small" placeholder="璇疯緭鍏ユ暟鎹悕绉�..."></el-input>
+          </el-form-item>
+          <el-form-item label="瀵嗙爜" prop="pass">
+            <el-input show-password type="password" v-model="ruleForm.pass" autocomplete="off" size="small"
+              placeholder="璇疯緭鍏ュ瘑鐮�..."></el-input>
+          </el-form-item>
+          <el-form-item label="纭瀵嗙爜" prop="checkPass">
+            <el-input show-password type="password" v-model="ruleForm.checkPass" autocomplete="off" size="small"
+              placeholder="纭瀵嗙爜..."></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" size="small" @click='submitTitleDown("ruleForm")'>鎻愪氦</el-button>
+            <el-button size="small" @click='cannelTitleDown("ruleForm")'>鍙栨秷</el-button>
+          </el-form-item>
+        </el-form>
+      </el-dialog>
     </div>
-    <model-property ref='modelProperty'></model-property>
+
+    <surface-chart ref="surfaceChart" />
+    <iframe id="downFrame" src="" style="display: none; border: 0; padding: 0; height: 0; width: 0"></iframe>
+    <model-property ref="modelProperty"></model-property>
   </div>
 </template>
 
@@ -652,23 +450,27 @@
 import $ from "jquery";
 import mapMenuTop from "./MapView/mapMenuTop.vue";
 import mapSpaceTop from "./MapView/mapSpaceTop.vue";
-import ModelProperty from '../views/Tools/ModelProperty.vue'
+import ModelProperty from '../views/Tools/ModelProperty.vue';
+
 import {
   select_Comprehensive_ByPageAndCount,
   select_Comprehensive_SelectWktById,
   comprehensive_selectRoute,
   dataLib_selectFiles, dataQuery_selectFields, dataQuery_selectDomains,
-  dataQuery_selectByPage,
-  comprehensive_selectPubById, comprehensive_selectModelByGuid
+  dataQuery_selectByPage, sign_getPublicKey, inquiry_downloadTiles,
+  comprehensive_selectPubById, comprehensive_selectModelByGuid, dataQuery_selectByGid,
+  dataLib_selectByPage
 } from '../api/api'
 import { getToken } from '@/utils/auth'
-
+import * as echarts from "echarts"
+import axios from 'axios';
 export default {
   name: "",
   components: {
     mapMenuTop,
     mapSpaceTop,
-    ModelProperty
+    ModelProperty,
+
 
   },
   data() {
@@ -724,9 +526,9 @@
         val: 50,
       },
       coordFrom: {
-        lon: 116.3911,
-        lat: 39.9115,
-        height: 100000,
+        lon: "",
+        lat: "",
+        height: "",
       },
       listData: {
         name: null,
@@ -772,6 +574,17 @@
       valueX: 0,
       valueY: 0,
       terrainflag: false,
+      downTitleFlag: false,
+      downTitleData: null,
+      ruleForm: {
+        pass: '',
+        checkPass: '',
+        title: ''
+      },
+      loadingText: '',
+      loading: false,
+      surfaceDeFormFlag: false,
+      option: null
     };
   },
   mounted() {
@@ -797,25 +610,248 @@
       }
     });
     //妯″瀷鎹曟崏
-    this.catchmodel()
-
+    this.catchmodel();
+    this.$bus.$on("titleDown", res => {
+      this.setDownLoadTitle(res);
+    });
+    this.$bus.$on('annexDownload', res => {
+      this.setAnnexDownload(res);
+    })
     window.localStorage.setItem('slider_x', this.valueX);
     window.localStorage.setItem('slider_y', this.valueY);
     window.localStorage.setItem('slider_z', this.valueZ);
   },
   methods: {
+    async setSurfaceDeForm() {
+      var gid = this.$store.state.surfaceDeForm.gid;
+      const data = await dataQuery_selectByGid({ gid: gid, name: 'msurfacedeformationdata' });
+      if (data.code != 200) {
+        return this.$message.error("鏍规嵁GID鏌ヨ鏁版嵁澶辫触");
+      }
 
+
+      this.getSurfaceDeFormData(data.result)
+
+    },
+    async getSurfaceDeFormData(result) {
+      var data = await dataLib_selectByPage({
+        filter: "defpointno = '" + result.defpointno + "'",
+        name: 'msurfacedeformationdata',
+        pageIndex: 1,
+        pageSize: 100000,
+      });
+
+      const data1 = await dataLib_selectByPage({
+        filter: "defpointno = '" + result.defpointno + "'",
+        name: 'msurfacedeformationdatadate',
+        pageIndex: 1,
+        pageSize: 100000,
+      });
+
+      if (data1.code != 200 || data.code != 200) {
+        return this.$message.error("鍦拌〃褰㈠彉鏁版嵁鏌ヨ澶辫触");
+      }
+
+      this.surfaceDeFormFlag = true;
+      var average = data.result;
+      var val = data1.result
+      var xtitle = [];
+      var val1 = [];
+      var val2 = [];
+      for (var i in val) {
+        val1.push(average[0].seqvar);
+        xtitle.push(this.formDate(val[i].defdate))
+        val2.push(val[i].seqvar)
+      }
+      debugger
+      this.showSurfaceDeFormEchart(xtitle, val1, val2);
+
+    },
+    formDate(res) {
+      var time = new Date(res);
+      var y = time.getFullYear();
+      var m = time.getMonth() + 1;
+      var d = time.getDate();
+
+      return (
+        y +
+        '-' +
+        this.add0(m) +
+        '-' +
+        this.add0(d)
+
+      );
+    },
+    //鏍煎紡鍖栨椂闂�
+    add0(m) {
+      return m < 10 ? '0' + m : m;
+    },
+    showSurfaceDeFormEchart(res, res1, res2) {
+
+
+      var dom = document.getElementById('surfaceDeFormEchart');
+      // var myChart = echarts.init(chartDom);
+      if (this.option != null) {
+        dom.removeAttribute("_echarts_instance_"); // 绉婚櫎瀹瑰櫒涓婄殑 _echarts_instance
+      }
+
+      var myChart = echarts.init(dom, null, {
+        renderer: "canvas",
+        useDirtyRect: false,
+      });
+
+
+      this.option = {
+
+        tooltip: {
+          trigger: 'axis',
+          formatter: function (params) {
+            return params[0].axisValue +
+              '<br/>鏃跺簭褰㈠彉閲忥細' + params[1].data + ' mm' +
+              '<br/>骞村舰鍙橀�熺巼锛�' + params[0].data + ' m/a'
+          },
+        },
+        dataZoom: [{
+          type: 'inside', //1骞崇Щ 缂╂斁
+
+        }],
+        grid: {
+          left: '1%',
+          right: '1%',
+          bottom: '1%',
+          containLabel: true
+        },
+        toolbox: {
+          feature: {
+            saveAsImage: {}
+          },
+
+        },
+
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          data: res.reverse()
+        },
+        yAxis: {
+          type: 'value',
+          name: "mm",
+        },
+        series: [
+          {
+            name: '骞村舰鍙橀�熺巼',
+            type: 'line',
+            stack: 'Total',
+            data: res1
+          },
+          {
+            name: '鏃跺簭鍙樺舰閲�',
+            type: 'line',
+            stack: 'Total',
+            data: res2.reverse()
+          }
+        ]
+      };
+
+      this.option && myChart.setOption(this.option);
+      window.addEventListener("resize", myChart.resize);
+    },
+    async setAnnexDownload(rs) {
+
+      var type, eventid;
+      if (rs.serveType == 'TMS') {
+        type = 'DOM';
+        eventid = 'dom_' + rs.id;
+      } else if (rs.serveType == 'DEM') {
+        type = 'DEM';
+        eventid = 'dem_' + rs.id
+      }
+
+      var obj = {
+        eventid: eventid,
+        tabName: type,
+      };
+      const res = await dataLib_selectFiles(obj);
+
+      if (res.code != 200) {
+        this.$message.error('闄勪欢鏌ヨ澶辫触');
+        return
+      }
+      if (res.result.length <= 0) {
+        this.$message('鏆傛棤闄勪欢');
+        return
+      }
+
+      this.attachList = res.result;
+      this.showAttach = true;
+    },
+    setDownLoadTitle(res) {
+      this.signGetPublicKey()
+      this.downTitleFlag = true;
+      this.downTitleData = res;
+    },
+    async signGetPublicKey() {
+      const res = await sign_getPublicKey()
+      if (res && res.code == 200) {
+        window.encrypt = new JSEncrypt();
+        encrypt.setPublicKey(res.result);
+      }
+    },
+    submitTitleDown(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          this.downTitleData.title = this.ruleForm.title
+          // this.downTitleData.pwd = encr(this.ruleForm.pass)
+          this.downTitleData.pwd = encrypt.encrypt(this.ruleForm.pass)
+          this.getDownLoadTile(this.downTitleData);
+          this.cannelTitleDown();
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    async getDownLoadTile(res) {
+      this.loading = true;
+      this.loadingText = "鏁版嵁涓嬭浇涓�,璇风◢绛�..."
+      $.ajax({
+        url: BASE_URL + "/inquiry/downloadTiles?token=" + getToken(),
+        type: "POST",
+        data: JSON.stringify(res),
+        dataType: 'json', // html銆乯son銆乯sonp銆乻cript銆乼ext
+        contentType: "application/json", // "application/x-www-form-urlencoded"
+        success: (data) => {
+          var token = getToken()
+          var url = BASE_URL + "/dataLib/downloadFile?token=" + token + "&guid=" + data.result + "&pwd=" + res.pwd;
+          $("#downFrame").attr("src", url).click();
+          this.loading = false;
+          this.loadingText = ""
+        },
+        error: function (e) {
+        }
+      });
+    },
+    cannelTitleDown(formName) {
+      this.downTitleFlag = false;
+      // this.$refs[formName].resetFields();
+      this.ruleForm = {
+        pass: '',
+        checkPass: '',
+        title: ''
+      }
+    },
     catchmodel() {
       var that = this;
       window.pickedFeature;
       window.pickedColor;
       window.modeCatchHandler = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas);
       window.modeCatchHandler.setInputAction((event) => {
-        window.pickedFeature && (window.pickedFeature.color = window.pickedColor);
+        if (window.pickedColor) { window.pickedFeature && (window.pickedFeature.color = window.pickedColor); }
+        // window.pickedFeature && (window.pickedFeature.color = window.pickedColor);
         window.pickedFeature = sgworld.Viewer.scene.pick(event.position);
         if (Cesium.defined(window.pickedFeature)) {
           if (window.pickedFeature.primitive instanceof Cesium.Cesium3DTileset) {
-            if (window.pickedFeature && window.pickedFeature.getProperty) {
+            if (window.pickedFeature) {
               window.pickedColor = window.pickedFeature.color
               window.pickedFeature.color = Cesium.Color.RED.withAlpha(0.3);
 
@@ -828,24 +864,36 @@
       }, Cesium.ScreenSpaceEventType.LEFT_CLICK)
     },
     async setModelInfoData(result) {
-      var modelKey = 'id'
-      if (result.tileset.pubid > 0) {
-        const data = await comprehensive_selectPubById({ id: result.tileset.pubid })
-        if (data.code != 200) {
-          return
-        } else {
+      var modelKey = 'id';
+      var modelid;
+      if (result.tileset) {
 
-          modelKey = JSON.parse(data.result.json).modelid
+        if (result.tileset.pubid && parseInt(result.tileset.pubid) > 0) {
+
+          const data = await comprehensive_selectPubById({ id: result.tileset.pubid })
+
+          if (data.code != 200) {
+            return
+          } else {
+
+            modelKey = JSON.parse(data.result.json).modelid
+          }
+          if (!modelKey) {
+            return this.$message('娌℃湁妯″瀷涓婚敭ID,鏃犳硶鏌ヨ鏁版嵁');
+          }
+          modelid = pickedFeature.getProperty(modelKey);
+
         }
-        if (!modelKey) {
-          return this.$message('娌℃湁妯″瀷涓婚敭ID,鏃犳硶鏌ヨ鏁版嵁');
-        }
+      } else {
+        modelid = '3dml' + result.primitive.id;
       }
       var that = this
-
+      if (!modelid) {
+        modelid = "noAuto_" + pickedFeature.primitive.layerId;
+      }
       var obj = {
         layerid: pickedFeature.primitive.layerId,
-        modelid: pickedFeature.getProperty(modelKey)
+        modelid: modelid
       }
 
       const data1 = await comprehensive_selectModelByGuid(obj);
@@ -863,7 +911,7 @@
       }
 
       that.$store.state.catModelInfo = {
-        id: pickedFeature.getProperty(modelKey),
+        id: modelid,
         name: name,
         type: type,
         bak: bak,
@@ -871,10 +919,7 @@
         layerName: pickedFeature.primitive.id
       };
       that.$refs && that.$refs.modelProperty && that.$refs.modelProperty.open();
-
     },
-
-
     drawTerrainLevel() {
       this.clearTerrainLevel()
       var deep = parseFloat(this.terrainFrom.height)
@@ -897,6 +942,20 @@
         window.TerrainFlattening && window.TerrainFlattening.remove();
       }
     },
+    addGaoDeMap() {
+      Viewer.imageryLayers.removeAll();
+      var base_ulr = window.sceneConfig.baseUrl;
+      if (base_ulr.indexOf('{host}') > -1) {
+        base_ulr = base_ulr.replace("{host}", iisHost)
+      }
+      Viewer.imageryLayers.addImageryProvider(
+        new Cesium.UrlTemplateImageryProvider({
+          url: base_ulr,
+          maximumLevel: 5
+        })
+      );
+
+    },
     init3DMap() {
       var webKey = "94a34772eb88317fcbf8428e10448561";
       //鍦板浘鍒濆鍖�
@@ -904,8 +963,32 @@
 
         licenseServer: window.sceneConfig.licenseServer,
       });
-      window.Viewer = window.sgworld._Viewer;
+      var url = "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/?callback=loadJsonp940826&f=json"
+      // var data = $.parseJSON($.ajax({
+      //   url: url,//json鏂囦欢浣嶇疆锛屾枃浠跺悕
+      //   dataType: "json", //杩斿洖鏁版嵁鏍煎紡涓簀son
+      //   timeout: 1500, // 璇锋眰瓒呮椂鏃堕棿
+      //   async: false
+      // }).responseText);
+      $.ajax({
+        url: url,
+        timeout: 1500, // 璇锋眰瓒呮椂鏃堕棿
+        async: true,
+        type: "GET",
+        success: (res) => {
+          console.log("鍦ㄧ嚎鍦板潃鑾峰彇鎴愬姛")
+        },
+        error: (res) => {
+          console.log("鍦ㄧ嚎鍦板潃鑾疯幏鍙栧け璐�")
+         this.addGaoDeMap();
+        }
+      })
 
+
+      window.Viewer = window.sgworld._Viewer;
+      if (is_production) {
+        this.addGaoDeMap();
+      }
       //瀹氫綅
       // sgworld.Navigate.jumpTo({
       //   //璺宠浆瑙嗚
@@ -935,6 +1018,24 @@
       //寮�鍚繁搴︽娴�
       // sgworld.Analysis.depthTestAgainstTerrain(true)
       Viewer.scene.globe.depthTestAgainstTerrain = true;
+      if (is_production) {
+
+        var base_ulr = window.sceneConfig.baseUrl;
+        if (base_ulr.indexOf('{host}') > -1) {
+          base_ulr = base_ulr.replace("{host}", iisHost)
+        }
+        window.TileMapLayer = Viewer.imageryLayers.addImageryProvider(
+          new Cesium.UrlTemplateImageryProvider({
+            url: base_ulr,
+            maximumLevel: 9
+          })
+        );
+        window.BaseMapLayer = Viewer.imageryLayers.addImageryProvider(
+          new Cesium.UrlTemplateImageryProvider({
+            url: base_ulr,
+          })
+        );
+      }
 
       var option = {
         url: window.sceneConfig.SGUrl,
@@ -943,10 +1044,14 @@
       };
       window.terrainLayer = sgworld.Creator.sfsterrainprovider("", option, "", true, "");
 
+      // window.terrainLayer = new Cesium.CesiumTerrainProvider({
+      //   // url: LFData + '/3d/terrain/dem20230321'
+      //   url: demLayer
+      // });
+      // Viewer.terrainProvider = window.terrainLayer
+      window.terrainFlag = 'MPT'
       window.elevationTool = new SmartEarth.ElevationTool(window.sgworld);
       elevationTool.setContourColor("#F1D487");
-
-
     },
     //dem鍒囨崲
     changeTerrainLayer() {
@@ -967,7 +1072,8 @@
         window.terrainLayer = null;
 
         window.terrainLayer = new Cesium.CesiumTerrainProvider({
-          url: LFData + '/3d/terrain/dem20230321'
+          // url: LFData + '/3d/terrain/dem20230321'
+          url: demLayer
         });
         Viewer.terrainProvider = window.terrainLayer
         Viewer.camera.flyTo({
@@ -978,12 +1084,11 @@
             roll: 0.0
           }
         });
-
       }
       this.terrainflag = !this.terrainflag
     },
     changeMenulayer() {
-      this.$bus.$emit("setChangeBaseMapLayer", true)
+      this.$bus.$emit("setChangeBaseMapLayer", { type: 'Cesium', boolen: true })
       // this.$refs && this.$refs.addOnlineMap && this.$refs.addOnlineMap.open("鍦颁笅妯″紡", null,);
       // this.isActive = !this.isActive;
       // this.isMenuLayer = !this.isMenuLayer;
@@ -1143,17 +1248,27 @@
           this.$store.state.propertiesFlag = null;
           this.showAttribute = false;
           break;
+        case 7:
+          this.surfaceDeFormFlag = false;
+          break;
       }
     },
     //瀹氫綅
     setCoordLocal() {
-      var lon = parseFloat(this.coordFrom.lon);
-      var lat = parseFloat(this.coordFrom.lat);
-      var height = parseFloat(this.coordFrom.height);
+      if (!this.coordFrom.lon) {
+        return this.$message('璇疯緭鍏ョ粡搴�');
+      }
+      if (!this.coordFrom.lat) {
+        return this.$message('璇疯緭鍏ョ含搴�');
+      }
+      var lon = parseFloat(this.coordFrom.lon)
+      var lat = parseFloat(this.coordFrom.lat)
+      var height = parseFloat(this.coordFrom.height) == NaN ? parseFloat(this.coordFrom.height) : 100;
+
       var position = {
         X: lon,
         Y: lat,
-        Altitude: 2000,
+        Altitude: height,
       };
       if (this.imagePoint != null) {
         sgworld.Creator.DeleteObject(this.imagePoint);
@@ -1495,7 +1610,7 @@
         return
       }
       if (res.result.length <= 0) {
-        this.$message.error('鏆傛棤闄勪欢');
+        this.$message('鏆傛棤闄勪欢');
         return
       }
 
@@ -1651,7 +1766,7 @@
       }
 
       if (!data.result.length) {
-        this.$message.error("鏈煡璇㈠埌鍕樻帰淇℃伅鏁版嵁");
+        this.$message("鏈煡璇㈠埌鍕樻帰淇℃伅鏁版嵁");
         return
       }
       this.showAttribute = !this.showAttribute;
@@ -1694,11 +1809,13 @@
   width: 100%;
   height: 100%;
   position: relative;
+
   #mapdiv {
     width: 100%;
     height: 100%;
     overflow: hidden;
     position: relative;
+
     .toponymicLocalBox {
       width: 350px;
       //width: 750px;
@@ -1708,6 +1825,7 @@
       right: 8%;
       bottom: 1%;
     }
+
     .bufferBox {
       width: 412px;
       height: 230px;
@@ -1716,6 +1834,7 @@
       right: 6%;
       bottom: 1%;
     }
+
     .coordLocalBox {
       width: 350px;
       height: 370px;
@@ -1723,7 +1842,12 @@
       position: absolute;
       right: 8%;
       bottom: 1%;
+
+      span {
+        width: 100px;
+      }
     }
+
     .propertiesPop {
       width: 350px;
       height: 370px;
@@ -1731,13 +1855,31 @@
       position: absolute;
       right: 8%;
       bottom: 1%;
+
       /deep/ .el-card__header {
         padding: 10px 20px;
       }
+
       /deep/ .el-card__body {
         padding: 10px 20px;
       }
     }
+
+    .surfaceDeFormPop {
+      z-index: 40;
+      position: absolute;
+      right: 8%;
+      bottom: 1%;
+
+      /deep/ .el-card__header {
+        padding: 10px 20px;
+      }
+
+      /deep/ .el-card__body {
+        padding: 10px 20px;
+      }
+    }
+
     .modelClipPop {
       width: 350px;
       z-index: 40;
@@ -1746,10 +1888,12 @@
       top: 3%;
       background: rgba(255, 255, 255, 0.85);
       border: 1px solid rgba(32, 160, 255, 0.6);
+
       .slide-bg {
         padding: 10px;
         display: flex;
         align-items: center;
+
         .slide {
           width: 250px;
           margin-left: 5px;
@@ -1757,6 +1901,7 @@
         }
       }
     }
+
     .pathAnalysisBox {
       width: 412px;
       height: 370px;
@@ -1765,6 +1910,7 @@
       right: 8%;
       bottom: 1%;
     }
+
     .attributionPop {
       width: 350px;
       height: 370px;
@@ -1772,13 +1918,16 @@
       position: absolute;
       right: 38%;
       bottom: 1%;
+
       /deep/ .el-card__header {
         padding: 10px 20px;
       }
+
       /deep/ .el-card__body {
         padding: 10px 20px;
       }
     }
+
     .terrainLevelBox {
       width: 350px;
       height: 370px;
@@ -1792,15 +1941,18 @@
       opacity: 0.85;
       border: 1px solid rgba(32, 160, 255, 0.6);
     }
+
     .menu_Top {
       width: 100%;
       padding: 1%;
       position: absolute;
       z-index: 40;
+
       /deep/.el-form-item {
         margin-bottom: 0px;
       }
     }
+
     .menu_Popup {
       background: #303030;
       opacity: 0.85;
@@ -1812,12 +1964,14 @@
       position: absolute;
       z-index: 40;
     }
+
     .HistLeng {
       z-index: 40;
       position: absolute;
       right: 115px;
       bottom: 10px;
     }
+
     .lengend {
       width: 300px;
       z-index: 40;
@@ -1825,18 +1979,23 @@
       right: 1%;
       bottom: 13%;
       transform: rotate(90deg);
+
       .lengendBox {
         .lengendSpan {
           display: flex;
           justify-content: space-between;
           margin-top: 10px;
+
           div {
             transform: rotate(-90deg);
           }
         }
+
         .lengendImg {
-          -ms-transform: rotate(180deg); /* IE 9 */
-          -webkit-transform: rotate(180deg); /* Safari and Chrome */
+          -ms-transform: rotate(180deg);
+          /* IE 9 */
+          -webkit-transform: rotate(180deg);
+          /* Safari and Chrome */
           transform: rotate(180deg);
           width: 100%;
           height: 30px;
@@ -1907,9 +2066,11 @@
   border-radius: 5px;
   cursor: pointer;
 }
+
 .center1 {
   right: 1%;
 }
+
 .right {
   position: absolute;
   top: 50px;
@@ -1921,6 +2082,7 @@
   flex-direction: column;
   justify-content: space-between;
 }
+
 // .CenDiv:hover {
 //   border: 1px solid #409eff;
 // }
@@ -1932,6 +2094,7 @@
   background-size: 100% 100%;
   border-radius: 5px;
 }
+
 .menuLayer {
   width: 100%;
   height: 100%;
@@ -1950,6 +2113,7 @@
   background-repeat: no-repeat;
   background-size: contain;
 }
+
 //.changeMapType {
 //  position: absolute;
 //  bottom: 1%;
@@ -1966,45 +2130,12 @@
 //
 //  cursor: pointer;
 //}
-.changeTerrain {
-  position: absolute;
-  bottom: 84px;
-  right: 46px;
-  height: 30px;
-  width: 30px;
-  z-index: 101;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  cursor: pointer;
-  border: 1px solid rgba(255, 255, 255, 0.5);
-}
-.changeLayer {
-  position: absolute;
-  bottom: 116px;
-  right: 46px;
-  height: 30px;
-  width: 30px;
-  z-index: 101;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  cursor: pointer;
-  border: 1px solid rgba(255, 255, 255, 0.5);
-}
-.changeMapType {
-  position: absolute;
-  bottom: 52px;
-  right: 46px;
-  height: 30px;
-  width: 30px;
-  z-index: 101;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  cursor: pointer;
-  border: 1px solid rgba(255, 255, 255, 0.5);
-}
+.changeTerrain {}
+
+.changeLayer {}
+
+.changeMapType {}
+
 //.changeTerrain {
 //  position: absolute;
 //  bottom: 1%;
@@ -2030,6 +2161,7 @@
 
   //background-size: contain;
 }
+
 .mapTerrain {
   width: 100%;
   height: 100%;
@@ -2040,6 +2172,7 @@
   background-repeat: no-repeat;
   //background-size: contain;
 }
+
 .mapTypeThree {
   width: 100%;
   height: 100%;

--
Gitblit v1.9.3