From 807cdba1c918e6b4bf8cb8fef726f59bef4f6876 Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期五, 16 四月 2021 13:44:53 +0800 Subject: [PATCH] 人工数据接口 --- src/views/MapTemplate.vue | 140 +++++++++++++++++++++++++++++++++++----------- 1 files changed, 107 insertions(+), 33 deletions(-) diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue index 8b3b26c..1bbf9e8 100644 --- a/src/views/MapTemplate.vue +++ b/src/views/MapTemplate.vue @@ -1,15 +1,21 @@ <template> <div class="full-screen"> - <div id="map" ref="rootmap"></div> - <sgis-layer-controller :preset="'warningPreset'"> - <lc-basemap></lc-basemap> - <!-- <div class="barline"></div>--> - <lc-service-layer class="barline"></lc-service-layer> - </sgis-layer-controller> - <lc-service-layer-filter v-show="showServiceLayerFilter" ref="serviceLayerFilter"></lc-service-layer-filter> + <popup ref="popup" @callPopup="callPopup"></popup> + <div id="map" ref="rootmap"> + </div> + <sgis-layer-controller></sgis-layer-controller> <monitor-panel></monitor-panel> - <top-enterprise-panel></top-enterprise-panel> - <tool-box-panel></tool-box-panel> + <!-- <top-enterprise-panel></top-enterprise-panel>--> + <tool-box-panel ref="toolBox"></tool-box-panel> + <!-- <menu-special></menu-special>--> + <legend-panel></legend-panel> + <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> @@ -18,37 +24,45 @@ import Sgis from '@src/Sgis' // import mapConfig from '@/conf/MapConfig' import SgisLayerController from '@components/LayerController/LayerController' -import LcBasemap from '@components/LayerController/modules/LcBaseMap' -import LcServiceLayer from '@components/LayerController/modules/LcServiceLayer' -import LcServiceLayerFilter from '@components/LayerController/modules/LcServiceLayerFilter' import MonitorPanel from '@components/panel/RightSearchPanel' -import TopEnterprisePanel from '@components/panel/TopEnterprisePanel' +// import TopEnterprisePanel from '@components/panel/TopEnterprisePanel' +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 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, ToolBoxPanel, - TopEnterprisePanel, + // TopEnterprisePanel, SgisLayerController, MonitorPanel, - LcBasemap, - LcServiceLayer, - LcServiceLayerFilter + Popup, + summarySheets, + PublicBounced }, data () { return { + map: null, + lcServiceLayerVisible: false, basemapHelper: {}, serviceLayerHelper: {}, - vectorLayerHelper: {} + vectorLayerHelper: {}, + toolBoxVisible: false } }, computed: { - showServiceLayerFilter () { - return this.$store.state.map.showServiceLayerFilter - }, - mapConfig () { - return this.$store.state.map.mapConfig + config () { + return this.$store.state.map.config } }, beforeMount () { @@ -58,35 +72,73 @@ }, methods: { saveMapStatus () { - this.$store.commit('setMapObj', this.mapObj) + window.serviceLayerHelper = this.serviceLayerHelper + this.$store.commit('setMapObj', this.map) this.$store.commit('setBasemapHelper', this.basemapHelper) - this.$store.commit('setServiceLayerHelper', this.serviceLayerHelper) + // this.$store.commit('setServiceLayerHelper', this.serviceLayerHelper) this.$store.commit('setVectorLayerHelper', this.vectorLayerHelper) + + this.lcServiceLayerVisible = true }, init () { const mapcontainer = this.$refs.rootmap - this.mapObj = Sgis.initMap(mapcontainer) + this.map = Sgis.initMap(mapcontainer) + this.$refs.toolBox.map = this.map - this.basemapHelper = Sgis.initBasemapsHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栧熀纭�搴曞浘鍔╂墜 - this.basemapHelper.initBasemap(this.mapConfig, false) // 绗簩涓弬鏁帮紝琛ㄧず鏄惁鍐呯綉搴曞浘 + window.popupComp = this.$refs.popup + var layerFactory = new LayerFactory({ + L: window.L, + map: this.map + }) + layerFactory.init(this.$store.state.map.serviceLayers.LayerSewersLine) + layerFactory.initEvent(this.$store.state.map.serviceLayers.LayerSewersLine) + window.layerFactory = layerFactory - this.serviceLayerHelper = Sgis.initTileLayersHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栦笟鍔″簳鍥惧姪鎵� - this.serviceLayerHelper.initServiceLayers(this.mapConfig) + this.basemapHelper = Sgis.initBasemapsHelper(this.map) // 鍒濆鍖栧熀纭�搴曞浘鍔╂墜 + this.basemapHelper.initBasemap(this.config, false) // 绗簩涓弬鏁帮紝琛ㄧず鏄惁鍐呯綉搴曞浘 + this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.map) // 鍒濆鍖栧姩鎬佽绱犲浘灞傚姪鎵� + this.vectorLayerHelper.initVectorLayers(this.config) - this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栧姩鎬佽绱犲浘灞傚姪鎵� - this.vectorLayerHelper.initVectorLayers(this.mapConfig) + // this.AddGasHelper() + // this.ChangeWaterState() this.saveMapStatus() // this.setMapObj(this.mapObj) // this.setBasemapHelper(this.basemapHelper) // this.setServiceLayerHelper(this.serviceLayerHelper) // this.setVectorLayerHelper(this.vectorLayerHelper) + }, + onLayerClick () { + this.$refs.popup.setShow() + }, + callPopup (val) { + console.log(val) } } } </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%; @@ -106,5 +158,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>> +</style> -- Gitblit v1.8.0