核心依赖库Leaflet介绍

10/1/2021

Leaflet (opens new window)是一个开源的JavaScript库,对移动端友好且有很好的交互性。大小仅仅只有 33 KB, 同时具有大多数地图所需要的特点。 Leaflet设计的非常简单易懂, 同时具有很好的性能和易用性。 它在桌面端和移动端都工作的相当高效,并有大量的插件用于扩张Leaflet的功能。

# 1. Leaflet的作者(个人):Vladimir Agafonkin

Vladimir Agafonkin 是一名软件工程师。他创建了Leaflet,它是交互式网络地图的第一大库,并维护了40 多个其他开源项目,重点是算法、计算几何和性能。目前作者就职于Mapbox公司。

联系作者:agafonkin@gmail.com

# 他的自我介绍

我也是一名音乐家。我用Obiymy Doschu写歌、弹吉他和唱歌。如果您喜欢带有弦乐编曲的优美、动人、多层次的摇滚音乐,请查看我们的上一张专辑。

我是美丽的7岁双胞胎女孩的父亲,我婚姻幸福,住在乌克兰基辅。我喜欢烘焙、摄影、力量训练、武术、阅读科幻小说和探索安静的公园。您可以在Instagram、Twitter和Facebook上找到我的生活花絮。

# 他的相关文章

# 2. Leaflet官方网站

建议大家将Leaflet官网的博客都读一遍,博客大概分为三类,主要是技术类,比如性能优化,调度算法等,一类是定期的新版本特性,能够了解Leaflet新功能和新特性,还有一类是大事记,比较轻松,不妨感受一下Leaflet的团队文化。

Leaflet官网 (opens new window) 官方博客 (opens new window)

# 3. Leaflet的源码

Leaflet遵循 BSD-2-Clause License 许可开源协议,可以免费的用于商业和非商业用途,无论是个人还是商业用途,可以任意修改源码不用开源,需要声明该产品使用了Leaflet。

GitHub开源地址 (opens new window) 官方教程 (opens new window) API文档 (opens new window)

Leaflet目前已经成熟近十多年,非常稳定,很少更新,当前最新版本是:

版本: (发布时间:)    下载zip包   或   Gihub releases列表

Npm version Npm downloads GitHub stars

Leaflet架构图,建议使用前先熟悉整体架构图,以便能够快速使用。 [新窗口查看大图]((/dev/img/jiagou/leaflet.png) ![架构图]((/dev/img/jiagou/leaflet.png)

# 4. Mars2D与Leaflet的关系

Mars2D很多类都是直接继承Leaflet的类来扩展使用的,比如 mars2d.Map extends L.Map,两个SDK是互相独立解耦的,可以理解为mars2d对leaflet做了扩展和提升,并重新封装、增加了很多功能。

以下是我们列出的继承关系清单,如果你对leaflet本身api比较熟悉,那么对应的我们扩展的类内的api都是包含leaflet本身的接口方法的,可以直接平滑兼容使用。

leaflet类 mars2d类 说明
L.Map mars2d.Map (opens new window) 地图主对象
L.TileLayer mars2d.layer.TileLayer (opens new window) XYZ瓦片 图层
L.TileLayer.WMS mars2d.layer.WmsLayer (opens new window) WMS服务 图层
L.ImageOverlay mars2d.layer.ImageLayer (opens new window) 单张图片 图层
L.FeatureGroup mars2d.layer.GraphicLayer (opens new window) 矢量数据 图层
L.LayerGroup mars2d.layer.GroupLayer (opens new window) 图层组
L.Marker mars2d.graphic.Marker (opens new window) 图标点 矢量对象
L.CircleMarker mars2d.graphic.Point (opens new window) 像素圆点 矢量对象
L.Polyline mars2d.graphic.Polyline (opens new window) 线 矢量对象
L.Polygon mars2d.graphic.Polygon (opens new window) 面 矢量对象
L.Circle mars2d.graphic.Circle (opens new window) 圆 矢量对象
L.Rectangle mars2d.graphic.Rectangle (opens new window) 矩形 矢量对象

# 4.1 mars2d中如何使用Leaflet

开发时如果需要 Leaflet 的内部接口可以直接使用L.*来调用即可,vue等环境中也可以通过mars2d.L.* 来获取 Leaflet 相关对象。

最后更新: 7/25/2022, 1:40:50 PM