亂談Leaflet的插件在WebGIS中作用
前言
Leaflet和Openlayer都是兩個主要的開源前端庫。開放的程度都很高,但是考慮到移動端和小巧輕便易擴展,我大部分情況還是選擇leaflet。兼容移動端似乎是必不可少的事情,放大縮小平移,都是一些必備的功能。小巧才可以在移動端內存受限的情況下,有效運行。而擴展性就是又一個重要的特征。

插件
打開OpenCDN服務,leaflet常用的插件包括:
- leaflet - 移動端友好的交互地圖JavaScript庫
- leaflet.markercluster - 為Leaflet提供漂亮動態(tài)聚類功能
- angular-leaflet-directive - 用AngularJS directive完成更容易的交互地圖
- leaflet.draw - 矢量畫圖工具
- Leaflet.awesome-markers - 漂亮的高清圖片markers基于Glyphicons / Font-Awesome icons
- leaflet-providers - 底圖免費提供設置
- leaflet-dvf - leaflet數(shù)據可視化
- leaflet-hash 位置哈希表
- leaflet.fullscreen 全屏功能
- leaflet-editable 幾何可編輯工具
- leaflet-geocoder-mapzen 查找地理編碼通過Pelias Geocoder API
- leaflet-plugins 插件綜合
- Leaflet.heat 簡單的熱力圖
- leaflet-routing-machine 路徑計算工具
- leaflet-omnivore 常用的數(shù)據格式轉換工具
- proj4leaflet 投影轉換
- leaflet.freedraw 畫圖工具
- leaflet-vector-layers加載Arcgis server,geoIQ, Arc2Earth, CartoDB, GIS Cloud
- leaflet-realtime 實時更新數(shù)據
- leaflet-tilelayer-geojson geojson分瓦片加載
- leaflet-ajax 異步加載數(shù)據,不用jquery時用
- leaflet-gpx 加載gpx的數(shù)據
- leaflet-polylinedecorator 線段的裝飾
- Leaflet.Spin
其中,不乏非常常用的工具,包括leaflet.markercluster ,leaflet-providers,leaflet.fullscreen。底圖設置是每個GISer必須掌握。而中國的提供商有類似的工具如Leaflet.ChineseTmsProviders,包含了天地圖,高德,圖吧等瓦片提供商數(shù)據,讓底圖加載和切換更加簡單。marker的聚類分析和全屏功能非常有用。而編輯幾何要素,如leaflet.draw 和leaflet-editable,是很重要的一個方面,在一些項目上大有建樹。這兩個庫就像一套組合拳,分別對應的是矢量空間數(shù)據的創(chuàng)建和修改。
Leaflet.awesome-markers則是除了mapbox的marker style外的又一個精美圖標圖標的選擇,幫我們定義了很多marker的樣式。就流行的前端工具而言,angular-leaflet-directive和react-leaflet則是結合了現(xiàn)在當前流行的前端工具angular和react等mvvm工具。這也激發(fā)起我的一個idea,將Vue雙向綁定框架和leaflet相結合,整個組件化的設計會更加簡單,github地址brandonxiang/vue-leaflet,如果感興趣的話可以contribute一下。
leaflet-plugins是一個常用插件的集合,可解析gpx,kml,topojson,并且支持國外多家地圖供應商底圖。Leaflet.heat是超常用的簡易熱力圖,比heatmap.js更加簡單好用,原理類似,但是在效果上會根據縮放級別分層計算其熱力值。leaflet-omnivore是超級常用的數(shù)據轉換工具。方便各類數(shù)據在leafletjs的加載。
總結
leaflet各個插件將數(shù)據內容和地圖這平臺有機結合在一起,完成帶交互的數(shù)據可視化。好的生態(tài)帶動更多用戶,成為良性循環(huán)。相比之下,F(xiàn)lex和Silverlight確實十分過時了,現(xiàn)在更多是聚焦于Javascript這樣的輕量級和跨瀏覽器跨平臺的語言。整個成熟的生態(tài)圈滿足你各種各樣的項目需要。希望我寫的插件也可以發(fā)揮它應有的作用。