修改图层控制

徐旺旺

2021-03-01 8687fa2178823a3204b3736bc917a7a31cc82f50

修改图层控制

 src/components/LayerController/modules/LcServiceLayerFilter.vue

@@ -6,7 +6,7 @@
                                          @change="swAllSubFilter(item)">{{item.name}}
                </div>
                <div class="content">
                    <div v-for="filter in item.filters" :key="filter.code">
                    <div v-for="filter in item.layers" :key="filter.code">
                        <input type="checkbox" :value="filter.code" :checked="filter.checked" @change="swSubFilter(item.url,filter)"><label
                            :title="filter.name">{{filter.name}}</label>
                    </div>

 src/components/helpers/ServiceLayerHelper.js

@@ -5,7 +5,6 @@
import AjaxUtils from '@/utils/AjaxUtils'
import store from '@/store'

var myRenderer = window.L.canvas()
class ServiceLayerHelper {
  constructor (options) {
    this.map = options.map
@@ -30,6 +29,7 @@
  initServiceLayers (layerConfig) {
    this.layerConfig = layerConfig
    this.loadLayers(layerConfig.mapConfig.Layers.LayerSewersLine)
    // this.loadLayers(layerConfig.mapConfig.Layers.layerSewersPoint)
  }

  /**
@@ -41,7 +41,6 @@
    console.debug('ServiceLayerHelper加载参数：', layerConfig)
    for (let i = 0, len = layerConfig.length; i < len; ++i) {
      const opt = layerConfig[i]
      if (opt.checked) {
        if (opt.type === 'wmts') {
          this.loadWmtsLayer(opt, isAddToMap)
          this.tileLayersWMTSArray.push(opt)
@@ -53,7 +52,6 @@
          this.tileLayersTileArray.push(opt)
        } else if (opt.type === 'geojson') {
          this.loadGeojsonLayers(opt)
        }
      }
    }
  }
@@ -92,7 +90,8 @@
  loadGeojson (res, layer) {
    var that = this
    var icon = layer.icon
    return that.L.geoJSON(res.features, {
    const featureGroup = that.L.featureGroup().addTo(that.map)
    that.L.geoJSON(res.features, {
      style: function (feature) {
        return {
          fill: true,
@@ -115,11 +114,10 @@
              size: [20, 20]
            }
          })
      },
      renderer: myRenderer
      }
    }).bindPopup(function (layer) {
      return layer.feature.properties.linenumber
    }).addTo(that.map)
    }).addTo(featureGroup).bringToFront()
    return featureGroup
  }

  removeLayer (item) {
@@ -139,11 +137,13 @@
  loadWmtsLayer (options, isAddToMap = true) {
    const layer = this.L.tileLayer(options.url, options.option)
    layer.config = options

    var checked = options.checked
    if (checked) {
    if (isAddToMap) {
      layer.addTo(this.map)
    }
    this.loadedLayersMap.set(options.code, layer)
    }
  }

  /**
@@ -155,11 +155,14 @@
    const layer = this.L.tileLayer.wms(options.url, options.option)
    layer.config = options

    var checked = options.checked
    if (checked) {
    if (isAddToMap) {
      layer.addTo(this.tileLayerWmslayerGroup)
    }
    this.loadedLayersMap.set(options.code, layer)
  }
  }

  /**
     * 往地图中加入一个TILE服务

 src/conf/LayerSewers.js

@@ -99,13 +99,14 @@
    code: 'fsss',
    name: '附属设施',
    checked: false, // 默认选中状态
    type: 'geojson',
    url: APP_GIS_HOST_2 + '/server/ogcserver/PipeLine/wfs?version=1.0.0&TYPENAME={sname}&REQUEST=getfeature&OUTPUTFORMAT=json&maxFeatures=20000',
    filters: [
    layers: [
      {
        code: 'fourlink',
        name: '四通',
        sname: '四通',
        checked: false,
        checked: true,
        icon: 'sewers/四通.png'
      },
      {
@@ -159,8 +160,9 @@
    code: 'hbss',
    name: '环保设施',
    checked: false, // 默认选中状态
    type: 'geojson',
    url: APP_GIS_HOST_2 + '/server/ogcserver/PipeLine/wfs?version=1.0.0&TYPENAME={sname}&REQUEST=getfeature&OUTPUTFORMAT=json&maxFeatures=20000',
    filters: [
    layers: [
      {
        code: 'manhole',
        name: '窨井',
@@ -213,8 +215,9 @@
    code: 'pk',
    name: '排口',
    checked: false, // 默认选中状态
    type: 'geojson',
    url: APP_GIS_HOST_2 + '/server/ogcserver/PipeLine/wfs?version=1.0.0&TYPENAME={sname}&REQUEST=getfeature&OUTPUTFORMAT=json&maxFeatures=20000',
    filters: [
    layers: [
      {
        code: 'dischargeport',
        name: '排放口',
@@ -227,8 +230,9 @@
    code: 'qyxx',
    name: '区域信息',
    checked: false, // 默认选中状态
    type: 'geojson',
    url: APP_GIS_HOST_2 + '/server/ogcserver/PipeLine/wfs?version=1.0.0&TYPENAME={sname}&REQUEST=getfeature&OUTPUTFORMAT=json&maxFeatures=20000',
    filters: [
    layers: [
      {
        code: 'thirdpartypipe',
        name: '第三方管道',