leafLet官方文档链接(英文原版):
https://leafletjs.com/reference-1.3.4.html#marker-bindpopup
文章目录
-
-
leafLet教程
-
-
一、简单入门教程(开始使用leafLet)
-
二、leafLet API 中文文档翻译
-
-
L.Map
-
L.Marker
-
L.Popup
-
L.TileLayer
-
L.TileLayer.WMS
-
L.TileLayer.Canvas
-
L.ImageOverlay
-
L.Path
-
L.Polyline
-
L.MultiPolyline
-
L.Polygon
-
L.MultiPolygon
-
L.Rectangle
-
L.Circle
-
L.CircleMarker
-
L.LayerGroup
-
L.FeatureGroup
-
L.GeoJSON
-
L.LatLng
-
L.LatLngBounds
-
L.Point
-
L.Bounds
-
L.Icon
-
L.DivIcon
-
L.Control
-
L.Control.Zoom
-
L.Control.Attribution
-
L.Control.Layers
-
L.Control.Scale
-
L.Class
-
L.Browser
-
L.Util
-
L.Transformation
-
L.LineUtil
-
L.PolyUtil
-
L.DomEvent
-
L.DomUtil
-
L.PosAnimation
-
L.Draggable
-
IHandler
-
ILayer
-
IControl
-
IProjection
-
ICRS
-
-
-
leafLet教程
Leaflet 是一个为建设移动设备友好的互动地图,而开发的现代的、开源的 JavaScript 库。它是由 Vladimir Agafonkin 带领一个专业贡献者团队开发,虽然代码仅有 33 KB,但它具有开发人员开发在线地图的大部分功能。
Leaflet设计坚持简便、高性能和可用性好的思想,在所有主要桌面和移动平台能高效运作,在现代浏览器上会利用HTML5和CSS3的优势,同时也支持旧的浏览器访问。支持插件扩展,有一个友好、易于使用的API文档和一个简单的、可读的源代码。
leafLet最新版本为1.3.4
一、简单入门教程(开始使用leafLet)
本教程将一步一步的指导你如何使用Leaflet加载地图、使用标记,折线和弹出窗口,处理事件。
如何用leaflet快速加载地图
Leaflet调用各种地图的功能有点复杂,但是你可以使用
leaflet.ChineseTmsProviders
这个插件加载各种地图,这四种地图直接就可以加载进来,十分方便。
此插件代码如下,你可以直接复制该代码为js文件(可命名为
leaflet.ChineseTmsProviders.js
),然后引入你的HTML页面便可使用。
leaflet.ChineseTmsProviders代码:
L.TileLayer.ChinaProvider = L.TileLayer.extend({
initialize: function(type, options) { // (type, Object)
var providers = L.TileLayer.ChinaProvider.providers;
var parts = type.split('.');
var providerName = parts[0];
var mapName = parts[1];
var mapType = parts[2];
var url = providers[providerName][mapName][mapType];
options.subdomains = providers[providerName].Subdomains;
L.TileLayer.prototype.initialize.call(this, url, options);
}
});
L.TileLayer.ChinaProvider.providers = {
TianDiTu: {
Normal: {
Map: "http://t{s}.tianditu.cn/DataServer?T=vec_w&X={x}&Y={y}&L={z}",
Annotion: "http://t{s}.tianditu.cn/DataServer?T=cva_w&X={x}&Y={y}&L={z}"
},
Satellite: {
Map: "http://t{s}.tianditu.cn/DataServer?T=img_w&X={x}&Y={y}&L={z}",
Annotion: "http://t{s}.tianditu.cn/DataServer?T=cia_w&X={x}&Y={y}&L={z}"
},
Terrain: {
Map: "http://t{s}.tianditu.cn/DataServer?T=ter_w&X={x}&Y={y}&L={z}",
Annotion: "http://t{s}.tianditu.cn/DataServer?T=cta_w&X={x}&Y={y}&L={z}"
},
Subdomains: ['0', '1', '2', '3', '4', '5', '6', '7']
},
GaoDe: {
Normal: {
Map: 'http://webrd0{s}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}'
},
Satellite: {
Map: 'http://webst0{s}.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}',
Annotion: 'http://webst0{s}.is.autonavi.com/appmaptile?style=8&x={x}&y={y}&z={z}'
},
Subdomains: ["1", "2", "3", "4"]
},
Google: {
Normal: {
Map: "http://www.google.cn/maps/vt?lyrs=m@189&gl=cn&x={x}&y={y}&z={z}"
},
Satellite: {
Map: "http://www.google.cn/maps/vt?lyrs=s@189&gl=cn&x={x}&y={y}&z={z}"
},
Subdomains: []
},
Geoq: {
Normal: {
Map: "http://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineCommunity/MapServer/tile/{z}/{y}/{x}",
Color: "http://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetColor/MapServer/tile/{z}/{y}/{x}",
PurplishBlue: "http://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetPurplishBlue/MapServer/tile/{z}/{y}/{x}",
Gray: "http://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetGray/MapServer/tile/{z}/{y}/{x}",
Warm: "http://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetWarm/MapServer/tile/{z}/{y}/{x}",
Cold: "http://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetCold/MapServer/tile/{z}/{y}/{x}"
},
Subdomains: []
}
};
L.tileLayer.chinaProvider = function(type, options) {
return new L.TileLayer.ChinaProvider(type, options);
};
下面的代码利用此插件加载出各种地图:
在使用leafLet时,你需要引入js文件和css文件,可以直接线上引入:
首先引入css文件:
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.4/dist/leaflet.css"
integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA=="
crossorigin=""/>
然后在css的后面引入js文件( Make sure you put this AFTER Leaflet’s CSS):
<script src="https://unpkg.com/leaflet@1.3.4/dist/leaflet.js"
integrity="sha512-nMMmRyTVoLYqjP9hrbed9S+FzjZHW5gY1TWCHA5ckwXZBadntCNs8kEqAWdrb9O7rxbCaA4lKTIWjDXZxflOcA=="
crossorigin=""></script>
然后再引入leaflet.ChineseTmsProviders.js文件
(你也可以去下载源文件到你的本地项目进行引用,下载地址为官网地址:(
DownLoad leafLet
)
创建一个容器div存放你的地图,设置id并渲染一些简单的样式(注意:一定要有相应的height属性)
下面是加载几种地图的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>leafLet加载几种地图</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.4/dist/leaflet.css"
integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA=="
crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.3.4/dist/leaflet.js"
integrity="sha512-nMMmRyTVoLYqjP9hrbed9S+FzjZHW5gY1TWCHA5ckwXZBadntCNs8kEqAWdrb9O7rxbCaA4lKTIWjDXZxflOcA=="
crossorigin=""></script>
<!--下面的地址根据你的实际项目地址进行引用-->
<script src="leaflet/leaflet.ChineseTmsProviders.js"></script>
</head>
<body>
<div id="map">
</div>
<script>
/**
* 智图地图内容
*/
var normalm1 = L.tileLayer.chinaProvider('Geoq.Normal.Map', {
maxZoom: 18,
minZoom: 5
});
var normalm2 = L.tileLayer.chinaProvider('Geoq.Normal.Color', {
maxZoom: 18,
minZoom: 5
});
var normalm3 = L.tileLayer.chinaProvider('Geoq.Normal.PurplishBlue', {
maxZoom: 18,
minZoom: 5
});
var normalm4 = L.tileLayer.chinaProvider('Geoq.Normal.Gray', {
maxZoom: 18,
minZoom: 5
});
var normalm5 = L.tileLayer.chinaProvider('Geoq.Normal.Warm', {
maxZoom: 18,
minZoom: 5
});
var normalm6 = L.tileLayer.chinaProvider('Geoq.Normal.Cold', {
maxZoom: 18,
minZoom: 5
});
/**
* 天地图内容
*/
var normalm = L.tileLayer.chinaProvider('TianDiTu.Normal.Map', {
maxZoom: 18,
minZoom: 5
}),
normala = L.tileLayer.chinaProvider('TianDiTu.Normal.Annotion', {
maxZoom: 18,
minZoom: 5
}),
imgm = L.tileLayer.chinaProvider('TianDiTu.Satellite.Map', {
maxZoom: 18,
minZoom: 5
}),
imga = L.tileLayer.chinaProvider('TianDiTu.Satellite.Annotion', {
maxZoom: 18,
minZoom: 5
});
var normal = L.layerGroup([normalm, normala]),
image = L.layerGroup([imgm, imga]);
/**
* 谷歌
*/
var normalMap = L.tileLayer.chinaProvider('Google.Normal.Map', {
maxZoom: 18,
minZoom: 5
}),
satelliteMap = L.tileLayer.chinaProvider('Google.Satellite.Map', {
maxZoom: 18,
minZoom: 5
});
/**
* 高德地图
*/
var Gaode = L.tileLayer.chinaProvider('GaoDe.Normal.Map', {
maxZoom: 18,
minZoom: 5
});
var Gaodimgem = L.tileLayer.chinaProvider('GaoDe.Satellite.Map', {
maxZoom: 18,
minZoom: 5
});
var Gaodimga = L.tileLayer.chinaProvider('GaoDe.Satellite.Annotion', {
maxZoom: 18,
minZoom: 5
});
var Gaodimage = L.layerGroup([Gaodimgem, Gaodimga]);
var baseLayers = {
"智图地图": normalm1,
"智图多彩": normalm2,
"智图午夜蓝": normalm3,
"智图灰色": normalm4,
"智图暖色": normalm5,
"智图冷色": normalm6,
"天地图": normal,
"天地图影像": image,
"谷歌地图": normalMap,
"谷歌影像": satelliteMap,
"高德地图": Gaode,
"高德影像": Gaodimage,
}
var map = L.map("map", {
center: [31.59, 120.29],
zoom: 12,
layers: [normalm1],
zoomControl: false
});
L.control.layers(baseLayers, null).addTo(map);
L.control.zoom({
zoomInTitle: '放大',
zoomOutTitle: '缩小'
}).addTo(map);
</script>
</body>
</html>
二、leafLet API 中文文档翻译
摘自原文地址:
http://blog.sina.com.cn/s/blog_5ff72f610101ku5d.html
L.Map
API各种类中的核心部分,用来在页面中创建地图并操纵地图。
Constructor(构造器)
通过div元素和带有地图选项的描述的文字对象来实例化一个地图对象,其中文字对象是可选的。
Options(选项)
Map State Options(地图状态选项)
centre(中心):初始化地图的地理中心。
zoom(缩放):初始化地图的缩放。
layers(图层):初始化后加载到地图上的图层。
minZoom(最小视图):地图的最小视图。可以重写地图图层的最小视图。
maxZoom(最大视图):地图的最大视图。可以重写地图图层的最大视图。
maxBounds(最大边界):当这个选项被设置后,地图被限制在给定的地理边界内,当用户平移将地图拖动到视图以外的范围时会出现弹回的效果,并且也不允许缩小视图到给定范围以外的区域(这取决于地图的尺寸)。使用setMaxBounds方法可以动态地设置这种约束。
crs(坐标参考系统):使用的坐标系,当你不确定坐标系是什么时请不要更改。
Interaction Options(交互操作)
dragging(拖动):决定地图是否可被鼠标或触摸拖动。
touchZoom(触摸缩放):决定地图是否可被两只手指触摸拖拽缩放。
scrollWheelZoom(滚轮缩放):决定地图是否被被鼠标滚轮滚动缩放。
doubleClickZoom(双击缩放):决定地图是否可被双击缩放。
boxZoom(多边形缩放):决定地图是否可被缩放到鼠标拖拽出的矩形的视图,鼠标拖拽时需要同时按住shift键。
trackResize(追踪尺寸改变):确定地图在窗口尺寸改变时是否可以自动处理浏览器以更新视图。
worldCopyJump(领域副本跳转):当这个选项可用时,当你平移地图到其另一个领域时会被地图捕获到,并无缝地跳转到原始的领域以保证所有标注、矢量图层之类的覆盖物仍然可见。
closePopupOnClick(点击关闭消息弹出框):当你不想用户点击地图关闭消息弹出框时,请将其设置为false。
Keyboard Navigation Options(键盘操纵选项)
keyboard(键盘):聚焦到地图且允许用户通过键盘的方向键和加减键来漫游地图。
keyboardPanOffset(键盘平移补偿):确定按键盘方向键时地图平移的像素。
keyboardZoomOffset(键盘缩放补偿):确定键盘加减键对于的缩放级数。
Panning Inertia Options(平移惯性选项)
inertia(惯性):如果该选项可用,在拖动和在某一时间段内持续朝同一方向移动建有动力的地图时,会有惯性的效果。
inertiaDeceleration(惯性减速):确定惯性移动减速的速率,单位是像素每秒的二次方。
inertiaMaxSpeed(惯性最大速度):惯性移动的最大速度,单位是像素每秒。
inertiaThreshold(惯性阈值):放开鼠标或是触摸来停止惯性移动与移动停止之间的毫秒数。
Control options(控制选项)
zoomControl(缩放控制):确定缩放控制是否默认加载在地图上。
attributionControl(属性控制):确定属性控制是否默认加载在地图上。
Animation options(动画选项)
fadeAnimation(淡出动画):确定瓦片淡出动画是否可用。通常默认在所有浏览器中都支持CSS3转场,android例外。
zoomAnimation(缩放动画):确定瓦片缩放动画是否可用。通常默认在所有浏览器中都支持CSS3转场,android例外。
markerZoomAnimation(注记缩放动画):确定注记的缩放是否随地图缩放动画而播放,如果被禁用,注记在动画中拉长时会消失。通常默认在所有浏览器中都支持CSS3转场,android例外。
Events(事件)
click(点击):用户点击或触摸地图时触发。
dbclick(双击):用户双击或连续两次触摸地图时触发。
mousedown(鼠标按下):用户按下鼠标按键时触发。
mouseup(鼠标抬起):用户按下鼠标按键时触发。
mouseover(鼠标经过):鼠标进入地图时触发。
mouseout(鼠标移出):鼠标离开地图时触发。
mousemove(鼠标移动):鼠标在地图上移动时触发。
contextmenu(情景菜单):当用户在地图上按下鼠标右键时触发,如果有监听器在监听这个时间,则浏览器默认的情景菜单被禁用。
focus(聚焦):当用户在地图上进行标引、点击或移动时进行聚焦。
blur(变暗):当地图失去焦点时触发。
preclick(预先点击):当鼠标在地图上点击之前触发。有时会在点击鼠标时,并在已存在的点击事件开始处理之前想要某件事情发生时用得到。
load(载入):当地图初始化时触发。(当地图的中心点和缩放初次设置时)
viewreset(视图重置):当地图需要重绘内容时触发。(通常在地图缩放和载入时发生)这对于创建用户自定义的叠置图层非常有用。
movestart(移动开始):地图视图开始改变时触发。(比如用户开始拖动地图)
move(移动):所有的地图视图移动时触发。
moveend(移动结束):当地图视图结束改变时触发。(比如用户停止拖动地图)
dragstart(拖动开始):用户开始拖动地图时触发。
drag(拖动):用户拖动地图时不断重复地触发。
dragend(拖动结束):用户停止拖动时触发。
zoomstart(缩放开始):当地图缩放即将发生时触发。(比如缩放动作开始前)
zoomend(缩放结束):当地图缩放时触发。
autopanstart(自动平移开始):打开弹出窗口时地图开始自动平移时触发。
layeradd(添加图层):当一个新的图层添加到地图上时触发。
layerremove(图层移除):当一些图层从地图上移除时触发。
baselayerchange(基础图层改变):当通过图层控制台改变基础图层时触发。
locationfound(位置查找):当地理寻址成功时触发(使用locate方法)。
locationerror(定位错误):当地理寻址错误时触发(使用locate方法)。
popupopen(打开弹出框):当弹出框打开时触发(使用openPopup方法)。
popupclose(关闭弹出框):当弹出框关闭时触发(使用closePopup方法)。
Methods for Modifying Map State(地图状态修改)
setView(设定视图):设定地图(设定其地理中心和缩放),如果forceReset设置的是true,即使移动和缩放动作是合理的,地图也会重载,其默认值是fault。
setZoom(设定缩放):设定地图的缩放。
zoomIn(放大):通过delta变量放大地图的级别,1是delta的默认值。
zoomOut(缩小):通过delta变量缩小地图的级别,1是delta的默认值。
fitBounds(使适合边界):将地图视图尽可能大地设定在给定的地理边界内。
fitWorld(使适合地域范围):将地图视图尽可能大地设定在包含全部地域的级别上。
panTo(平移至中心点):将地图平移到给定的中心。如果新的中心点在屏幕内与现有的中心点不同则产生平移动作。
panInsideBounds(平移到某边界内):平移地图到坐落于给定边界最接近的视图内。
panBy(通过像素点平移):通过给定的像素值对地图进行平移。
invalidateSize(无效的大小):检查地图容器的大小是否改变并更新地图,如果是这样的话,在动态改变地图大小后调用,如果animate是true的话,对地图进行更新。
setMaxBounds(设置最大边界):将地图限定在给定的边界内。
locate(定位):用地理定位接口获取用户位置信息,在成功定位或定位出错产生locationerror后解除location-found事件与定位数据,且将地图视图设定到检测的确切的用户的位置(如果定位失败则回到地域视图)。在Location Options中有更多详细内容。
stopLocation(停止定位):开始map.locate方法时停止预先检测位置信息。
Methods for Getting Map State(获取地图状态)
getCenter(获取地图中心):返回地图视图的地理中心。
getZoom(获取缩放级别):获取地图视图现在所处的缩放级别。
getMixZoom(获取最小缩放级别):返回地图最小的缩放级别。
getMaxZoom(获取最大缩放级别):返回地图最大的缩放级别。
getBounds(获取边界):返回地图视图的经纬度边界。
getBoundsZoom(获取边界缩放级别):返回适应整个地图视图边界的最大缩放级别。如果inside的设置时true,这个方法返回适应整个地图视图边界的最小缩放级别。
getSize(获取大小):返回现有地图容器的大小。
getPixelBounds(获取像素边界):返回地图视图在像素投影坐标系下的边界。(很多时候对用户自定义图层和叠加很有用)
getPixelOrigin(获取像素原点):返回地图图层像素投影坐标系下的左上角的点。(很多时候对用户自定义图层和叠加很有用)
Methods for Layers and Controls(图层控制)
addlayer(添加图层):将图层添加到地图上。如果insertAtTheBottom的选项为true,图层添加时在所以图层之下。(在切换基底图时比较有用)
removelayer(移除图层):将图层在地图上移除。
haslayer(是否有此图层):如果添加的图层是当前图层则返回true。
openPopup(打开弹出框):当关闭前一个弹出框时弹出指定的对话框。(确定在同一时间只有一个打开并可用)
closePopup(关闭弹出框):关闭openPopup打开的弹出框。
addControl(添加控制):在地图上添加控制选项。
removeControl(移除控制):在地图上移除控制选项。
Conversion Methods(转换方法)
latlngToLayerPoint(将经纬度添转变为图层上的点):返回地图图层上与地理坐标相一致的点。(在地图上进行位置叠加时比较有用)
layerPointToLatLng(将图层上的点转换为经纬度点):返回给定地图上点的地理坐标系。
containerPointToLayerPoint(容器点到图层点):将于地图容器相关的点转换为地图图层相关的点。
layerPointToContainerPoint(图层点到容器点):将地图图层相关的点转换为地图容器相关的点。
LatLngToContainerPoint(经纬度点到容器点):返回与给定地理坐标系相符的地图容器的点。
containerPointToLatLng(容器点转换为经纬度点):返回给定地理容器点的地理坐标。
project(投影):将地理坐标投影到指定缩放级别的像素坐标系中。
unproject(反投影):将像素坐标系投影到指定缩放级别的地理坐标系中。(默认为当前的缩放级别)
mouseEventToContainerPoint(鼠标点击事件到地图容器点):返回鼠标点击事件对象的像素坐标(与地图左上角相关)。
mouseEventToLayerPoint(鼠标点击事件到地图容器点):返回鼠标点击事件对象的像素坐标(与地图图层相关)。
mouseEventToLatLng(鼠标点击事件到经纬度点):返回鼠标点击事件对象的地理坐标。
Other Methods(其他方法)
getContainer(获取容器):返回地图容器对象。
getPanes(获取地图边框):返回不同地图对象的边框(叠加渲染)
whenReady(准备就绪):当地图的位置和缩放初始化好或是时间发生之后,运行给定的回调方法,通常传递一个函数内容。
Locate options(位置选项)
watch(监听):如果该值为真,则开始利用W3C的watchPosition方法监听位置变化情况(而不是指监听一次)。你可以通过map.stoplocate()方法来停止监听。
setView(设置视图):如果该值为真,则通过自动将地图视图定位到用户一定精度范围内的位置,如果地理定位失败则显示全部地图。
maxZoom(最大级别):在使用setView选项时视图缩放的最大级别。
timeout(超时):在触发locationerror事件之前等待地理定位的毫秒为单位的时间。
maximumAge(最大生命周期):位置监听的最大生命周期。如果比最后定位回复后毫秒用时短,则locate返回一个缓存位置。
enableHighAccuracy(开启高精度):开启高精度,参加W3C SPEC的描述。
Properties(属性)
地图属性包括互动操作,允许你在运行环境中互动地控制地图行为,比如通过拖拽和点击缩放级别显示和不显示某要素。
你也可以通过地图属性来接受默认的地图控制项,比如属性控制。
dragging(拖拽):地图拖拽处理程序,可以通过鼠标和触摸的形式。
touchZoom(触摸缩放按钮):触摸地图缩放处理程序。
doubleClickZoom(双击缩放):双击缩放处理程序。
scrollWheelZoom(滚动缩放):滚动缩放处理程序。
boxZoom(矩形框缩放):矩形框(利用鼠标拖动)缩放处理程序。
keyboard(键盘):键盘导向处理程序。
zoomControl(缩放控制):缩放控制。
attributionControl(属性控制):属性控制。
Map Panes(地图窗口)
望文思义,这是一个包括可以用来放置自定义图层的不同的地图窗口的对象。最大的区别是图层的叠置。
mapPane(地图窗口):包含其他地图窗口的窗口。
tilePane(切片窗口):切片图层的窗口。
objectsPane(对象窗口):包含除切片窗口以外所有窗口的窗口。
shadowPane(隐含窗口):用来隐藏图层的窗口(如标注的隐藏)。
overlayPane(图层窗口):这线段和多边形一类图层的窗口。
markerPane(标注窗口):标注图标的窗口。
popupPane(弹出窗口):弹出的窗口。
L.Marker
用来在地图中放置注记。
Constructor(构造函数)
L.Marker():通过给定一个地理点和一个具有选项的对象来实例化一个注记。
Options(选项)
icon(图标):图标类用来表达注记。参加Icon documentation以了解自定义注记图标的详细信息。默认设置为new L.Icon.Default()。
clickable(可点击):如果是false,注记则不产生鼠标事件并表现为底层地图的一部分。
draggable(可拖动):决定注记是否可被鼠标或触摸拖动。
title(标题):注记旁边显示浏览器提示的文本信息。
zIndexOffset():默认情况下,注记图片的叠置顺序由纬度自动设置。如果你想将某一注记放置于其他之上可用这个选项,设置一个较大的值即可,比如1000(或是相反地设置一个较大的负值)。
opacity(不透明度):决定注记的不透明度。
riseOnHover(凸显):如果此值为true,则当把鼠标放置于注记之上时,注记会显示与其他注记之上。
riseOffset(凸显补偿):riseOnHover要素凸显时高度的补偿值。
Events(事件)
click(点击):当鼠标点击注记时触发。
dbclick(双击):当鼠标双击注记时触发。
mousedown(鼠标按下):当鼠标按下鼠标键时触发。
mouseover(鼠标置于其上):当鼠标在注记上时触发。
mouseout(鼠标移出):当鼠标离开注记时触发。
contextmenu(文本菜单):当鼠标右击注记时触发。
dragstrat(拖动开始):当用户拖动注记时触发。
drag(拖动):当用户拖动注记时不断触发。
dragend(拖动结束):当用户停止拖动注记时触发。
move(移动):当注记通过定义经纬度而移动时触发。新的坐标包含事件参数。
remove(删除):当注记在地图上被删除时触发。
Methods(方法)
addTo():在地图上添加注记。
getLatLng():返回当前注记的地理位置。
setLatLng():将注记位置更改到给定点。
setIcon():更改注记的图标。
setZIndexOffset():更改注记的zIndex offset。
setOpacity():更改注记的透明度。
update():更新注记的位置,在直接更改经纬度对象的坐标时比较有用。
bindPopup():当点击一个注记时绑定一个特定的HTML内容的弹出窗口。你也可以用Marker中的openPopup方法打开绑定的弹出窗口。
unbindPopup():将先前用bindPopup方法绑定的注记取消。
openPopup():打开先前用bindPopup方法绑定的弹出框。
closePopup():关闭已打开的注记的弹出框。
Interaction handlers(互操作处理程序)
dragging(拖动):注记拖动处理程序(包括鼠标和触摸)。
L.Popup
Constructor(函数构造器)
L.Popup():通过给定一些选项构造一个弹出框对象,对象用来描述出现形式和位置还有一个可选对象来根据指向的资源对象标注弹出框。
maxWidth(最大宽度):弹出框的最大宽度。
minWidth(最小宽度):弹出框的最小宽度。
maxHeight(最大高度):设置后,如果内容超过弹出窗口的给定高度则产生一个可以滚动的容器。
autoPan(自动平移):如果你不想地图自动平移来适应打开的弹出框,就设置其为false。
closeButton(关闭按钮):控制弹出窗口中出现的关闭按钮。
offset(补偿值):弹出窗口位置的补偿值。在同一图层中打开弹出窗口时对于控制锚点比较有用。
autoPanPadding(自动平移填补):在地图视图自动平移产生后弹出窗口和地图视图之间的边缘。
zoomAnimation:决定是否在所在级别上弹出窗口。如果你在弹出窗口中有flash内容的最好将其设置为不可用。
Methods(方法)
addTo:将弹出窗口添加到地图上。
openOn:将弹出窗口添加到地图上并将之前的一个关闭。与map.oenPopup(popup)方法相同。
setLatLng:设置弹出窗口打开的地理上的点位。
setContent:设置弹出窗口的HTML内容。
L.TileLayer
用来在地图上载入和显示切片图层,用ILayer接口实现。
Constructor(函数构造器)
L.TileLayer():通过给定URL模板和具有选项的对象来实例化一个切片图层。
URL template(URL模板)
见下面的例子
L.tileLayer(‘http://{s}.somedomain.com/{foo}/{z}/{x}/{y}.png’, {foo: ‘bar’})
Options(选项)
minZoom:最小级别数
maxZoom:最大级别数
tileSize:切片尺寸(宽度和高度的像素值,假设切片是正方形的)
subdomains:服务的子域。可以传递一个字符串(其中每一个字母都是一个子域名称)或是一个字符串数组。
errorTileUrl:图片的URL给出加载错误的位置。
attribution:用来进行属性控制的字符串,描述了图层数据。
tms:如果此值为true,反转切片Y轴的编号(对于TMS服务需将此项打开)。
continuousWorld:如果设置为true,切片的坐标系不会被世界范围的宽度(-180度到180度)所覆盖,也不会被在世界范围的高度(-90度到90度)之内。你可以将此用在不反应真是世界的地图上(比如游戏、室内或照片的地图)。
noWrap:如果设置此项为true,则切片不会用重复填充来表示世界范围(经度-180到180之间)之外的地方。
zoomOffset:用此值来补偿URL中地图的缩放级别。
zoomReverse:如果此项为true,URL中的缩放级别会被反转(用最大到最小缩放级别来替代缩放级别)。
opacity:切片图层的透明度。
zIndex:切片图层明确的叠置顺序,默认此项不会被设置。
unloadInvisibleTiles:如果此项为true,在平移后所有看不到的切片都会被移除(用以更好地显示),在移动设备的webkit中默认是true,其他的默认为false。
updateWhenIdle:如果此项为false,在平移过程中新的切片将会载入,其他的在其后载入(用以更好地显示),在移动设备webKit中默认是true,其他默认false。
detectRetina:如果此项为true,并且用户是视网膜显示模式,会请求规定大小一般的四个切片和一个地区内一个更大的缩放级别来利用高分辨率。
reuseTiles:如果此项为true,在平移后不可见的切片被放入一个队列中,在新的切片开始可见时他们会被取回(而不是动态地创建一个新的)。这理论上可以降低内存使用率并可以去除在需要新的切片时预留内存。
Events(事件)
loading:当切片图层开始加载切片时触发。
load:当切片图层加载完可见切片后触发。
tileload:在加载切片时触发。
tileunload:在切片被移除时触发(比如打开了unloadInvisibleTiles)。
Methods(方法)
addTo():将图层加到地图上。
bringToFront():将此切片图层放到所有切片图层之上。
bringToBack():将此切片图层放到所有切片图层之下。
setOpacity():改变切片图层的透明度。
setZIndex():设置切片图层的叠放顺序。
redraw():清除所有的切片并重新向服务端申请他们。
setUrl():更新图层的URL模板并重绘他们。
L.TileLayer.WMS
用来显示地图上切片图层的WMS服务,继承自TileLayer。
Constructor(函数构造器)
L.TileLayer.WMS(): 通过给定一个基本的WMS服务的URL和WMS参数或选项对象来实例化一个WMS切片图层对象。
Options(选项)
layers:WMS图层以逗号分隔符隔开的列表。
styles:WMS样式以逗号分隔符隔开的列表。
format:WMS图像格式(用“image/png”来显示透明图层)。
transparent:如果该项为true,WMS服务返回透明图片。
version:WMS服务的版本。
Methods(方法)
setParams():融合新的参数和在当前屏幕中重申请的切片(除非noRedraw设置为true)。
L.TileLayer.Canvas
用来创建浏览器端绘制的切片图层的底层画布。
Constructor(函数构造器)
L.TileLayer.Canvas():通过一个具有选项的对象来实例化一个切片图层画布对象。
Options(选项)
async:在实例化时可以异步地绘制切片。在全部绘制完后,tileDrawn方法需要在每个切片上使用。
Methods(方法)
drawTile():在创建实例来绘制切片后你需要定义此方法;canvas是你可以绘制的实际上的切片画布,tilePoint反应了切片的数目,zoom是当前的缩放级别。
tileDrawn():如果async选项被定义,在全部绘制完后,这个函数需要在每个切片上使用。canvas与画布对象相同,传递参数给drawTile。
L.ImageOverlay
用来在地图上规定范围内载入和显示单幅图像,继承自ILayer。
Constructor(函数构造器)
L.ImageOverlay():通过给定图像的URL和相关的地理范围来实例化一个图像叠加层对象。
Options(选项)
opacity:图像叠加层的透明度。
Methods(方法)
addTo():将图像叠加层添加到地图上。
setOpacity():设置叠加层的透明度。
bringToFront():将叠加层置于所有层的顶层。
bringToBack():将叠加层置于所有层的底层。
L.Path
是包含选项和与适量叠加层共享常量的抽象类。不可以接使用。
Options(选项)
stroke:路径是否描边。设置为false时,多边形和圆的边界将不可见。
color:描边颜色。
weight:描边的像素级别的宽度。
opacity:描边透明度。
fill:路径是否填充颜色。设置为false时,多边形和圆的填充内容不可见。
fillColor:填充颜色。
fillOpacity:填充透明度。
dashArray:定义描边线型的字符串。这在画布上不起作用。(比如android 2)
clickable:如果此项为false,则矢量不产生鼠标事件并表现为底图的一部分。
Events(事件)
click:用户点击或点触对象时触发。
dbclick:用户双击或连续两次点触对象时触发。
mousedown:当用户在对象上按下鼠标时触发。
mouseover:当鼠标置于对象上方时触发。
mouseout:当鼠标离开对象时触发。
contextmenu:当用户在对象上点击鼠标右键时触发,当此事件被监听时,会阻止弹出浏览器本身的右键菜单。
add:当路径被添加在地图上时触发。
remove:当路径在地图上移除时触发。
Methods(方法)
addTo():将图层添加到地图上。
bindPopup():将具有特定HTML内容的弹出框与点击路径绑定起来。
unbindPopup():将之前的弹出框绑定解除。
openPopup():打开之前通过bindPopup方法与路径上指定点或未指定情况下某一点绑定的弹出框。
closePopup():如果与路径绑定的弹出框是打开状态的,则将其关闭。
setStyle():更改给予对象选项对象的路径的表现形式。
getBounds():返回路径的经纬度绑定信息。
bringToFront():将此层移至所以路径层的最上层。
bringToBack():将此层移至所以路径层的最底层。
redraw():重绘图层。在更改了路径的坐标时比较有用。
Static properties(静态属性)
SVG:如果用SVG来表达矢量,则此值为true(在当前大多数浏览器中是true)。
VML:如果VML用来表达矢量,则此值为true(在IE 6-8中适用)。
CANVAS:如果canvas用来表达矢量,则此值为true(在android 2中适用)。你也可以在页面中载入leaflet之前通过设置全局变量L_PREFER_CANVAS为true来强制使用此项——有时在表达上千上万相同的注记时会显著地提高性能,但目前由于漏洞导致移除图层非常慢。
CLIP_PADDING:决定地图视图周围裁剪区域延展的大小(与大小相关,比如0.5在每个方向上是屏幕的一半)。较小的值意味着在拖动地图时你会看到被裁剪路径的末端,较大值会降低绘制性能。
L.Polyline
绘制叠加在地图上线段的类。继承自Path。用Map#addLayer来添加到地图上。
Constructor(函数构造器)
L.Polyline():通过给定的地理点组成的数组和任意的选项对象实例化一个线段。
Options(选项)
smoothFactor:决定每一个缩放级别上线段简化程度。如果大的话意味着更好的表现和看起来更光滑,小的话意味更准确地表示。
noClip::不允许线段裁剪。
Methods(方法)
addLatLng():向线段添加一个点。
setLatLngs():用所给的地理点的数组替代线段上的点。
getLatLngs():返回路径上的点组成的数组。
spliceLatLngs():允许添加、移除和更改线段上的点。同Array#splice的语法一致。返回移除点组成的数组。
getBounds():返回线段的经纬度边界。
L.MultiPolyline
是FeatureGroup的扩展,用来创建多线(在同一图层中由多个共享样式和弹出框的线段组成)。
Constructor(函数构造器)
L.MultiPolyline():通过给定的地理点的二维数组(其中每个一维数组表示一个线段)和选项对象来实例化一个多线对象。
L.Polygon
在地图上绘制多边形的类。是Polyline的扩展。用Map#addLayer添加到地图上。
创建多边形时经过的点没有传统意义上的起点和终点——最好将这种点指出来。
Constructor(函数构造器)
L.Polygon():通过给定地理点组成的数组和选项对象来实例化一个多边形(同线段构造方法相同)。你也可以通过传递经纬度的二维数组来创建一个带有洞的多边形,第一个经纬度数组表示外环,剩下的表示里面的洞。
L.MultiPolygon
是FeatureGroup的扩展,用来创建多多边形(在同一图层上由共享样式和弹出框的多个多边形组成)。
Constructor(函数构造器)
L.MultiPolygon():通过给定的经纬度的二维数组(每个一维数组表示一个多边形)和选项对象实例化多多边形(同多线相同)。
L.Rectangle
在地图上绘制矩形的类。是多边形的扩展。用Map#addLayer添加到地图上。
Constructor(函数构造器)
L.Rectangle():通过给定的地理边界和选项对象来实例化一个矩形对象。
Methods(方法)
setBounds():根据传递的边界重绘矩形。
L.Circle
在地图上绘制圆形叠加物的类。是Path的延伸。用Map#addLayer来添加到地图上。
Constructor(函数构造器)
L.Circle():通过给定的地理点和以米为单位的半径和选项对象来实例化一个圆对象。
Methods(方法)
getLatLng():返回圆当前的地理位置。
getRadius():返回圆的半径,以米为单位。
setLatLng():将圆放置到一个新的位置。
setRadius():设置圆的半径,以米为单位。
L.CircleMarker
是一个特定半径的圆,半径单位是像素。是Circle的延伸。通过Map#addLayer添加到地图上。
Constructor(函数构造器)
L.CircleMarker():通过给定的地理点和选项对象来实例化一个圆注记。默认的半径是10像素,并且可以通过在路径选项中传递一个半径参数来修改半径。
Methods(方法)
setLatLng():将圆注记放置于一个新的位置。
setRadius():设置圆注记的半径,以像素为单位。
L.LayerGroup
用来将几个图层组成一个组并作为一个图层来处理。如果你将其添加到地图上,组中任何图层的添加或移除都将使其同样在地图添加或删除。继承自ILayer接口。
Constructor(函数构造器)
L.LayerGroup():创建一个组,视情况指定一组初始的图层。
Methods(方法)
addTo():将图组添加到地图上。
addLayer():将给定的图层添加到组中。
removeLayer():将给定的图层从组中移除:
clearLayer():将组中的图层清空。
eachLayer():遍历组中的图层,需选择一个符合情况的迭代函数。
L.FeatureGroup
是LayerGroup的扩展,但多了鼠标事件和共享的弹出框方法。继承自ILayer接口。
Constructor(函数构造器)
L.FeatureGroup():创建一个图组,视情况指定一组初始图层。
Methods(方法)
具有LayerGroup所以的方法,还有下面多出的方法:
bindPopup():在组中任意具有bindPopup方法的图层上绑定一个具有具体HTML内容的弹出框。
getBounds():返回要素组的经纬度边界(通过他子图层的边界和坐标获得)。
setStyle():设置组中具有setStyle方法的图层的路径选项。
bringToFront():将图组置于顶层。
bringToBack():将图组置于底层。
Events(事件)
click:用户点击或触摸组是触发。
dbclick:用户双击或连续两次触摸组时触发。
mouseover:当鼠标置于组上方时触发。
mouseout:当鼠标离开组时触发。
mousemove:当鼠标经过组时触发。
contextmenu:当用户右击图层时触发。
layeradd:当图层被加入到组时触发。
layerremove:当图层从组中移除时触发。
L.GeoJSON
展示一个GeoJSON的图层。允许你在地图上解析并显示GeoJSON数据。是FeatureGroup的延伸。
由此创建的每个要素层获取要素与之关联的GeoJSON数据属性(因此你随后可以传递它的属性)。
Constructor(函数构造器)
L.GeoJSON():创建一个GeoJSON图层。可以任意地接受GeoJSON格式的对象和选项对象并显示在地图上(随后可以选择用addData方法添加)。
Options(选项)
pointToLayer():在创建GeoJSON点图层时所用到的函数(如果不特意说明,会创建简单的注记)。
style():在获取用来创建GeoJSON要素的矢量图层的样式选项时可以用到。
onEachFeature():在每个创建的图层上都会调用此函数。对于向要素添加事件和弹出框比较有用。
filter():用来决定是否显示某要素的函数。
Methods(方法)
addData():在图层中添加GeoJSON对象。
setStyle():通过给定的样式函数改变GeoJSON矢量图层的样式。
resetStyle():将矢量图层样式重置为初始GeoJSON样式,对于hover事件之后的重置比较有用。
Static methods(静态方法)
geometryToLayer():通过给定的GeoJSON要素创建图层。
coordsToLatlng():通过在GeoJSON中表示点的两个数字组成(分别表示纬度和经度)的数组来创建经纬度对象。如果reverse设置为true,那么这两个数字被颠倒,表经度和纬度。
coordsToLatlngs():通过GeoJSON坐标坐标的数组创建多维数组。leversDeep指定具体的嵌套级别(0表示点的数组,1表示点数组的数组等等,0为默认值)。如果reverse设置为true,这些数组变为经度和纬度。
L.LatLng
表示通过某一经度和纬度确定的地理上的点。
所以leaflet接受的经纬度对象也接受他们的单一数组的形式(除非在其他方面表明不可以)。
Constructor(函数构造器)
L.LatLng():通过给定的纬度和经度创建表示地理点的对象。
Options(选项)
lat:以度数表示的纬度。
lng:以度数表示的经度。
Methods(方法)
distanceTo():返回到通过半正矢公式计算的经纬度的距离(用米表示)。
equals():如果给定的经纬度在相同的位置(具有较小的容差)则返回true。
toString():返回点的描述信息(用来调试用)。
wrap():返回在经度上left和right边界覆盖范围内(默认为0180到180)的心的经纬度对象。
Constants(常量)
DEG_TO_RAD:度数转换为弧度的乘子。
RAD_TO_DEG:弧度转换为度数的乘子。
MAX_MARGIN:判断相等的容差。
L.LatLngBounds
表示地图上一个矩形的区域。
所有接受LatLngBounds对象的leaflet方法也接受他们简单数组的形式(除非另行说明)。
Constructor(函数构造器)
L.LatLngBounds(西南角点,东北角点):通过定义矩形西南角点和东北角点来创建经纬度的矩形框。
L.LatLngBounds():通过定义内在点来创建经纬度的矩形框。当用fitBounds把地图放到适合某些位置的缩放级别时是比较有用的。
Methods(方法)
extend():将边界延伸到包含给定点和边界的范围。
geSouthWest():返回边界的西南角点。
getNorthEast():返回边界的东北角点。
getNorthWest():返回边界的西北角点。
getSouthEast():返回边界的东南角点。
getWest():返回边界的西点。
getSouth():返回边界的南角点。
getEast():返回边界的东角点。
getNorth():返回边界的北角点。
getCenter():返回边界的中心点。
containg(otherBounds):如果矩形框包含给定的边界则返回true。
contains(latlng):如果矩形框包含给定的点则返回true。
intersects():如果矩形框与给定的边界相交则返回true。
equals():如果矩形框与给定的范围相等(在一定容差范围内)则返回true。
toBBoxString():返回“西南经度,西南纬度,东北经度,东北纬度”形式的外接矩形的坐标。在向网络服务器提交请求返回地理数据时比较有用。
pad():返回当前范围扩大一定百分比后的边界。
isValid():如果边界可被初始化则返回true。
L.Point
显示以像素为单位的点的x,y坐标。
所以接受点对象的leaflet方法和选项都也接受他们简单数组的形式。
Constructor(函数构造器)
L.Point():用给定点的x和y坐标来创建点对象。如果round设置为true,则将x和y的值转换为圆中。?
Properties(属性)
x:x坐标。
y:y坐标。
Methods(方法)
add():返回当前点和给定点的和。
subtract():返回当前点和给定点的差。
multiplyBy():返回当前点和给定值的积。
divideBy():返回当前点和给定值的商。如果round设置为true,则返回一个圆的结果。
distanceTo():返回当前点与给定的的距离。
clone():返回当前的副本。
round():返回当前的在圆上的坐标的副本。
equals():如果点坐标相同则返回true。
toString():在调试时显示点的字符串的形式。
L.Bounds
用像素坐标表示的矩形的区域。
所以接受边界对象的leaflet方法和选项都也接受他们简单数组的形式。
Constructor(函数构造器)
L.Bounds(左上角点,右下角点):用两个坐标(通常是左上角的点和右下角的点)来创建边界对象。
L.Bounds(点集):用包含的点创建边界对象。
Properties(属性)
min:矩形左上角点。
max:矩形右下角点。
Methods(方法)
extend():将包含给定点的边界延伸。
getCenter():返回边界的中心点。
contains():如果矩形包含给定的边界则返回true。
contains():如果矩形包含给定点则返回true。
intersects():如果矩形与给定边界相交则返回true。
isValid():如果边界可以被初始化则返回true。
getSize():返回边界的大小。
L.Icon
创建注记时显示的图标。
Constructor(函数构造器)
L.Icon():通过给定的选项创建图标实例。
Options(选项)
iconUrl:请求图标图片的URL(脚本中的绝对或相对路径)。
iconRetinaUrl:图标图片视网膜视图下的尺寸的URL。用于视网膜屏幕的设备。
iconSize:图标图片的像素大小。
iconAnchor:图标提示的坐标(在左上角)。图标是对其的,所以这个点是注记的地理位置。如果大小是指定的则位于中心处,也可以在CSS中设置负边界。
shadowUrl:图标阴影图的URL。如果没有指定,图标没有阴影。
shadowRetinaUrl:图标在视网膜视图下的尺寸的URL。如果没有指定,图标没有阴影。用于视网膜屏幕的设备。
shadowAnchor:阴影的提示坐标(在左上角)(如果没有指定则与iconAnchor相同)。
popupAnchor:与图标锚相关的打开弹出框的点的坐标。
className:图标和阴影图片的自定义的类名。默认为空。
L.DivIcon
用div要素而非图片来轻量级地显示注记的图标。
默认情况下,阴影会有一个小的白色的方形作为leaflet-div-icon类和样式。
Constructor(函数构造器)
L.DivIcon():用给定的选项实例化图标。
Options(选项)
iconSize:图标的像素大小。也可以通过CSS设置。
iconAnchor:图标提示的坐标(在左上角)。图标是对其的,所以这个点是注记的地理位置。如果大小是指定的则位于中心处,也可以在CSS中设置负边界。
className:用于对其图标的自定义的类名,默认为leaflet-div-icon。
html:在div要素中自定义的HTML代码,默认为空。
L.Control
所有leaflet控制的基础类。继承自IControl接口。
Constructor(函数构造器)
L.Control():通过给定的选项创建一个控制。
Options(选项)
position:控制初始的位置(在地图的某一角)。参见control positions。
Methods(方法)
setPosition():设置控制的位置。参见control positions。
getPosition0():返回控制的当前位置。
addTo():将控制添加到地图上。
removeFrom():将控制从地图上移除。
Control Positions(控制的位置)
topleft:地图的左上角。
topright:地图的右上角。
bottomleft:地图的左下角。
bottomright:地图的右下角。
L.Control.Zoom
拥有两个按钮(放大和缩小)的级别的缩放控制。默认地图上是有的,除非设置zoomControl选项为false。
Constructor(函数构造器)
L.Control.Zoom():创建缩放控制。
Options(选项)
position:控制的位置(在地图的某一角)。参见control positions。
L.Control.Attribution
可以在地图上一个小的文本盒子中显示属性数据的属性控制。默认地图上是有的,除非设置attributionControl选项为false,并且它自动地通过getAttribution方法获取图层的属性文本。继承自Control。
Constructor(函数构造器)
L.Control.Attribution():创建属性控制。
Options(选项)
position:控制的位置(在地图的某一角)。参见control positions。
prefix:在属性之前显示的HTML文本。传递false来使其不显示。
Methods(方法)
setPrefix():在属性之前设置文本。
addAttribution():添加属性文本。
removeAttribution():移除属性文本。
L.Control.Layers
图层控制使用户可以在不同的底图之间切换,并可以控制覆盖物的开关。继承自Control。
Constructor(函数构造器)
L.Control.Layers():通过给定的图层创建数据控制。基础图层通过单选项进行切换,覆盖物通过复选框切换显示。
Methods(方法)
addBaseLayer():通过给定的控制名称添加基础层(通过单选按钮实体)。
addOverlay():凸显给定的控制名称添加覆盖物(通过复选框实体)。
removeLayer():将图层从控制中移除。
Options(选项)
position:控制的位置(在地图的某一角)。参见control positions。
collapsed:如果为true,控制可以收缩为一个图标,在鼠标置于上方或点触时展开。
autoZIndex:如果为true,控制的图层升序地叠置对齐,在切换图层打开或关闭时,顺便不变。
Events(事件)
baselayerchange:当基层层通过控制更改时触发。
L.Control.Scale
显示在十进制或公制的屏幕当前中心的比例的简单比例尺控制。继承自IControl接口。
Constructor(函数构造器)
L.Control.Scale():通过选项创建比例控制。
Options(选项)
position:控制的位置(在地图的某一角)。参见control positions。
maxWidth:控制最大的像素宽度。宽度可以围绕几个值动态设置。
metric:是否显示十进制比例线。
imperial:是否显示公制比例线。
updateWhenIdle:如果设置为true,控制由moveend更新,否则它总是最新的(由move更新)。
Events methods
一系列事件驱动的类(比如map)之间共享的方法。通常,事件允许你在一个对象发生某些事情时执行一些函数。
leaflet通过引用来处理事件监听器,所以如果你想咬添加或移除一个监听器时,可以用函数的方法。
Methods(方法)
addEventListener(类型,函数,内容):向某一类型的事件中添加监听器函数。你可以选择性地指定监听器的内容(对象中this关键字会被使用)。你也可以传递几个空格间隔的类型(如”click dbclick”)。
addEventListener(发生事件的地图,内容):添加一系列的类型/监听器对,如{click:Onclick,mousenove:onMouseMove}
removeEventListener(类型,函数,内容):移除之前添加的监听器函数。如果没有指定具体的函数,则所以的都会被移除。
removeEventListener(发生事件的地图,内容):移除一系列类型/监听器对。
hasEventListener():如果某一事件类型有附属的监听器则返回true。
fireEvent():触发指定类型的事件。你可以提供一个数据对象——监听器对象的第一个参数应该包含它的属性。
on():addEventListener的别称。
off():removeEventListener的别称。
fire():fireEvent()的别称。
Event objects
当一些事件触发时接受监听器函数参数的事件对象,它包含了事件一些有用的信息。
Events(事件)
type:事件的类型。
target:触发事件的对象。
MouseEvent(鼠标事件)
latlng:鼠标事件发生的地理点。
layerPoint:鼠标事件发生的与地图图层相关的点的像素坐标。
containerPoint:鼠标事件发生的与地图容器相关的点的像素坐标。
originalEvent:由浏览器触发的原始的DOM鼠标事件。
LocationEvent(位置事件)
latlng:监测到的用户的地理位置。
bounds:用户坐落的区域的地理边界(考虑位置精度问题)。
accuracy:米为单位的位置的精度。
ErrorEvent(错误事件)
message:错误信息。
code:错误代码(若可用)。
LayerEvent(图层事件)
layer:添加或移除的图层。
TileEvent(切片事件)
tile:切片要素(图片)。
url:切片的url资源。
GeoJSON event(GeoJSON事件)
layer:将要添加到地图上的GeoJSON要素的图层。
properties:要素的GeoJSON的属性。
geometryType:要素的GeoJSON的几何类型。
id:要素的GeoJSON的ID(如果出现)。
Popup event(弹出框事件)
popup:打开或关闭的弹出框。
L.Class
L.Class强化了leaflet的面向对象的设备并被用于创建几乎所哟这里提到的leaflet类。
除了执行一个简单的类接口模型,它还引入了方便代码组织的一下特殊的属性——options,includes和statics。
Inheritance(继承)
可以用L.Class.extend来定义新的类,但可以在任何一个类上用同样的方法来继承它。
这会创建一个继承父类所有方法和属性的类(由规范所约束),添加或重构你用来扩展的类。这也对instanceof做出反应。
你可以通过父类的规范和javascript的call与apply来调用父类的方法来响应子类的方法(就像你在其他语言中调用超类)。
Options(选项)
options是一个与其他对象不同的特殊的属性,其他你用来扩展的对象会被父类合并而非完全重构,这使管理对象的结构和默认值更加方便。
选项中还有L.Util.setOptions方法,可以方便地合并传递给函数构造器的选项和类中默认的定义。
Includes(包含)
includes是一个特殊的类,它将所有对象合并到一个类中。一个较好的例子是L.Mixin.Event,它是具有on、off和fire这些鱼事件相关的方法的类。
Statics(静态)
statics是一种方便的属性,将类中指定对象的属性变为静态属性,对于定义常量比较有用。
Class Factories(类工厂)
你可以用个两种方式来创建leaflet的实例——用new关键字和用小写的factory方法。
Constructor Hooks(构造函数钩子)
如果你是一个插件开发者,你通常需要在现有的类中加入附件的初始化代码(比如因L.Polyline而编辑钩子)。leaflet可以用addInitHook方法来简化它。
L.Browser
leaflet内部监测浏览器或要素的带有属性的命名空间。
ie:如果是IE浏览器则返回true。
ie6:如果是IE6浏览器则返回true。
ie7:如果是IE7浏览器则返回true。
webkit:如果是类似chrome和safari的基于webkit的浏览器(包括移动版)则返回true。
webkit3d:如果基于webkit的浏览器支持CSS的3D转换则返回true。
android:如果是安卓移动版的浏览器则返回true。
android23:如果是安卓2或3的股票浏览器则返回true。
mobile:如果是流行的移动版的浏览器(包括iOS下的safari和其他各种安卓浏览器)则返回true。
mobileWebkit:如果是移动版的基于webkit的浏览器则返回true。
mobileOpera:如果是移动版的opera浏览器则返回true。
touch:对于所有触摸设备上的浏览器返回true。
msTouch:对于微软的触摸模式的浏览器(比如IE10)返回true。
retina:如果是视网膜屏幕的设备则返回true。
L.Util
在leaflet内部使用的多种实用的函数。
Methods(方法)
extend():将src对象(或多个对象)的属性合并到dest对象中并将其返回。具有一个L.extend的快捷方式。
bind():返回由给定范围的obj执行fn函数的函数(所以关键字this可以表示函数代码里的obj)。具有一个L.bind快捷方式。
stamp():在对象上应用一个主键并返回这个键。具有L.stamp快捷方式。
limitExecByInterval():返回调用尽量快的但不会比间隔时间还要频繁的fn函数的包装器(对于拖动地图时检验和请求信的切片比较有用),可以通过context选择函数调用的范围。
falseFn():返回总是返回false的函数。
formatNum():返回digits位数的num的数目。
splitWords():根据空格和空白来截取分割字符串并返回数组。
setOptions():将所给的属性合并到obj的options中,返回最终的选项。参加Class options。具有L.setOptions快捷方式。
getParamString():将对象转换为带有参数的URL字符串,比如{a:“foo”,b:“bar”}转换为’?a=foo&b=bar’。
template():是一个简单的模板,用通过将{a:‘foo’,b:‘bar’,…}形式的data对象应用到’Hello{a},{b}‘形式的模板字符串来创建字符串——在上述示例中可以得到’Hello foo,bar’。
isArray():如果对象为数组则返回true。
Properties(属性)
emptyImageUrl:包含64位编码的空的GIF图像的数据URL字符串。在webkit驱动的移动设备的上,用来作为清空没用图像的存储的钩子。
L.Transformation
表示仿射变换:用一系列a、b、c、d的系数来将(x,y)形式转换为(ax+b,cy+d)的形式并进行反转。在leaflet的投影代码中可以用得到。
Constructor(函数构造器)
L.Transformation():通过给定的系数创建转换对象。
Methods(方法)
transform():返回转换后的点,可以选择扩大一定的倍数。只接受真实的L.Point实例,而不是数组。
untransform():返回反转变换后的点,可以选择搜索一定倍数。只接受真实的L.Point实例,而不是数组。
L.LineUtil
一些处理线段点的应用函数,在leaflet内部用来使线段显示更快。
Methods(方法)
simplify(): 在保持形状的同时动态地减少线上点的数目并返回简化后点的数组。在每一缩放级别处理和显示leaflet线段时可以大幅提升效率并可以减少视觉噪声。 tolerance影像简化的量(较小的值意味着更高的质量,但效率会地因为有更多的点)。这也是微型类库Simplify.js中的一部分。
pointToSegmentDistance():返回点p到p1和p2组成的线段之间的距离。
closesPointOnSegment():返回p1和p2线段上与p点最接近的点。
clipSegment():用矩形边界裁剪点a到点b之间的折线段(直接修改折线段上的点)。在leaflet中用来显示屏幕内或边缘的线段上的点,可以因此而提高效率。
L.PolyUtil
多边形几何体的一些应用函数。
Methods(方法)
clipPolygon():通过矩形边界来裁剪给定点定义的多边形几何体。在leaflet中用来显示屏幕内或边缘的线段上的多边形上的点,可以因此而提高效率。多边形点需要不同的算法来裁剪折线段,因此这个方法也有不同的分支。
L.DomEvent
在leaflet内部用来处理DOM事件的应用函数。
Methods(方法)
addListener():向指定类型的DOM事件元素添加监听器fn。监听器中的this关键字指向context,或是在没有说明的情况下指向要素。
removeListener():在元素中移除事件监听器。
stopPropagation():停止事件向父元素传播。
preventDefault():阻止事件默认的动作发生(比如追踪元素href中的链接,或是当form提交时页面重载的POST请求)。
stop():在同一时刻发起stopPropagation和preventDefault。
disableClickPropagation():将stopPropagation添加到元素的’click’,‘doubleclick’,’mousedown’和’touchstart’事件中。
getMousePosition():如果没有特意说明则获取与容器或整个页面相关的DOM事件的标准的鼠标位置。
getWheelDelta():从mousewheel的DOM事件中获取标准的滚轮区域。
L.DomUtil
在leaflet内部用来处理DOM树的应用函数。
Methods(方法)
get():如果传递字符串则返回一个带有指定id的元素,或是只是返回这个元素。
getStyle():返回元素中特定样式属性的值,包括计算后的值和CSS中设置的值。
getViewprotOffset():返回请求元素视图的偏移量。
create():通过tagName创建元素,设置className并选择性地将其附加到container元素中。
disableTextSelection():使文本不能被选择,比如拖动的时候。
enableTextSelection():使文本选择重新可用。
hasClass():如果元素类属性包含name则返回true。
addClass():将name添加到元素类的属性中。
removeClass():在元素类属性中移除name。
setOpacity():设置元素的透明度(包括老的IE也支持)。值应当处于0到1之间。
testProp():检索样式名称的数组并返回第一个元素可用样式的名称。如果没有找到,那么返回false。
getTranslateString():返回CSS转换字符串来通过给定点提供的偏移量来移动元素。
getScaleString():返回CSS转换字符串来缩放元素(通过给定的比例原点)。
setPosition():用CSS转换或屏幕左上角位置设置给定点的坐标系下的元素位置(leaflet内在地定位图层)。如果disable3D设置为true那么强制为左上角位置。
getPosition():返回之前用setPosition定位的元素的坐标。
Properties(属性)
TRANSITION:带前缀的转换样式名称(如’webkitTransition’用来表示WebKit)。
TRANSFORM:带前缀的变换样式名称。
L.PosAnimation
在内部用来平移动画镜头,利用CSS3转换在现代浏览器中实现,在IE6到9中用时间降速的功能实现。
Constructor(函数构造器)
L.PosAnimation():创建动画对象。
Methods(方法)
run():在新的位置运行指定元素,可以选择性地设置持续的秒数(默认是0.25秒)和线性效果(通过cubic bezier curve的第三个参数,默认是0.5)。
Events(事件)
start:当动画开始时触发。
step:在动画过程中持续触发。
end:动画结束时触发。
L.Draggable
使DOM元素可以拖动的类。在内部被用来拖动地图和注记。
Constructor(函数构造器)
L.Draggable():创建可拖动对象,这样在你开始移动dragHandle元素时就可以移动给定元素了(默认同元素自身是同一个)。
Events(事件)
dragstart:拖动开始时触发。
predrag:在拖动过程中相应元素位置更新之前持续触发。
drag:拖动过程中持续触发。
dragend:拖动结束后触发。
Methods(方法)
enable():使拖动功能可用。
disable():使拖动功能不可用。
IHandler
继承自interaction handlers接口。
enable():使处理程序可用。
disable():使处理程序不可用。
enabled():如果处理程序可用则返回true。
ILayer
显示地图上附属于某一位置(或一系列位置)的对象。被tile layers,markers,popups,image,overlays,vector layers和layer groups所继承。
Methods(方法)
onAdd():需要包含创建覆盖物的DOM元素的代码,将他们加入到所属的map panes中并在相关地图时间中放入监听器。调用map.addLayer(map)。
onRemove():包含从DOM移除覆盖物元素和移除之前onAdd方法添加的监听器的所有的清除代码。调用map.removeLayer(layer)。
Implementing Custom Layers(实例化自定义图层)
何时实例化自定义图层最重要的是地图的viewset事件和latLngToLayerPoint方法。viewset在地图需要重新定位图层时(比如缩放时)触发,latLngToLayerPoint在获取图层新的位置时使用。
在实例化图层时还有一个经常用到的事件是moveend,在地图移动之后触发(比如平移和缩放等)。
还 有一个需要注意的事情是你需要经常向你在图层中创建的DOM元素中添加leaflet-zoom-hide类,它会在缩放动画中隐藏。实例化自定义图层的 缩放动画师一个复杂的话题,在以后的章节中会讲到,但你可以在leaflet的图层代码(比如ImageOverlay)中看一下它是如何工作的。
IControl
在地图的某个角上显示UI元素。被zoom,attribution,scale和layers controls所继承。
Methods(方法)
onAdd():包含所有用于在相关地图事件上控制、添加监听器的创建必要DOM要素的代码,并返回包含控制的元素。调用map.addControl(control)或control.addTo(map)。
onRemove():包含所有清除代码(比如0移除控制事件监听器)。调用map.removeControl(control)或control.removeFrom(map)。控制的DOM容器自动移除。
IProjection
具有将地理坐标投影到平面(和后方)的方法的对象。参加Map projection。
Methods(方法)
project():将地理坐标投影为二维点。
unproject():将二维的点反投影为地理位置。
Defined Projections(定义的投影)
L.Projection.SphericalMercator:球面墨卡托投影——网上地图最常用的投影,几乎所有的免费和商业的切片提供者都会使用。假设地球是一个规则球体。被EPSG:3857坐标参考系统使用。
L.Projection.Mercator:椭圆墨卡托投影——比球面墨卡托投影更为复杂,这个投影考虑到地球是椭球而非规则球体。在EPSG:3395坐标参考系统中使用。
L.Projection.LonLat:正交矩形或圆柱投影——最简单的投影,几乎只被GIS专家使用。将地图的x方向作为经度,y方向作为纬度。对于平面的世界也适用,比如游戏地图。在EPSG:3395和Simple坐标参考系统中使用。
ICRS
为将地理点投影到像素坐标或屏幕坐标和反向投影(投影到用于WMS服务的其他单位的坐标)而定义坐标参考系统。参加Spatial reference system。
Methods(方法)
latLngToPoint():将给定缩放级别的地理坐标投影为像素坐标。
pointToLatLng():是latLngToPoint的反转。将给定缩放级别的像素坐标投影为地理坐标。
project():将地理坐标投影为CRS可接受单位的坐标(比如EPSG:3857中的米,传递给WMS服务)。
scale():返回转换投影坐标为特定级别的像素坐标所用到的缩放级别。比如,在基于墨卡托投影的CRS中返回256*2^zoom。
Properties(属性)
projection:CRS使用的投影。
transformation:CRS使用的用来将投影坐标转换为特定切片服务的屏幕坐标的转换方式。
code:向WMS服务传递的标准CRS的标准代码名称(比如’EPSG:3857’)。
Defined CRS(定义的坐标参考系统)
L.CRS.EPSG3857:在线地图最常用的CRS,几乎所有的免费喝商业切片服务都会使用。使用球面墨卡托投影。是地图的crs选项的开始默认值。
L.CRS.EPSG4326:在GIS专家中常见的CRS。使用简单的圆柱投影。
L.CRS.EPSG3395:较少地被商业切片服务使用。使用椭圆墨卡托投影。
L.CR.Simple:直接将经纬和纬度映射为x和y的简单的CRS。可能会在平面地图中用到(比如游戏地图)。y轴始终是反向的(由下而上)。
如果你想用其他此处未列出的不常用的CRS,请查询Proj4Leaflet插件。
Global Switches
用来在少数情况并且基本都是即使某个特别的浏览器要素存在,也使leaflet不监测的全局设置开关。需要在leaflet包含于页面之前将全局变量开关设置为true。
L_PREFER_CANVAS:对于矢量图层,强制leaflet在后台使用画布而非SVG。这在某些情况下可以适当提高性能(比如在地图上有成千上万的圆注记时)。
L_NO_TOUCH:即使监测到触摸事件,也强制leaflet不去使用触摸事件。
L_DISABLE_3D:即使可用,也强制leaflet在定位时不使用硬件加速来进行CSS 3D变换(在少数情况下会发生偶然故障)。
L.noConflict()
这个方法用来将L全局变量恢复到leaflet包含的初始值,并返回leaflet真实的命名空间,所以你可以将它放到任何地方。
L.version
显示当前使用的leaflet版本的常量。