添加企业点图层

chenyabin

2021-04-01 fd4ebe4cf55ef5ecdbbb2fab9ecc3686907770bb

 src/base/BaseVectorLayer.js

@@ -1,4 +1,3 @@
import L from 'leaflet'

/**
 * 基础图层类， 包含图层的创建，加载和清除等基础功能。
@@ -8,12 +7,12 @@
    LOAD_TYPE_URL = 'url' // ajax加载方法
    /**
     * 初始化图层
     * @param {*} options 
     * @param {*} options
     * <code>
     * {
     *   map : '地图引用'
     *   params : 地图加载参数
     *   
     *
     *   code : 图层编号
     *   name : 图层名称
     *   loadType : 图层加载类型， json或者url
@@ -22,114 +21,114 @@
     * }
     * </code>
     */
    constructor(options){
        this.map = options.map // 必填项
        this.params = options.params // 必填项，加载图层数据的参数， 子类需要，可以是{}空对象
    constructor (options) {
      this.map = options.map // 必填项
      this.params = options.params // 必填项，加载图层数据的参数， 子类需要，可以是{}空对象

        this.layerCode = options.code || '' // 图层编码
        this.layerName = options.name || '' // 图层名称
        this.layerLoadType = options.loadType || BaseVectorLayer.LOAD_TYPE_JSON // 图层加载类型
        this.layerUrl = options.url || '' // 数据请求地址
        this.layerData = options.data || '' // 原始GeoJson数据
      this.layerCode = options.code || '' // 图层编码
      this.layerName = options.name || '' // 图层名称
      this.layerLoadType = options.loadType || BaseVectorLayer.LOAD_TYPE_JSON // 图层加载类型
      this.layerUrl = options.url || '' // 数据请求地址
      this.layerData = options.data || '' // 原始GeoJson数据

        this.layerHandler = null // 图层引用
      this.layerHandler = null // 图层引用

        this.features = [] // 所有被构建出来的Features
        this.featuresArray = [] // 所有被构建出来的Features保存备份，避免再次被加载。 load方法全生命周期只被调用一次
      this.features = [] // 所有被构建出来的Features
      this.featuresArray = [] // 所有被构建出来的Features保存备份，避免再次被加载。 load方法全生命周期只被调用一次

        this.featuresGroup = new Map() // 对加载的数据进行分组，便于后续控制。 但在数据初始化时，需要手动分组。否则，分组
      this.featuresGroup = new Map() // 对加载的数据进行分组，便于后续控制。 但在数据初始化时，需要手动分组。否则，分组

        this._init(this.map, this.params)
      this._init(this.map, this.params)
    }

    /**
     * 初始化基本的图层并加载到map中
     */
    _init(map){
        this.layerHandler = L.layerGroup().addTo(map)
    _init (map) {
      this.layerHandler = L.layerGroup().addTo(map)
    }

    /**
     * 加载数据
     * @param boolean isAddToMap 是否直接将marker添加到地图中, 默认是加载
     */
    load(isAddToMap = true){
        if(this.layerHandler) { // 默认，应该只会加载一次，但是如果有的图层要定时刷新，则需要先清除原图层的数据
            this.layerHandler.clearLayers()
        }
    load (isAddToMap = true) {
      if (this.layerHandler) { // 默认，应该只会加载一次，但是如果有的图层要定时刷新，则需要先清除原图层的数据
        this.layerHandler.clearLayers()
      }

        let features = [] 
      const features = []

        // 依据加载方式加载数据
        if(this.layerLoadType === BaseVectorLayer.LOAD_TYPE_JSON) {
            this.features = this._loadFromJSON()
            
        }else if(this.layerLoadType === BaseVectorLayer.LOAD_TYPE_URL) {
            this.features = this._loadFromURL()
        }else {
            console.log('图层【'+this.layerCode+'_'+this.layerName+'】的'+this.loadType+'加载方式暂不支持！')
        }
      // 依据加载方式加载数据
      if (this.layerLoadType === BaseVectorLayer.LOAD_TYPE_JSON) {
        this.features = this._loadFromJSON()
      } else if (this.layerLoadType === BaseVectorLayer.LOAD_TYPE_URL) {
        this.features = this._loadFromURL()
      } else {
        console.log('图层【' + this.layerCode + '_' + this.layerName + '】的' + this.loadType + '加载方式暂不支持！')
      }

        if(isAddToMap){ // 添加到地图中
            this.layerHandler.addLayer(features)
        }
      if (isAddToMap) { // 添加到地图中
        this.layerHandler.addLayer(features)
      }
    }

    _loadFromJSON(){
        console.log('该方法是抽象方法，在子类尚未实现！')
    _loadFromJSON () {
      console.log('该方法是抽象方法，在子类尚未实现！')
    }
    _loadFromURL(){
        console.log('该方法是抽象方法，在子类尚未实现！')

    _loadFromURL () {
      console.log('该方法是抽象方法，在子类尚未实现！')
    }

    /**
     * 显示图层， 如果groups参数，则只显示group对应的图层
     * @param {} groups 数组，元素之与layerGroups键值对应。
     */
    show(groups){
        if(typeof groups !== 'undefined') { // 如果传递了groups， 则按分组的要求加载图层
            if(this.layerHandler) {
                for(let i = 0, len = groups.length; i < len; i++) {
                    let gFeaturesArray = this.featuresGroup.get(groups[i])
                    if(gFeaturesArray || gFeaturesArray.length > 0){
                        gFeaturesArray.forEach(element => {
                            this.layerHandler.removeLayer(element) // 避免被重复加载
                            this.layerHandler.addLayer(element)
                        });
                    }
                }
    show (groups) {
      if (typeof groups !== 'undefined') { // 如果传递了groups， 则按分组的要求加载图层
        if (this.layerHandler) {
          for (let i = 0, len = groups.length; i < len; i++) {
            const gFeaturesArray = this.featuresGroup.get(groups[i])
            if (gFeaturesArray || gFeaturesArray.length > 0) {
              gFeaturesArray.forEach(element => {
                this.layerHandler.removeLayer(element) // 避免被重复加载
                this.layerHandler.addLayer(element)
              })
            }
        } else { // 否则加载全部的数据
            if(this.layerHandler) {
                this.layerHandler.clearLayers()
                for(let i = 0, len = this.featuresArray.length; i < len; ++i){
                    this.layerHandler.addLayer(this.featuresArray[i])
                }
            }
          }
        }
      } else { // 否则加载全部的数据
        if (this.layerHandler) {
          this.layerHandler.clearLayers()
          for (let i = 0, len = this.featuresArray.length; i < len; ++i) {
            this.layerHandler.addLayer(this.featuresArray[i])
          }
        }
      }
    }

    /**
     * 隐藏图层， 如果groups参数，则只隐藏group对应的图层
     * @param {} groups 数组，元素之与layerGroups键值对应。 如果图层在初始加载时，没有对数据分组，该方法不会有效果。
     */
    hide(groups){
        if(typeof groups !== 'undefined') { // 如果传递了groups， 则按分组的要求加载图层
            if(this.layerHandler) {
                for(let i = 0, len = groups.length; i < len; i++) {
                    let gFeaturesArray = this.featuresGroup.get(groups[i])
                    if(gFeaturesArray || gFeaturesArray.length > 0){
                        gFeaturesArray.forEach(element => {
                            this.layerHandler.removeLayer(element)
                        });
                    }
                }
    hide (groups) {
      if (typeof groups !== 'undefined') { // 如果传递了groups， 则按分组的要求加载图层
        if (this.layerHandler) {
          for (let i = 0, len = groups.length; i < len; i++) {
            const gFeaturesArray = this.featuresGroup.get(groups[i])
            if (gFeaturesArray || gFeaturesArray.length > 0) {
              gFeaturesArray.forEach(element => {
                this.layerHandler.removeLayer(element)
              })
            }
        } else { // 否则卸载全部的数据
            if(this.layerHandler) {
                this.layerHandler.clearLayers()
            }
          }
        }
      } else { // 否则卸载全部的数据
        if (this.layerHandler) {
          this.layerHandler.clearLayers()
        }
      }
    }
}