Leaflet was created 11 years ago by Volodymyr Agafonkin, a Ukrainian citizen living in Kyiv.
Leaflet was created 11 years ago by Volodymyr Agafonkin, a Ukrainian citizen living in Kyiv.
一个开源并且对移动端友好的
交互式地图 JavaScript 库
Leaflet 是一个开源并且对移动端友好的交互式地图 JavaScript 库。 它大小仅仅只有 42 KB of JS, 并且拥有绝大部分开发者所需要的所有地图特性 。
Leaflet 简单、高效并且易用。 它可以高效的运行在桌面和移动平台, 拥有着大量的 扩展插件、 优秀的文档、简单易用的 API 和完善的案例, 以及可读性较好的 源码 。
在这里,我们在 id 为 map 的 div 中创建一个地图, 选择瓦片数据源, 添加一个标记点并且在弹出层上显示一些文本:
var map = L.map('map').setView([51.505, -0.09], 13);
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
L.marker([51.5, -0.09]).addTo(map)
.bindPopup('A pretty CSS3 popup.<br> Easily customizable.')
.openPopup();谁在使用 Leaflet
特性
Leaflet 并不会试图为每个人做完所有的事情。相反，它更专注于让基本的东西完美地工作。
开箱即用的图层
- 瓦片图层, WMS
- 标记点, 弹出层
- 矢量图层: 折线, 多边形, 圆形, 矩形
- 图像叠加
- GeoJSON
交互功能
- 拖动平移
- 滚轮缩放
- 在手机上缩放
- Double click zoom
- 缩放区域 (shift-drag)
- 按键 导航
- 事件: 点击, 鼠标悬停, 等.
- 标记 拖动
视觉特性
- 缩放和平移动画
- 平铺和弹出淡出动画
- 设计非常棒的 标记, 弹出层和地图控件
- 支持视网膜分辨率
自定义特性
- 纯CSS3弹出窗口和控件, 可以轻松重置样式
- 基于图像和HTML的标记
- 接口简单的 自定义地图图层和控件
- 自定义地图投影 (with
EPSG:3857/4326/3395开箱即用) - 强大的 OOP 设计 可扩展现有的类
性能特性
- 移动设备上硬件加速 像原生APP一样流畅
- 使用 CSS3 特性 实现真正平滑的平移和缩放
- 快速的动态剪切和简化功能的智能折线/多边形渲染
- 模块化构建 避免不必要的功能
- 消除手机点击延迟
地图控件
- 缩放按钮
- 版权
- 图层切换
- 比例尺
浏览器支持
桌面
- Chrome
- Firefox
- Safari 5+
- Opera 12+
- IE 9–11
- Edge
移动端
- Safari for iOS 7+
- Chrome for mobile
- Firefox for mobile
- IE10+ for Win8 devices
其它
- 轻巧
- 没有外部依赖
如果您发现 Leaflet 中确实缺少某些功能, 请首先检查是否有相关功能的 插件 或者它是否已经在 GitHub issues 讨论过。 如果都没有, 请提交一个新的 GitHub issue。
参与进来
让我们一起创建一个世界上最好的地图库吧! Leaflet 虽然最早由 Volodymyr Agafonkin 创建, 但现在由一个大型贡献者社区共同开发. 始终欢迎大家踊跃提交 PR。 除此之外, 还有更多方法可以参与 Leaflet 的开发。
你可以帮忙发现并提交 BUG、完善文档、 在 Stack Overflow、GIS Stack Exchange 和 GitHub issues 上帮助他人、 发推特 @LeafletJS 或者以及在同事和朋友中推广 Leaflet 来帮助该项目。
欢迎查看贡献指南，了解更多参与 Leaflet 开发的信息。