From fb98e10c76d7e6c2d01f3a9f8c1b727f905cbdca Mon Sep 17 00:00:00 2001 From: surprise <15810472099@163.com> Date: 星期一, 05 二月 2024 15:30:50 +0800 Subject: [PATCH] 代码更新 --- src/components/mapsdk.vue | 1288 +++++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 834 insertions(+), 454 deletions(-) diff --git a/src/components/mapsdk.vue b/src/components/mapsdk.vue index 81e2456..6e8d491 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,126 +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 - @click="changeMenulayer" - class="center CenDiv" - :class="{ center1: centerFlag }" - > - <div - 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> - </div> - <!-- 鍧″害鍒嗘瀽寮圭獥--> - <div - class="lengend" - v-show="showLengendDialog" + <!-- <div style="display: flex;">--> + <!-- <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> --> + <!-- class="center CenDiv"--> + <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" 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"> <el-card class="box-card"> - <!-- <div - class="lengend_color" - style="height:205px" - > - - </div> --> <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> @@ -345,100 +226,124 @@ <div>52.5掳</div> <div>70掳</div> </div> - </div> </el-card> </div> + <div class="HistLeng" v-show="$store.state.histLenged"> + <el-card class="box-card"> + <table> + <tr> + <td>绮夎川榛忓湡</td> + <td> + <div style="width:100px;height:20px;background:rgba(139,106,77,1)"> + </div> + </td> + </tr> + <tr> + <td>娣ゆ偿璐ㄧ矇鍦�</td> + <td> + <div style="width:100px;height:20px;background:rgba(141,85,69,1)"> + </div> + </td> + </tr> + <tr> + <td>鍦嗙牼</td> + <td> + <div style="width:100px;height:20px;background:rgba(102,166,184,1)"> + </div> + </td> + </tr> + <tr> + <td>鍗电煶</td> + <td> + <div style="width:100px;height:20px;background:rgba(54,83,173,1)"> + </div> + </td> + </tr> + <tr> + <td>娉ュ博</td> + <td> + <div style="width:100px;height:20px;background:rgba(47,30,13,1)"> + </div> + </td> + </tr> + <tr> + <td>缁嗙爞</td> + <td> + <div style="width:100px;height:20px;background:rgba(93,88,15,1)"> + </div> + </td> + </tr> + <tr> + <td>涓爞</td> + <td> + <div style="width:100px;height:20px;background:rgba(164,140,21,1)"> + </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.tabDesc == '鍕樺療宸ョ偣'" - 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 - 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" - 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> @@ -448,135 +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" - > - <img - style="width:100%; height:100%;" - :src="dialog.src" - alt="" - /> + <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> + + <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> @@ -584,20 +450,28 @@ import $ from "jquery"; import mapMenuTop from "./MapView/mapMenuTop.vue"; import mapSpaceTop from "./MapView/mapSpaceTop.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 + dataLib_selectFiles, dataQuery_selectFields, dataQuery_selectDomains, + 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 mapMenu from "./js/index"; +import axios from 'axios'; export default { name: "", components: { mapMenuTop, mapSpaceTop, + ModelProperty, + }, data() { @@ -653,9 +527,9 @@ val: 50, }, coordFrom: { - lon: 116.3911, - lat: 39.9115, - height: 100000, + lon: "", + lat: "", + height: "", }, listData: { name: null, @@ -699,7 +573,19 @@ attributeList: [], valueZ: 0, valueX: 0, - valueY: 0 + valueY: 0, + terrainflag: false, + downTitleFlag: false, + downTitleData: null, + ruleForm: { + pass: '', + checkPass: '', + title: '' + }, + loadingText: '', + loading: false, + surfaceDeFormFlag: false, + option: null }; }, mounted() { @@ -725,39 +611,315 @@ } }); //妯″瀷鎹曟崏 - 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); - this.$store.state.catModel = true; - this.$store.state.catModelInfo = { - id: pickedFeature.getProperty("id"), - name: pickedFeature.getProperty("name"), - layerId: pickedFeature.primitive.layerId, - layerName: pickedFeature.primitive.id - }; + // this.$store.state.catModel = true; + + that.setModelInfoData(window.pickedFeature); } } } }, Cesium.ScreenSpaceEventType.LEFT_CLICK) + }, + async setModelInfoData(result) { + var modelKey = 'id'; + var modelid; + if (result.tileset) { + + 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); + + } + } else { + modelid = '3dml' + result.primitive.id; + } + var that = this + if (!modelid) { + modelid = "noAuto_" + pickedFeature.primitive.layerId; + } + var obj = { + layerid: pickedFeature.primitive.layerId, + modelid: modelid + } + + const data1 = await comprehensive_selectModelByGuid(obj); + + if (data1.code != 200) { + return; + } + var name = null; + var bak = null; + var type = null; + if (data1.result) { + name = data1.result.name; + bak = data1.result.bak; + type = data1.result.type; + } + + that.$store.state.catModelInfo = { + id: modelid, + name: name, + type: type, + bak: bak, + layerId: pickedFeature.primitive.layerId, + layerName: pickedFeature.primitive.id + }; + that.$refs && that.$refs.modelProperty && that.$refs.modelProperty.open(); }, drawTerrainLevel() { this.clearTerrainLevel() @@ -781,15 +943,11 @@ window.TerrainFlattening && window.TerrainFlattening.remove(); } }, - init3DMap() { - var webKey = "94a34772eb88317fcbf8428e10448561"; - //鍦板浘鍒濆鍖� - window.sgworld = new SmartEarth.SGWorld("mapdiv", { + initData() { - licenseServer: window.sceneConfig.licenseServer, - }); - window.Viewer = window.sgworld._Viewer; - + if (is_production) { + mapMenu.addGaoDeMap(); + } //瀹氫綅 // sgworld.Navigate.jumpTo({ // //璺宠浆瑙嗚 @@ -813,28 +971,108 @@ //鏄剧ずfps Viewer.scene.debugShowFramesPerSecond = false; //瀵艰埅鎺т欢 - window.sgworld.navControl("nav", false); + // window.sgworld.navControl("nav", false); //姣斾緥灏� - window.sgworld.navControl("scale", false); + // window.sgworld.navControl("scale", false); //寮�鍚繁搴︽娴� // 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, layerName: window.sceneConfig.mptName, requestVertexNormals: true, }; - sgworld.Creator.sfsterrainprovider("", option, "", true, ""); + 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"); + this.$bus.$emit('addImageLayer', true); + }, + init3DMap() { + var webKey = "94a34772eb88317fcbf8428e10448561"; + //鍦板浘鍒濆鍖� + window.sgworld = new SmartEarth.SGWorld("mapdiv", { + + licenseServer: window.sceneConfig.licenseServer, + }); + window.Viewer = window.sgworld._Viewer; + if (is_production) { + this.initData(); + } else { + var data = mapMenu.init(); + data.then((res) => { + if (!res) { + mapMenu.addGaoDeMap(); + } + this.initData(); + }) + + } + }, + //dem鍒囨崲 + changeTerrainLayer() { + if (this.terrainflag) { + Viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider(); + var option = { + url: window.sceneConfig.SGUrl, + layerName: window.sceneConfig.mptName, + requestVertexNormals: true, + }; + window.terrainLayer = sgworld.Creator.sfsterrainprovider("", option, "", true, ""); + Viewer.camera.flyTo({ + destination: Cesium.Cartesian3.fromDegrees(110, 33, 8000000), + }); + } else { + window.terrainLayer.deleteObject(); + window.terrainLayer = null; + + window.terrainLayer = new Cesium.CesiumTerrainProvider({ + // url: LFData + '/3d/terrain/dem20230321' + url: demLayer + }); + Viewer.terrainProvider = window.terrainLayer + Viewer.camera.flyTo({ + destination: Cesium.Cartesian3.fromDegrees(113.229279, 31.215949, 1000), + orientation: { + heading: 6.08434611923462, + pitch: Cesium.Math.toRadians(-45.0), + 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; @@ -994,17 +1232,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); @@ -1340,12 +1588,13 @@ tabName: tabName, }; const res = await dataLib_selectFiles(obj); + if (res.code != 200) { this.$message.error('闄勪欢鏌ヨ澶辫触'); return } if (res.result.length <= 0) { - this.$message.error('鏆傛棤闄勪欢'); + this.$message('鏆傛棤闄勪欢'); return } @@ -1355,7 +1604,21 @@ //鏄惁鏄剧ず鏌ョ湅鎸夐挳 showAttachDetailBtn(row) { var name = row.name; - if (name.indexOf('.pdf') != -1 || name.indexOf('.jpg') != -1 || name.indexOf('.gif') != -1 || name.indexOf('.png') != -1 || name.indexOf('.jpeg') != -1) { + + if ( + name.indexOf('.pdf') != -1 + || name.indexOf('.jpg') != -1 + || name.indexOf('.gif') != -1 + || name.indexOf('.png') != -1 + || name.indexOf('.jpeg') != -1 + || name.indexOf('.PDF') != -1 + || name.indexOf('.JPG') != -1 + || name.indexOf('.GIF') != -1 + || name.indexOf('.PNG') != -1 + || name.indexOf('.JPEG') != -1 + || name.indexOf('.BMP') != -1 + || name.indexOf('.bmp') != -1 + ) { return true; } return false; @@ -1371,13 +1634,24 @@ showAttachDetail(row) { this.refreshAttatchDetail(); var name = row.name; - if (name.indexOf('.pdf') != -1) { + if (name.indexOf('.pdf') != -1 || name.indexOf('.PDF') != -1) { this.dialog.dialogVisible = true; this.dialog.isPdf = true; var url = BASE_URL + "/comprehensive/downloadForView?guid=" + row.guid + "&token=" + getToken(); this.dialog.src = url } - else if (name.indexOf('.jpg') != -1 || name.indexOf('.gif') != -1 || name.indexOf('.png') != -1 || name.indexOf('.jpeg') != -1) { + else if ( + name.indexOf('.jpg') != -1 + || name.indexOf('.gif') != -1 + || name.indexOf('.png') != -1 + || name.indexOf('.jpeg') != -1 + || name.indexOf('.JPG') != -1 + || name.indexOf('.GIF') != -1 + || name.indexOf('.PNG') != -1 + || name.indexOf('.JPEG') != -1 + || name.indexOf('.BMP') != -1 + || name.indexOf('.bmp') != -1 + ) { this.dialog.dialogVisible = true; this.dialog.isJpg = true; var url = BASE_URL + "/comprehensive/downloadForView?guid=" + row.guid + "&token=" + getToken(); @@ -1414,12 +1688,13 @@ }, //鍕樺療淇℃伅琛� getPointInfo() { - this.showAttribute = !this.showAttribute; + if (this.showAttribute) { - let attrbuteOption = workSite; - var name = attrbuteOption[0].table.replaceAll("_", ""); - this.getAttributeDomFiled(name); + } + let attrbuteOption = workSite; + var name = attrbuteOption[0].table.replaceAll("_", ""); + this.getAttributeDomFiled(name); }, //鑾峰彇姣忎釜琛ㄥ瓧娈靛悕绉板強闃堝�� async getAttributeDomFiled(res) { @@ -1467,11 +1742,18 @@ title: title, filter: "workname = " + "'" + title + "'", } + const data = await dataQuery_selectByPage(parmams); if (data.code != 200) { this.$message.error("璋冪敤鍒楄〃澶辫触,璇疯仈绯诲伐浣滀汉鍛�!"); return; } + + if (!data.result.length) { + this.$message("鏈煡璇㈠埌鍕樻帰淇℃伅鏁版嵁"); + return + } + this.showAttribute = !this.showAttribute; var res_val = attributeFild; for (var i in data.result) { let val_Data = data.result[i]; @@ -1511,11 +1793,13 @@ width: 100%; height: 100%; position: relative; + #mapdiv { width: 100%; height: 100%; overflow: hidden; position: relative; + .toponymicLocalBox { width: 350px; //width: 750px; @@ -1525,6 +1809,7 @@ right: 8%; bottom: 1%; } + .bufferBox { width: 412px; height: 230px; @@ -1533,6 +1818,7 @@ right: 6%; bottom: 1%; } + .coordLocalBox { width: 350px; height: 370px; @@ -1540,7 +1826,12 @@ position: absolute; right: 8%; bottom: 1%; + + span { + width: 100px; + } } + .propertiesPop { width: 350px; height: 370px; @@ -1548,13 +1839,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; @@ -1563,10 +1872,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; @@ -1574,6 +1885,7 @@ } } } + .pathAnalysisBox { width: 412px; height: 370px; @@ -1582,6 +1894,7 @@ right: 8%; bottom: 1%; } + .attributionPop { width: 350px; height: 370px; @@ -1589,13 +1902,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; @@ -1609,15 +1925,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; @@ -1630,6 +1949,13 @@ z-index: 40; } + .HistLeng { + z-index: 40; + position: absolute; + right: 115px; + bottom: 10px; + } + .lengend { width: 300px; z-index: 40; @@ -1637,18 +1963,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; @@ -1707,21 +2038,23 @@ .CenDiv { position: absolute; bottom: 1%; - left: 1%; + left: calc(1% + 75px); height: 40px; width: 60px; z-index: 101; display: flex; flex-direction: column; justify-content: space-between; - box-shadow: 3px 3px 6px #666; - border: 1px solid rgba(204, 204, 204, 0.76); + // box-shadow: 3px 3px 6px #666; + // border: 1px solid rgba(204, 204, 204, 0.76); border-radius: 5px; cursor: pointer; } + .center1 { right: 1%; } + .right { position: absolute; top: 50px; @@ -1733,9 +2066,10 @@ flex-direction: column; justify-content: space-between; } -.CenDiv:hover { - border: 1px solid #409eff; -} + +// .CenDiv:hover { +// border: 1px solid #409eff; +// } .active { width: 100%; height: 100%; @@ -1744,6 +2078,7 @@ background-size: 100% 100%; border-radius: 5px; } + .menuLayer { width: 100%; height: 100%; @@ -1753,37 +2088,82 @@ border-radius: 5px; } -.changeMapType { - position: absolute; - bottom: 1%; - left: calc(1% + 75px); - height: 40px; - width: 60px; - z-index: 101; - display: flex; - justify-content: center; - align-items: center; - // box-shadow: 3px 3px 6px #666; - //border: 1px solid rgba(204, 204, 204, 0.76); - border-radius: 5px; - - cursor: pointer; +.mapBaseMap { + width: 100%; + height: 100%; + //margin-left: 10px; + background-image: url("../assets/img/basemap.png"); + //background-image: url("../assets/img/synthesis/搴曞浘.png"); + background-repeat: no-repeat; + background-size: contain; } + +//.changeMapType { +// position: absolute; +// bottom: 1%; +// left: calc(1% + 150px); +// height: 40px; +// width: 60px; +// z-index: 101; +// display: flex; +// justify-content: center; +// align-items: center; +// // box-shadow: 3px 3px 6px #666; +// //border: 1px solid rgba(204, 204, 204, 0.76); +// border-radius: 5px; +// +// cursor: pointer; +//} +.changeTerrain {} + +.changeLayer {} + +.changeMapType {} + +//.changeTerrain { +// position: absolute; +// bottom: 1%; +// left: 1%; +// height: 40px; +// width: 60px; +// z-index: 101; +// display: flex; +// justify-content: center; +// align-items: center; +// +// border-radius: 5px; +// cursor: pointer; +//} + .mapTypeTwo { width: 100%; height: 100%; margin-left: 10px; - background-image: url("../assets/img/synthesis/3D.png"); + background-image: url("../assets/img/3D.png"); + //background-image: url("../assets/img/synthesis/3D.png"); background-repeat: no-repeat; - background-size: contain; + + //background-size: contain; } + +.mapTerrain { + width: 100%; + height: 100%; + //margin-left: 10px; + //background-image: url("../assets/img/synthesis/鍦板舰.png"); + //background-image: url("../assets/img/synthesis/鍦板舰.png"); + background-image: url("../assets/img/terrain.png"); + background-repeat: no-repeat; + //background-size: contain; +} + .mapTypeThree { width: 100%; height: 100%; - margin-left: 10px; - background-image: url("../assets/img/synthesis/2D 鎷疯礉 2.png"); + //margin-left: 10px; + background-image: url("../assets/img/2D.png"); background-repeat: no-repeat; - background-size: contain; + //background-size: contain; } .pdfClass { -- Gitblit v1.9.3