leafletJs（转）

Posted 2020-10-17 LikWin

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了leafletJs（转）相关的知识，希望对你有一定的参考价值。

L.Map

API各种类中的核心部分，用来在页面中创建地图并操纵地图.

使用 example

// initialize the map on the "map" div with a given center and zoom var map = L.map(\'map\', { 	center: [51.505, -0.09], 	zoom: 13 });

构造器

构造器	使用	描述
`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`	确定惯性移动减速的速率，单位是像素每秒的二次方².
`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?以上是关于leafletJs（转）的主要内容，如果未能解决你的问题，请参考以下文章很实用的JQuery代码片段（转） LeafletJS：如何删除缩放控件几个有用的JavaScript/jQuery代码片段（转）在leafletjs中绘制140K点实用代码片段将json数据绑定到html元素（转） Leafletjs 地理编码网络服务 (c)2006-2024 SYSTEM All Rights Reserved IT常识`