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上
- pane:String,默認(rèn)overlayPane
- attribution:String =null
在attributionControl中展示的字符串,描述了圖層數(shù)據(jù),通常表示版本等,例如? OpenStreetMap contributors
- attribution:String =null
- bubblingMouseEvents:Boolean=true
方法
- addTo(map:Map|LayerGroup):this
把圖層添加到map上或layergroup中 - remove:this
從map中刪除該圖層 - removeFrom(map:Map):this
從給定的map中刪除該圖層 - getPane(name? : String): HTMLElement
Returns theHTMLElementrepresenting the named pane on the map ,Ifnameis 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 theattribution 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 onmap.addLayer(layer) - onRemove(map:Map):this
從DOM中刪除圖層的dom元素,刪除onAdd中添加的監(jiān)聽,Called onmap.removeLayer(layer). - getEvents():Object
返回一個對象,類似于{ viewreset: this._reset }foraddEventListener,自動在map中添加或刪除這個對象中的事件處理句柄 - getAttribution():String
返回一個包含了HTML的字符串,展示在attributionControl中 - beforeAdd(map:Map):this
可選方法,Called onmap.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);
}
}