修改图层控制

徐旺旺

2021-03-05 3c8d1ccc151e7ac4e16b4116cf7452039afcf051

修改图层控制

 src/components/helpers/ServiceLayerHelper.js

@@ -15,7 +15,7 @@
    this.tileLayersWMTSArray = [] // 初始的WMTS集
    this.tileLayersTileArray = [] // 初始的Tile集
    this.tileLayersWMSArray = [] // 初始的WMS集
    this.geojsonArray = {} // 初始的geojson集
    this.layerArray = {} // key为配置的code，加载的图层对象，
    this.layerConfig = {}
    this.regex = /\{(.+?)\}/g // 匹配{}
    this.popupComp = null
@@ -25,14 +25,40 @@
    return this.loadedLayersMap.get(code)
  }

  initDisplayZoom (layerConfig) {
    var that = this
    that.map.on('zoomend ', function (e) {
      const zoom = that.map.getZoom()
      for (var i = 0, l = layerConfig.length; i < l; i++) {
        var config = layerConfig[i]
        var layers = config.layers
        for (var j = 0; j < layers.length; j++) {
          var layer = layers[j]
          if (layer.zoom) {
            if (zoom > layer.zoom) {
              var layerObj = that.layerArray[layer.code]
              layerObj.addTo(that.map)
            } else {
              that.removeLayer(layer)
            }
          }
        }
      }
    })
  }

  /**
     * 根据配置文件初始化业务底图
     */
  initServiceLayers (layerConfig, popupComp) {
    this.layerConfig = layerConfig
    this.popupComp = popupComp
    store.commit('clearSewersDatas')
    store.commit('clearSewersLayers')
    this.loadLayers(layerConfig.mapConfig.Layers.LayerSewersLine)
    this.loadLayers(layerConfig.mapConfig.Layers.layerSewersPoint)
    this.initDisplayZoom(layerConfig.mapConfig.Layers.LayerSewersLine)
    this.initDisplayZoom(layerConfig.mapConfig.Layers.layerSewersPoint)
  }

  /**
@@ -82,11 +108,11 @@
    var code = item.code
    var newUrl = url.replace(this.regex, matchValue)
    var that = this
    if (!that.geojsonArray[code]) {
    if (!that.layerArray[code]) {
      AjaxUtils.GetDataAsynByUrl(newUrl, {}, function (res) {
        store.commit('setSewersDatas', res)
        store.commit('addSewersDatas', res)
        var layer = that.loadGeojson(res, item)
        that.geojsonArray[code] = layer
        that.layerArray[code] = layer
      })
    }
  }
@@ -172,6 +198,7 @@
          })
        }
      }).addTo(featureGroup)
    store.commit('addSewersDatas', geojson)
    if (Object.prototype.hasOwnProperty.call(res, 'features') && res.features.length > 0 && (res.features[0].geometry.type === 'LineString' || res.features[0].geometry.type === 'MultiLineString')) {
      geojson.bringToBack()
    } else {
@@ -181,12 +208,7 @@
  }

  removeLayer (item) {
    var code = item.code
    var layer = this.geojsonArray[code]
    if (layer) {
      this.map.removeLayer(layer)
      delete this.geojsonArray[code]
    }
    this.map.removeLayer(this.layerArray[item.code])
  }

  /**

 src/store/modules/map.js

@@ -14,7 +14,11 @@
  selectedServiceLayer: '', // 使用过滤器时，被打开的WMS服务的CODE
  serviceLayerFilters: {}, // 服务图层控制过滤配置
  checkedLayers: {}, // 选中图层对象
  // 图层数据
  // 图层数据,图层对象
  layers: {
    sewers: []
  },
  // 原始后台JSON数据
  datas: {
    sewers: []
  },
@@ -30,8 +34,17 @@
    state.map = map
  },
  // 设置污雨水图层数据
  setSewersDatas (state, sewersDatas) {
    state.datas.sewers = sewersDatas
  addSewersLayers (state, sewersLayers) {
    state.layers.sewers.push(sewersLayers)
  },
  clearSewersLayers (state, SewersLayers) {
    state.layers.sewers = []
  },
  addSewersDatas (state, sewersDatas) {
    state.datas.sewers.push(sewersDatas)
  },
  clearSewersDatas (state, sewersDatas) {
    state.datas.sewers = []
  },
  setBasemapHelper (state, layerHelper) {
    state.basemapHelper = layerHelper