Layer: Layer.js

    leaflet中的圖層與esri中的圖層不同,esri中的圖層包含多個要素,而leaflet中的每個要素就是一個圖層。(可能有誤解,后期接觸深了再確認(rèn)是否存在誤解)

Layer的基類,定義了方法,繼承了來自L.Evented的所有方法、選項(xiàng)和事件

屬性

  • options:Object 擴(kuò)展了L.Layer的類都會繼承以下選項(xiàng)
    • pane:String,默認(rèn)overlayPane
      默認(rèn)情況下,圖層將被添加到map的overlay pane,覆蓋該選項(xiàng)會將圖層添加到其它pane上
    • attribution:String =null
      在attributionControl中展示的字符串,描述了圖層數(shù)據(jù),通常表示版本等,例如 ? OpenStreetMap contributors
    • bubblingMouseEvents:Boolean=true

方法

  • addTo(map:Map|LayerGroup):this
    把圖層添加到map上或layergroup中
  • remove:this
    從map中刪除該圖層
  • removeFrom(map:Map):this
    從給定的map中刪除該圖層
  • getPane(name? : String): HTMLElement
    Returns the HTMLElement representing the named pane on the map ,If name is omitted, returns the pane for this layer.
  • addInteractiveTarget(targetEl:HTMLElement):this
addInteractiveTarget:function(targetEl){
    this._map._targets[Util.stamp(targetEl)]=this;
    return this;
  }

添加可交互的目標(biāo)對象

  • removeInteractiveTarget(targetEl:HTMLElement):this
  • getAttribution():String
    Used by the attribution control, returns the attribution option

必須要實(shí)現(xiàn)的方法

每個layer都應(yīng)擴(kuò)展L.Layer,并且重新實(shí)現(xiàn)以下方法

  • onAdd(map:Map):this
    為圖層創(chuàng)建DOM元素,把這些DOM元素添加到所屬的map panes中,并且把監(jiān)聽函數(shù)關(guān)聯(lián)到相關(guān)的地圖事件上,Called on map.addLayer(layer)
  • onRemove(map:Map):this
    從DOM中刪除圖層的dom元素,刪除 onAdd中添加的監(jiān)聽,Called on map.removeLayer(layer).
  • getEvents():Object
    返回一個對象,類似于{ viewreset: this._reset }for addEventListener,自動在map中添加或刪除這個對象中的事件處理句柄
  • getAttribution():String
    返回一個包含了HTML的字符串,展示在attributionControl中
  • beforeAdd(map:Map):this
    可選方法,Called on map.addLayer(layer), before the layer is added to the map,before events are initialized, without waiting until the map is in a usable state. Use for early initialization only.

事件

  • @event layeradd: LayerEvent
    Fired when a new layer is added to the map
  • @event layerremove: LayerEvent
    Fired when some layer is removed from the map

用于處理圖層和控件的方法

  • addLayer(layer:Layer):this
  • 其它
