1. 程式人生 > >leaflet Api中文文件

leaflet Api中文文件

L.Map

 

API各種類中的核心部分,用來在頁面中建立地圖並操縱地圖.

使用 example

 
  1. // initialize the map on the "map" div with a given center and zoom

  2. var map = L.map('map', {

  3. center: [51.505, -0.09],

  4. zoom: 13

  5. });

構造器

構造器 使用 描述
L.Map( <HTMLElement|String> id, <
Map options
> options? )
new L.Map(…)
L.map(…)
通過div元素和帶有地圖選項的描述的文字物件來例項化一個地圖物件,其中文字物件是可選的。

Options

Map State Options

選項 型別 預設值 描述
center LatLng null 初始化地圖的地理中心.
zoom Number null 初始化地圖的縮放.
layers ILayer[] null 初始化後加載到地圖上的圖層.
minZoom Number null 地圖的最小檢視。可以重寫地圖圖層的minZoom.
maxZoom Number null 地圖的最大檢視。可以重寫地圖圖層的maxZoom.
maxBounds LatLngBounds null 當這個選項被設定後,地圖被限制在給定的地理邊界內,當用戶平移將地圖拖動到檢視以外的範圍時會出現彈回的效果, 並且也不允許縮小檢視到給定範圍以外的區域(這取決於地圖的尺寸)。 使用
setMaxBounds
方法可以動態地設定這種約束.
crs CRS L.CRS.
EPSG3857
使用的座標系,當你不確定座標系是什麼時請不要更改.

Interaction Options

選項 型別 預設值 描述
dragging Boolean true 決定地圖是否可被滑鼠或觸控拖動.
touchZoom Boolean true 決定地圖是否可被兩隻手指觸控拖拽縮放.
scrollWheelZoom Boolean true 決定地圖是否被被滑鼠滾輪滾動縮放.
doubleClickZoom Boolean true 決定地圖是否可被雙擊縮放.
boxZoom Boolean true 決定地圖是否可被縮放到滑鼠拖拽出的矩形的檢視,滑鼠拖拽時需要同時按住shift鍵.
tap Boolean true Enables mobile hacks for supporting instant taps (fixing 200ms click delay on iOS/Android) and touch holds (fired as contextmenu events).
tapTolerance Number 15 The max number of pixels a user can shift his finger during touch for it to be considered a valid tap.
trackResize Boolean true 確定地圖在視窗尺寸改變時是否可以自動處理瀏覽器以更新檢視.
worldCopyJump Boolean false 當這個選項可用時,當你平移地圖到其另一個領域時會被地圖捕獲到,並無縫地跳轉到原始的領域以保證所有標註、向量圖層之類的覆蓋物仍然可見.
closePopupOnClick Boolean true 當你不想使用者點選地圖關閉訊息彈出框時,請將其設定為false .

Keyboard Navigation Options

選項 型別 預設值 描述
keyboard Boolean true 聚焦到地圖且允許使用者通過鍵盤的方向鍵和+/-鍵來漫遊地圖.
keyboardPanOffset Number 80 確定按鍵盤方向鍵時地圖平移的畫素.
keyboardZoomOffset Number 1 確定鍵盤+ or -鍵對於的縮放級數.

Panning Inertia Options

選項 型別 預設值 描述
inertia Boolean true 如果該選項可用,在拖動和在某一時間段內持續朝同一方向移動建有動力的地圖時,會有慣性的效果.
inertiaDeceleration Number 3000 確定慣性移動減速的速率,單位是畫素每秒的二次方2.
inertiaMaxSpeed Number 1500 慣性移動的最大速度,單位是畫素每秒.
inertiaThreshold Number depends 放開滑鼠或是觸控來停止慣性移動與移動停止之間的毫秒數.

Control options

選項 型別 預設值 描述
zoomControl Boolean true 確定zoom control是否預設載入在地圖上 .
attributionControl Boolean true 確定attribution control是否預設載入在地圖上.

Animation options

選項 型別 預設值 描述
fadeAnimation Boolean depends 確定瓦片淡出動畫是否可用。通常預設在所有瀏覽器中都支援CSS3轉場,android例外.
zoomAnimation Boolean depends 確定瓦片縮放動畫是否可用。通常預設在所有瀏覽器中都支援CSS3轉場,android例外.
zoomAnimationThreshold Number 4 Won't animate zoom if the zoom difference exceeds this value.
markerZoomAnimation Boolean depends 確定註記的縮放是否隨地圖縮放動畫而播放,如果被禁用,註記在動畫中拉長時會消失。通常預設在所有瀏覽器中都支援CSS3轉場,android例外.

