From e8bcc8ff69702b8c2ba123981a45e668cf95a01b Mon Sep 17 00:00:00 2001 From: wangrui <zephyrs0894@163.com> Date: 星期五, 25 十二月 2020 16:17:35 +0800 Subject: [PATCH] 图层控制 --- src/store/index.js | 4 ++++ src/components/LayerController/modules/LcServiceLayerFilter.vue | 3 +++ src/conf/MapConfig.js | 4 +++- src/views/MapTemplate.vue | 13 +++++++------ src/components/LayerController/modules/LcServiceLayer.vue | 13 +++++++++---- 5 files changed, 26 insertions(+), 11 deletions(-) diff --git a/src/components/LayerController/modules/LcServiceLayer.vue b/src/components/LayerController/modules/LcServiceLayer.vue index 9f7892f..82a30b2 100644 --- a/src/components/LayerController/modules/LcServiceLayer.vue +++ b/src/components/LayerController/modules/LcServiceLayer.vue @@ -8,7 +8,7 @@ </div> <div class="wms-panel"> <div v-for="item in serviceWmsLayerList" :key="item.code" class="layerbox"> - <div><input type="checkbox" :name="'wmsLayer_'+item.code" :checked="item.inLegend" :value="item.code" @change="swAllLayers(item)"/>{{item.name}} <span @click="swFilter(item)" class="btn-filter">杩囨护</span></div> + <div><input type="checkbox" :name="'wmsLayer_'+item.code" :checked="item.checked" :value="item.code" @change="swAllLayers(item)"/>{{item.name}} <span @click="swFilter(item)" class="btn-filter">杩囨护</span></div> <div class="layerbox-item"> <div class="basemap-layer-item" v-for="itm in item.layers" :key="itm.code"><input type="checkbox" :name="'wmsSublayers_'+item.code+'_'+itm.code" :checked="itm.checked" :value="itm.code" @change="swWmsLayer(itm)"/>{{itm.sname}}</div> </div> @@ -34,7 +34,10 @@ computed: { ...mapState({ serviceLayerHelper: (state) => { - return state.serviceLayerHelper; + return state.serviceLayerHelper + }, + mapConfig: (state) => { + return state.mapConfig } }), }, @@ -45,11 +48,13 @@ ...mapMutations(['setSelectedServiceLayer','toggleServiceLayerFilter']), swAllLayers(item){ // eslint-disable-next-line no-debugger - item.inLegend = !item.inLegend + item.checked = !item.checked for(let i = 0, len = item.layers.length; i < len; ++i){ - item.layers[i].checked = item.inLegend + item.layers[i].checked = item.checked } this.updateWms() + + console.log(this.mapConfig) }, swTileLayer(){ console.log('璇ILE鏂规硶鏈疄鐜帮紒') diff --git a/src/components/LayerController/modules/LcServiceLayerFilter.vue b/src/components/LayerController/modules/LcServiceLayerFilter.vue index 8e41a4a..1749296 100644 --- a/src/components/LayerController/modules/LcServiceLayerFilter.vue +++ b/src/components/LayerController/modules/LcServiceLayerFilter.vue @@ -31,6 +31,9 @@ selectedServiceLayer: (state) => { return state.selectedServiceLayer }, + serviceLayerFilters: (state) => { + return state.serviceLayerFilters + } }), }, mounted() { diff --git a/src/conf/MapConfig.js b/src/conf/MapConfig.js index 4dd9d7b..7611aec 100644 --- a/src/conf/MapConfig.js +++ b/src/conf/MapConfig.js @@ -206,7 +206,8 @@ icon_deactived: '', type:'wmts', url: APP_GIS_HOST + '/server/ogcserver/whp_guojie/wmts?x={x}&y={y}&z={z}', - inLegend: false, + inLegend: true, + checked: true, option:{ zoomOffset: 1 } @@ -219,6 +220,7 @@ type:'wms', url: APP_GIS_HOST_PIPELINE + '/server/ogcserver/PipeLine/wms?version=1.1.1', inLegend: true, + checked: true, option:{ layers:'all', styles:'', // Comma-separated list of WMS styles. diff --git a/src/store/index.js b/src/store/index.js index e174d05..5628136 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -2,6 +2,7 @@ import Vue from 'vue' import Vuex from 'vuex' import app from './app' +import mapConfig from '../conf/MapConfig' Vue.use(Vuex) @@ -20,6 +21,9 @@ showServiceLayerFilter: false, // Service鍥惧眰杩囨护鍣� selectedServiceLayer: '', // 浣跨敤杩囨护鍣ㄦ椂锛岃鎵撳紑鐨刉MS鏈嶅姟鐨凜ODE + serviceLayerFilters: {}, // 鏈嶅姟鍥惧眰鎺у埗杩囨护閰嶇疆 + + mapConfig : mapConfig }, mutations: { setMapObj(state, mObject) { diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue index 8ba690c..cbc4bcc 100644 --- a/src/views/MapTemplate.vue +++ b/src/views/MapTemplate.vue @@ -6,7 +6,7 @@ <div class="barline"></div> <lc-service-layer></lc-service-layer> </sgis-layer-controller> - <lc-service-layer-filter v-show="showServiceLayerFilter"></lc-service-layer-filter> + <lc-service-layer-filter v-show="showServiceLayerFilter" ref="serviceLayerFilter"></lc-service-layer-filter> <monitor-panel></monitor-panel> </div> </template> @@ -14,7 +14,7 @@ <script> import 'leaflet/dist/leaflet.css' import Sgis from '@src/Sgis' -import mapConfig from '@/conf/MapConfig' +// 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' @@ -34,7 +34,8 @@ }, computed:{ ...mapState({ - showServiceLayerFilter: state => state.showServiceLayerFilter + showServiceLayerFilter: state => state.showServiceLayerFilter, + mapConfig: state => state.mapConfig }) }, beforeMount(){ @@ -54,13 +55,13 @@ this.mapObj = Sgis.initMap(mapcontainer) this.basemapHelper = Sgis.initBasemapsHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栧熀纭�搴曞浘鍔╂墜 - this.basemapHelper.initBasemap(mapConfig, false) // 绗簩涓弬鏁帮紝琛ㄧず鏄惁鍐呯綉搴曞浘 + this.basemapHelper.initBasemap(this.mapConfig, false) // 绗簩涓弬鏁帮紝琛ㄧず鏄惁鍐呯綉搴曞浘 this.serviceLayerHelper = Sgis.initTileLayersHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栦笟鍔″簳鍥惧姪鎵� - this.serviceLayerHelper.initServiceLayers(mapConfig) + this.serviceLayerHelper.initServiceLayers(this.mapConfig) this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栧姩鎬佽绱犲浘灞傚姪鎵� - this.vectorLayerHelper.initVectorLayers(mapConfig) + this.vectorLayerHelper.initVectorLayers(this.mapConfig) this.setMapObj(this.mapObj) this.setBasemapHelper(this.basemapHelper) -- Gitblit v1.8.0