/**@method removeLayer(layer: Layer): this */
  removeLayer:function(layer){
    var id=Util.stamp(layer);

    //不存在,則返回
    if(!this._layers[id]){return this;}

    if(this._loaded){
      layer.onRemove(this);
    }

    if(layer.getAttribution&&this.attributionControl){
      this.attributionControl.removeAttribution(layer.getAttribution());
    }

    delete this._layers[id];

    if(this._loaded){
      this.fire('layerremove',{layer:layer});
      layer.fire('remove');
    }

    layer._map=layer._mapToAdd= null;

    return this;
  },

  /**@method hasLayer(layer:Layer):this
   * @description 若包含指定的圖層,返回true
   */
  hasLayer:function(layer){
    //!!否定之否定表示肯定
    return !!layer&&(Util.stamp(layer) in this._layers);
  }

  /**method eachLayer(fn:Function, context?:Object):this
   * 對map中的每個圖層迭代執(zhí)行指定的函數(shù),context表示函數(shù)的上下文
   * * ```
     * map.eachLayer(function(layer){
     *     layer.bindPopup('Hello');
     * });
     * ```
   */
  eachLayer:function(method,context){
    for(var i in this._layers){
      method.call(context,this._layers[i]);
    }
    return this;
  },

  /**@method _addLayers(layers:Array|Object)
   * 添加圖層數(shù)組或組合圖層
   */
  _addLayers:function(layers){
    // 若layers不為空,則判斷是圖層數(shù)組還是組合圖層
    // 若為圖層數(shù)組則返回layers
    // 若為組合圖層,則返回只包含該組合圖層的數(shù)組
    // 若layers為空,則返回一個空的數(shù)組
    layers=layers?(Util.isArray(layers)?layers:[layers]):[];
    for(var i=o,len=layers.length;i<len;i++){
      this.addLayer(layers[i]);
    }
  },

  /**@method _addZoomLimit(layer)
   * 添加對縮放的限制
   */
  _addZoomLimit:function(layer){
    // 判斷圖層的maxZoom和minZoom是否為數(shù)字
    // 若maxZoom是數(shù)字或minZoom不是數(shù)字
    if(isNaN(layer.options.maxZoom)||!isNaN(layer.options.minZoom)){
      this._zoomBoundLayers[Util.stamp(layer)]=layer;
      this._updateZoomLevels();
    }
  },

  /**@method _removeZoomLimit(layer) */
  _removeZoomLimit:function(layer){
    var id=Util.stamp(layer);
    if(this._zoomBoundLayers[id]){
      delete this._zoomBoundLayers[id];
      this._updateZoomLevels();
    }
  },

  /**@method _updateZoomLevels() */
  _updateZoomLevels:function(){
    var minZoom = Infinity,
    maxZoom=-Infinity,
    oldZoomSpan=this._getZoomSpan();

    // 比較獲取minZoom和maxZoom
    for(var i in this._zoomBoundLayers){
      var options=this._zoomBoundLayers[i].options;
      minZoom = options.minZoom ===undefined?minZoom:Math.min(minZoom,options.minZoom);
      maxZoom = options.maxZoom === undefined?maxZoom:Math.max(maxZoom,options.maxZoom);
    }
    this._layersMaxZoom=maxZoom===-Infinity?undefined:maxZoom;
    this._layersMinZoom=minZoom===Infinity?undefined:minZoom;

    // @section Map狀態(tài)變化事件
    //@event zoomlevelschange:Event
    // 當(dāng)?shù)貓D的縮放等級變化時觸發(fā)
    if(oldZoomSpan!===this._getZoomSpan()){
      this.fire('zoomlevelschange');
    }

    if(this.options.maxZoom===undefined&&this._layersMaxZoom&&this.getZoom()>this._layersMaxZoom){
      this.setZoom(this._layersMaxZoom);
    }
    if(this.options.minZoom===undefined&&this._layersMinZoom&&this.getZoom()<this._layersMinZoom){
      this.setZoom(this._layersMinZoom);
    }
  }
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • rljs by sennchi Timeline of History Part One The Cognitiv...
    sennchi閱讀 7,854評論 0 10
  • 每天都渾渾噩噩的,聊聊微信,玩玩游戲,看看電視劇一天就過去了,這樣的生活真可怕,更可怕的是我竟然就這樣過了好幾年,...
    晴萌萌閱讀 190評論 0 0
  • 寫在2019年的第一天,可能是一些碎碎念吧,非專業(yè),無深度,愿你看了有所感悟,我只是寫下了自己的想法碎片 一 月入...
    八級大哥當(dāng)閱讀 366評論 0 0
  • 今天我要跟大家分享了這本書,名字叫喜樂與我。這本書主要講的是有一個人家很窮。爸爸媽媽和兒子。 都要。撿瓶子和罐子才...
    張祚語_5b66閱讀 821評論 0 0

友情鏈接更多精彩內(nèi)容