Events

You can subscribe to the following events using these methods.

Event Data 描述
click MouseEvent 使用者點選或觸控地圖時觸發.
dblclick MouseEvent 使用者雙擊或連續兩次觸控地圖時觸發.
mousedown MouseEvent 使用者按下滑鼠按鍵時觸發.
mouseup MouseEvent 使用者按下滑鼠按鍵時觸發.
mouseover MouseEvent 滑鼠進入地圖時觸發.
mouseout MouseEvent 滑鼠離開地圖時觸發.
mousemove MouseEvent 滑鼠在地圖上移動時觸發.
contextmenu MouseEvent 當用戶在地圖上按下滑鼠右鍵時觸發,如果有監聽器在監聽這個時間,則瀏覽器預設的情景選單被禁用.
focus Event 當用戶在地圖上進行標引、點選或移動時進行聚焦.
blur Event 當地圖失去焦點時觸發.
preclick MouseEvent 當滑鼠在地圖上點選之前觸發。有時會在點選滑鼠時,並在已存在的點選事件開始處理之前想要某件事情發生時用得到.
load Event 當地圖初始化時觸發。(當地圖的中心點和縮放初次設定時).
unload Event Fired when the map is destroyed with remove method.
viewreset Event 當地圖需要重繪內容時觸發。(通常在地圖縮放和載入時發生)這對於建立使用者自定義的疊置圖層非常有用.
movestart Event 地圖檢視開始改變時觸發。(比如使用者開始拖動地圖).
move Event 所有的地圖檢視移動時觸發.
moveend Event 當地圖檢視結束改變時觸發。(比如使用者停止拖動地圖).
dragstart Event 使用者開始拖動地圖時觸發.
drag Event 使用者拖動地圖時不斷重複地觸發.
dragend Event 使用者停止拖動時觸發.
zoomstart Event 當地圖縮放即將發生時觸發。(比如縮放動作開始前).
zoomend Event 當地圖縮放時觸發.
zoomlevelschange Event Fired when the number of zoomlevels on the map is changed due to adding or removing a layer.
resize ResizeEvent Fired when the map is resized.
autopanstart Event 開啟彈出視窗時地圖開始自動平移時觸發.
layeradd LayerEvent 當一個新的圖層新增到地圖上時觸發.
layerremove LayerEvent 當一些圖層從地圖上移除時觸發.
baselayerchange LayerEvent 當通過layer control改變基礎圖層時觸發.
overlayadd LayerEvent Fired when an overlay is selected through the layer control.
overlayremove LayerEvent Fired when an overlay is deselected through the layer control.
locationfound LocationEvent 當地理定址成功時觸發(使用locate方法)
locationerror ErrorEvent 當地理定址錯誤時觸發(使用locate方法)
popupopen PopupEvent 當彈出框開啟時觸發(使用openPopup方法)
popupclose PopupEvent 當彈出框關閉時觸發(使用closePopup方法)

地圖狀態修改

方法 返回值 描述
setView( <LatLng> center, <Number> zoom, <zoom/pan options> options? ) this 設定地圖(設定其地理中心和縮放).
setZoom( <Number> zoom, <zoom options> options? ) this 設定地圖的縮放.
zoomIn( <Number> delta?, <zoom options> options? ) this 通過delta變數放大地圖的級別,1是delta的預設值.
zoomOut( <Number> delta?, <zoom options> options?) this 通過delta變數縮小地圖的級別,1是delta的預設值.
setZoomAround( <LatLng> latlng, <Number> zoom, <zoom options> options? ) this Zooms the map while keeping a specified point on the map stationary (e.g. used internally for scroll zoom and double-click zoom).
fitBounds( <LatLngBounds> bounds, <fitBounds options> options? ) this 將地圖檢視儘可能大地設定在給定的地理邊界內.
fitWorld( <fitBounds options> options? ) this 將地圖檢視儘可能大地設定在包含全部地域的級別上.
panTo( <LatLng> latlng, <pan options> options? ) this 將地圖平移到給定的中心。如果新的中心點在螢幕內與現有的中心點不同則產生平移動作.
panInsideBounds( <LatLngBounds> bounds ) this 平移地圖到坐落於給定邊界最接近的檢視內.
panBy( <Point> point, <pan options> options? ) this 通過給定的畫素值對地圖進行平移.
invalidateSize( <Boolean> options?, <zoom/pan options> options? ) this 檢查地圖容器的大小是否改變並更新地圖,如果是這樣的話,在動態改變地圖大小後呼叫,如果animate是true的話,對地圖進行更新.
setMaxBounds( <LatLngBounds> bounds, <zoom/pan options> options? ) this 將地圖限定在給定的邊界內 (map maxBounds).
locate( <Locate options> options? ) this 用地理定位介面Geolocation API獲取使用者位置資訊,在成功定位或定位出錯產生locationerror後解除location-found事件與定位資料,且將地圖檢視設定到檢測的確切的使用者的位置(如果定位失敗則回到地域檢視)。在Locate options中有更多詳細內容。
stopLocate() this 停止觀看以前由map.locate({.:true})發起的位置,如果使用{setView:true}呼叫map.locate,則中止重置地圖檢視。
remove() this 銷燬地圖並清除所有相關事件偵聽器。

