Leaflet开发入门

开发环境配置

电子地图已经渗透到O2O、生活服务、出行等领域，传统的GIS也孕育着互联网基因。在国内互联网电子地图领域，百度地图和高德地图较为出色，天地图作为国家地理信息公共服务平台，推出了面向互联网的公众版在线地图服务与API。国内在开放源代码这一方面做得远远不够，相比而言国外开源代码较多且丰富，如人气较高的OpenLayers、Leaflet、Mapbox GL等。
简单而言，Leaflet就是一个开源的前端地图交互类库，具有轻量级、支持移动端、丰富的插件资源等特点。2016年9月27日，Leaflet 1.0版本发布，越来越多的开发者加入社区，成为Leaflet的忠实用户，使得Leaflet的生态逐渐壮大。目前，Leaflet强大的开源库插件涉及地图应用的各个方面，包括地图服务、数据提供、数据格式、地理编码、路线搜索、地图控件等类型的插件。Leaflet官网的网址为http://leafletjs.com，GitHub项目的网址为https://github.com/Leaflet

使用Leaflet开发WebGIS应用，先要配置Leaflet开发环境，这也是Leaflet开发的必备步骤。
（1）获取Leaflet开发库。Leaflet是一个免费的开源库，用户可以从Leaflet官网下载，单击其官网首页的“Download”链接进入资源页面下载Leaflet开发库，

用户也可以从GitHub上的Leaflet项目资源中获取Leaflet开发库。在Leaflet的资源页面中，提供了当前最新版本的Leaflet开发库，Leaflet开发库分别提供了Leaflet开发必备的核心开发库、样式文件、图片资源。
Leaflet开发库如图

，包括如下内容。

Leaflet开发库

• leaflet.js（leaflet-src.js）：核心开发库，集成当前Leaflet的所有核心功能，其中leaflet-src.js为源码，供调试时使用。
• leaflet.css：样式类，包含Leaflet的所有默认样式信息。
• images：图像资源文件。
需要注意的是，使用的是Leaflet V1.3.3版本开发库，其官网会即时发布当前最新版本的Leaflet开发库。
（2）选定一个开发工具。针对PC端的Web应用需求，Leaflet作为一个基于JavaScript的WebGIS客户端开发库，本质就是HTML+JavaScript脚本的Web客户端开发，可以使用DreamWeaver等工具开发网页，还可以直接使用文本编辑器等编写网页。目前，除了DreamWeaver工具，开发Web应用时还有很多集成开发环境（Integrated Development Environment，IDE）供大家选择。.NET体系就是微软的Visual Studio，包括2010、2012、2015、2019等多个版本；Java的开发环境包括Eclipse、JBuilder、NetBeans等，这些都是主流的Web应用开发环境。
由于Leaflet是纯客户端的开发库，用户可以根据自己的喜好选择合适的开发工具。如果涉及后端开发，则建议根据.NET或Java体系类别选择相应的集成开发环境。在此，使用Microsoft Visual Studio 2010（简称VS2010）作为开发工具，部分功能实例涉及的后端开发采用.NET实现。用户可以从微软官网下载Microsoft Visual Studio 2010的安装程序。Leaflet以简单、易用、高效为开发理念，设计轻巧灵活，非常易于理解和上手，这也是它被众多用户喜爱的原因之一。Leaflet作为备受青睐的开源地图开发库，主要有以下几个特性。
（1）友好的移动端应用。Leaflet是轻量级、跨平台的，其压缩库的容量约为30KB，非常适应移动端应用场景，并且PC上的所有效果均能在移动端上无缝呈现，可以轻松在iPad、iPhone和Android等移动端构建地图应用。
（2）丰富的可视化效果。Leaflet可以轻松地实现自定义标注功能，并支持视频流。在标注图片时可以设置图标图片和阴影图片，让标注更有立体感；同时可以设置锚点的位置，让图标定位更加精准；另外，还可以像添加一个地图图层一样添加视频文件并在地图上展示。此外，还有很多诸如时空动画、热力图、聚合点等效果都可以轻松实现，增强可视化效果。
（3）出众的渲染性能。Leaflet采用HTML5实现高性能渲染，基于出色的地图渲染引擎，将会呈现出更加细腻流畅的地图，可以轻松支持大数据量级的点数据渲染，渲染性能非常出众。
（4）支持多种数据格式。Leaflet支持大部分服务标准与数据格式，并且可以自定义扩展，使用户在项目对接上无后顾之忧。GeoJSON是一种空间数据格式，Leaflet对此空间数据格式支持较好，也全面支持OGC服务规范（WMS、WFS等）。
（5）灵活的可扩展性。Leaflet受欢迎的主要因素之一就是其灵活的可扩展性，这让其在社区中拥有众多的扩展插件，满足各种功能需求。Leaflet可与专业GIS服务平台结合，丰富的GIS前端开发框架与专业的GIS服务平台强强联合，无缝对接，已经成为GIS领域应用开发的主力军。

开发移动端Hybrid App或移动Web App

，也是基于HTML5+JavaScript开发，但两种方式略有不同。移动端Hybrid App是原生开发嵌入H5页面，一般要借助移动端原生开发的工具，如Android开发使用主流的Eclipse或Android Studio工具、iOS开发使用苹果的Xcode等。移动Web App是为移动浏览器设计的基于Web的应用，与普通Web开发类似，应用部署在服务器端，移动端直接通过浏览器访问，不需要在设备上下载安装。因此，对于移动Web App方式，用户在进行移动网页开发时可以选择与PC端Web应用开发相同的开发工具。