From 28b3be6343168d07d5bd3783fd01388a18e90b8c Mon Sep 17 00:00:00 2001 From: 徐旺旺 <11530253@qq.com> Date: 星期二, 06 四月 2021 15:25:14 +0800 Subject: [PATCH] 修改图层控制配置 --- src/views/MapTemplate.vue | 118 +++++++++++++++++++++++++++++++++++++--------------------- 1 files changed, 75 insertions(+), 43 deletions(-) diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue index 5e3f482..9c5005c 100644 --- a/src/views/MapTemplate.vue +++ b/src/views/MapTemplate.vue @@ -11,10 +11,15 @@ <monitor-panel></monitor-panel> <!-- <top-enterprise-panel></top-enterprise-panel>--> <tool-box-panel ref="toolBox"></tool-box-panel> - <menu-special></menu-special> + <!-- <menu-special></menu-special>--> <legend-panel></legend-panel> - <summary-sheets v-show="isShowbtn"></summary-sheets> - <el-button id="mapbtn" type="primary" icon="el-icon-c-scale-to-original" circle @click="isshowhidden"></el-button> + <summary-sheets></summary-sheets> + <enterprise></enterprise> + <!-- <el-button id="map-btn" el-icon-c-scale-to-original icon="el-icon-c-scale-to-original" circle @click="isShowHidden"></el-button>--> + <!-- <el-button type="primary" @click="ChangeState" class="solid-waste">鍥哄簾</el-button>--> + <!-- <el-button type="primary" @click="ChangeWaterState" class="Waste-water">搴熸按</el-button>--> + <!-- <el-button type="primary" @click="AddGasHelper" class="flue-gas">搴熸皵</el-button>--> + <PublicBounced ref="PublicBounced"></PublicBounced> </div> </template> @@ -30,14 +35,19 @@ import summarySheets from '@components/table/summarySheets.vue' import ToolBoxPanel from '@components/panel/ToolBoxPanel' import Popup from '@views/popup/Popup' -import MenuSpecial from '@components/panel/MenuTopic' +// import MenuSpecial from '@components/panel/MenuTopic' import LegendPanel from '@components/panel/LegendPanel' +import Enterprise from '../components/table/enterprise' +// // 鍏叡灞曠ず鏁版嵁 +import PublicBounced from '@components/BaseNav/PublicBounced/PublicBounced' +import LayerFactory from '@components/LayerController/service/LayerFactory' export default { name: 'MapTemplate', components: { + Enterprise, LegendPanel, - MenuSpecial, + // MenuSpecial, ToolBoxPanel, // TopEnterprisePanel, SgisLayerController, @@ -45,16 +55,17 @@ LcBasemap, LcServiceLayer, Popup, - summarySheets + summarySheets, + PublicBounced }, data () { return { - isShowbtn: false, map: null, lcServiceLayerVisible: false, basemapHelper: {}, serviceLayerHelper: {}, - vectorLayerHelper: {} + vectorLayerHelper: {}, + toolBoxVisible: false } }, computed: { @@ -68,9 +79,6 @@ }) }, methods: { - isshowhidden () { - this.isShowbtn = !this.isShowbtn - }, saveMapStatus () { window.serviceLayerHelper = this.serviceLayerHelper this.$store.commit('setMapObj', this.map) @@ -85,15 +93,26 @@ this.map = Sgis.initMap(mapcontainer) this.$refs.toolBox.map = this.map + window.popupComp = this.$refs.popup + var layerFactory = new LayerFactory({ + L: window.L, + map: this.map + }) + layerFactory.init() + window.layerFactory = layerFactory + this.basemapHelper = Sgis.initBasemapsHelper(this.map) // 鍒濆鍖栧熀纭�搴曞浘鍔╂墜 this.basemapHelper.initBasemap(this.config, false) // 绗簩涓弬鏁帮紝琛ㄧず鏄惁鍐呯綉搴曞浘 - this.serviceLayerHelper = Sgis.initTileLayersHelper(this.map) // 鍒濆鍖栦笟鍔″簳鍥惧姪鎵� - console.log('-------' + this.$refs.popup.$el) - this.serviceLayerHelper.initServiceLayers(this.config, this.$refs.popup) + // this.serviceLayerHelper = Sgis.initTileLayersHelper(this.map) // 鍒濆鍖栦笟鍔″簳鍥惧姪鎵� + // console.log('-------' + this.$refs.popup.$el) + // this.serviceLayerHelper.initServiceLayers(this.config, this.$refs.popup) this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.map) // 鍒濆鍖栧姩鎬佽绱犲浘灞傚姪鎵� this.vectorLayerHelper.initVectorLayers(this.config) + + // this.AddGasHelper() + // this.ChangeWaterState() this.saveMapStatus() // this.setMapObj(this.mapObj) @@ -101,35 +120,6 @@ // this.setServiceLayerHelper(this.serviceLayerHelper) // this.setVectorLayerHelper(this.vectorLayerHelper) this.addMarker() - }, - addMarker () { - const L = this.L - var icon = new L.Icon({ - iconUrl: 'assets/images/map/marker-icon.png', - shadowUrl: 'assets/images/map/marker-shadow.png', - iconSize: [25, 41], - iconAnchor: [12, 41], - popupAnchor: [1, -34], - shadowSize: [41, 41] - }) - var marker = L.marker([32.2221, 118.7843], { - icon: icon - }).addTo(this.map) - .bindPopup(() => this.$refs.popup.$el, { - className: 's-map-popup', - minWidth: 300, - closeButton: false, - autoClose: false - }) - .bindTooltip('瀛椾綋鍏夋檿鏁堟灉t.', { - // permanent : true, - offset: [0, 0], // 鍋忕Щ - direction: 'right', // 鏀剧疆浣嶇疆 - // sticky:true,//鏄惁鏍囪鍦ㄧ偣涓婇潰 - className: 'anim-tooltip'// CSS鎺у埗 - }) - - marker.on('popupopen', this.onLayerClick) }, onLayerClick () { this.$refs.popup.setShow() @@ -142,6 +132,26 @@ </script> <style lang="less"> +.flue-gas { + position: fixed; + top: 88px; + left: 180px; + z-index: 500; +} + +.solid-waste { + position: absolute; + top: 88px; + left: 88px; + z-index: 999; +} + +.Waste-water { + position: absolute; + top: 88px; + left: 280px; + z-index: 999; +} .full-screen { width: 100%; @@ -161,5 +171,27 @@ //background-color: #0661AE; border-top: 1px solid #0661AE; } + + #map-btn { + position: fixed; + top: 20px; + left: 100px; + z-index: 9999; + } + + .leaflet-custom-icon { + background: white; + } + + .leaflet-marker-icon { + background: none; + } + + #migic { + width: 48px; + height: 48px; + margin: -18px -20px; + z-index: 999; + } } </style> -- Gitblit v1.8.0