獲取地圖狀態

方法 返回值 描述
getCenter() LatLng 返回地圖檢視的地理中心.
getZoom() Number 獲取地圖檢視現在所處的縮放級別.
getMinZoom() Number 返回地圖最小的縮放級別.
getMaxZoom() Number 返回地圖最大的縮放級別.
getBounds() LatLngBounds 返回地圖檢視的經緯度邊界.
getBoundsZoom( <LatLngBounds> bounds, <Boolean> inside? ) Number 返回適應整個地圖檢視邊界的最大縮放級別。如果inside的設定時true,這個方法返回適應整個地圖檢視邊界的最小縮放級別.
getSize() Point 返回現有地圖容器的大小.
getPixelBounds() Bounds 返回地圖檢視在畫素投影座標系下的邊界。(很多時候對使用者自定義圖層和疊加很有用).
getPixelOrigin() Point 返回地圖圖層畫素投影座標系下的左上角的點。(很多時候對使用者自定義圖層和疊加很有用).

圖層控制/h3>

方法 返回值 描述
addLayer( <ILayer> layer, <Boolean> insertAtTheBottom? ) this 將圖層新增到地圖上。如果insertAtTheBottom的選項為true,圖層新增時在所以圖層之下。(在切換基底圖時比較有用).
removeLayer( <ILayer> layer ) this 將圖層在地圖上移除.
hasLayer( <ILayer> layer ) Boolean 如果新增的圖層是當前圖層則返回true.
openPopup( <Popup> popup ) this 當關閉前一個彈出框時彈出指定的對話方塊。(確定在同一時間只有一個開啟並可用).
openPopup( <String> html | <HTMLElement> el, <LatLng> latlng, <Popup options> options? ) this 建立帶有指定選項的彈出視窗,並在地圖上的給定點開啟彈出視窗。
closePopup( <Popup> popup? ) this 關閉openPopup開啟的彈出框.
addControl( <IControl> control ) this 在地圖上新增控制選項.
removeControl( <IControl> control ) this 在地圖上移除控制選項.

轉換方法

方法 返回值 描述
latLngToLayerPoint( <LatLng> latlng ) Point 返回地圖圖層上與地理座標相一致的點。(在地圖上進行位置疊加時比較有用).
layerPointToLatLng( <Point> point ) LatLng 返回給定地圖上點的地理座標系.
containerPointToLayerPoint( <Point> point ) Point 將於地圖容器相關的點轉換為地圖圖層相關的點.
layerPointToContainerPoint( <Point> point ) Point 將地圖圖層相關的點轉換為地圖容器相關的點.
latLngToContainerPoint( <LatLng> latlng ) Point 返回與給定地理座標系相符的地圖容器的點.
containerPointToLatLng( <Point> point ) LatLng 返回給定地理容器點的地理座標.
project( <LatLng> latlng, <Number> zoom? ) Point 將地理座標投影到指定縮放級別的畫素座標系中.
unproject( <Point> point, <Number> zoom? ) LatLng 將畫素座標系投影到指定縮放級別的地理座標系中。(預設為當前的縮放級別).
mouseEventToContainerPoint( <MouseEvent> event ) Point 返回滑鼠點選事件物件的畫素座標(與地圖左上角相關).
mouseEventToLayerPoint( <MouseEvent> event ) Point 返回滑鼠點選事件物件的畫素座標(與地圖圖層相關).
mouseEventToLatLng( <MouseEvent> event ) LatLng 返回滑鼠點選事件物件的地理座標.

其他方法

方法 返回值 描述
getContainer() HTMLElement 返回地圖容器物件.
getPanes() MapPanes 返回不同地圖物件的邊框(疊加渲染).
whenReady( <Function> fn, <Object> context? ) this 當地圖的位置和縮放初始化好或是時間發生之後,執行給定的回撥方法,通常傳遞一個函式內容.

位置選項

選項 型別 預設值 描述
watch Boolean false 如果該值為真,則開始利用W3C的watchPosition方法監聽位置變化情況(而不是指監聽一次)。你可以通過map.stoplocate()方法來停止監聽.
setView Boolean false 如果該值為真,則通過自動將地圖檢視定位到使用者一定精度範圍內的位置,如果地理定位失敗則顯示全部地圖.
maxZoom Number Infinity 在使用setView選項時檢視縮放的最大級別.
timeout Number 10000 在觸發locationerror事件之前等待地理定位的毫秒為單位的時間.
maximumAge Number 0 位置監聽的最大生命週期。如果比最後定位回覆後毫秒用時短,則locate返回一個快取位置.
enableHighAccuracy Boolean false 開啟高精度,參加 W3C SPEC的描述.

Zoom/pan options

選項 型別 預設值 描述
reset Boolean false 如果是真的,地圖檢視將被完全重置(沒有任何動畫)。
pan pan options - 設定平移選項(如果沒有縮放變化),如果發生。
zoom zoom options - 設定縮放變焦的選項。
animate Boolean - 一個相當於將動畫賦予縮放和平移選項的方法(見下文)。

Pan options

選項 型別 預設值 描述
animate Boolean - 如果真的話,如果可能的話,平移總是會被動畫化。如果為false,則它不會進行動畫搖攝,或者如果搖攝超過螢幕,則重置地圖檢視,或者只是為地圖窗格設定新的偏移量(除了“pan.”總是執行後者)。
duration Number 0.25 動畫平移的持續時間。
easeLinearity Number 0.25 平移動畫緩和的曲率因子(三次Bezier曲線的第三引數)。1.0表示線性動畫,曲線越彎曲越少。
noMoveStart Boolean false 如果是真的,平移不會在啟動時開火(在內部用於平移慣性)。

Zoom options

選項 型別 預設值 描述
animate Boolean - 如果未指定,如果縮放原點在當前檢視內,則會發生縮放動畫。如果是真的,地圖將嘗試動畫縮放不管放在何處是變焦原點。設定“假”將使其始終完全重置檢視而無動畫

fitBounds options

The same as zoom/pan options and additionally:

選項 型別 預設值 描述
paddingTopLeft Point [0,0] 設定地圖容器左上角的填充量,在將檢視設定為適合邊界時不應該考慮這些填充量。有用的,如果你有一些控制元件覆蓋在地圖上,就像側邊欄,你不想讓它們模糊你正在縮放的物件。
paddingBottomRight Point [0,0] 同樣的地圖右下角。
padding Point [0,0] 相當於將左上和右下填充設定為相同的值。

Properties

M地圖屬性包括互動操作,允許你在執行環境中互動地控制地圖行為,比如通過拖拽和點選縮放級別顯示和不顯示某要素. Example:

map.doubleClickZoom.disable();

You can also access default map controls like attribution control through map properties:

map.attributionControl.addAttribution("Earthquake data &copy; GeoNames");
Property 型別 描述
dragging IHandler 地圖拖拽處理程式,可以通過滑鼠和觸控的形式.
touchZoom IHandler 觸控地圖縮放處理程式.
doubleClickZoom IHandler 雙擊縮放處理程式.
scrollWheelZoom IHandler 滾動縮放處理程式.
boxZoom IHandler 矩形框(利用滑鼠拖動)縮放處理程式.
keyboard IHandler 鍵盤導向處理程式.
tap IHandler Mobile touch hacks (quick tap and touch hold) handler.
zoomControl Control.Zoom 縮放控制.
attributionControl Control.Attribution 屬性控制.

地圖視窗

望文思義,這是一個包括可以用來放置自定義圖層的不同的地圖視窗的物件。最大的區別是圖層的疊置.

Property 型別 描述
mapPane HTMLElement 包含其他地圖視窗的視窗.
tilePane HTMLElement 切片圖層的視窗.
objectsPane HTMLElement 包含除切片視窗以外所有視窗的視窗.
shadowPane HTMLElement 用來隱藏圖層的視窗(如標註的隱藏).
overlayPane HTMLElement 這線段和多邊形一類圖層的視窗.
markerPane HTMLElement 標註圖示的視窗.
popupPane HTMLElement 彈出的視窗.