Leaflet
From Wikipedia, the free encyclopedia
|
| |
| 作者 | Volodymyr Agafonkin |
|---|---|
| 初版 | 2011年5月 |
| 最新版 |
1.9.4
/ 2023年5月18日 |
| 最新評価版 |
2.0.0-alpha.1
/ 2025年8月16日 |
| リポジトリ |
github |
| プログラミング 言語 | JavaScript |
| 対応OS | クロスプラットフォーム(Web) |
| サポート状況 | 開発継続中 |
| 種別 | JavaScriptライブラリ |
| ライセンス | BSD-2-Clause[1] |
| 公式サイト |
leafletjs |
Leafletは、インタラクティブ地図のためのオープンソースJavaScriptライブラリである[2]。GeoJSONなどの地理データを読み込み・スタイル付けし、タイルベースのWeb地図やインタラクティブなレイヤー(クリック時にポップアップを表示するマーカー等)を容易に扱える。
Leafletは2011年に初公開され[3]、軽量なコアと豊富なプラグインで機能拡張できる[4]。著名な採用例として、Foursquare、Pinterest、Flickr、米国地質調査所(USGS)などが挙げられている[5]。
Leafletの典型的な使い方としては、spanやdivなどのHTML要素にLeafletの"map"オブジェクトをバインドする。 そしてそのmapオブジェクトにレイヤーやマーカーを追加する。
// "map" divに地図を作成し、指定した場所とズームで表示する
var map = L.map('map').setView([51.505, -0.09], 13);
// OpenStreetMapタイルレイヤーを追加する
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
変数Lを使ってLeafletライブラリそのものにアクセスできる。
機能
Leafletは基本機能としてWMS(Web Map Service)レイヤー、GeoJSONレイヤー、ベクターグラフィックスレイヤー、タイルレイヤーに対応している。 プラグインを使うとそれ以外にも多くのレイヤーに対応できる。
Leafletの基本的な表示モデルは、他のWeb地図ライブラリと同様に、1個のベースマップとその上に表示される0個以上の半透明のオーバーレイ、0個以上のベクターオブジェクトからなる。
構成要素
Leafletの主なオブジェクトのタイプは次の通りである: [7]
- ラスタータイプ (TileLayer と ImageOverlay)
- ベクタータイプ (Path, Polygon, Circle)
- グループタイプ (LayerGroup, FeatureGroup, GeoJSON)
- コントロール (Zoom, Layers, など)
他に様々なユーティリティクラスが存在する(地図投影のためのインターフェイスクラス、変形、DOMの操作など)。
GISフォーマットへの対応状況
Leafletは少数のGIS標準フォーマットに対応しており、それ以外への対応はプラグインによって実現されている。
| 標準 | 対応状況 |
|---|---|
| GeoJSON | 良好。geoJson 関数により標準でサポートされている。 |
| KML, CSV, WKT, TopoJSON, GPX | Leaflet-Omnivore プラグインによりサポートされている。[8] |
| WMS | TileLayer.WMSにより標準でサポートされている[9] |
| WFS | 未対応。ただしサードパーティによるプラグインは存在する[10]。 |
| GML | 未対応。[11] |
ブラウザ対応状況
Leaflet 1.3.4(2018年現在)はデスクトップでChrome, Firefox, Safari 5+, Opera 12+, IE 7-11、モバイルにおいてSafari for iOS 7+、Android browser 2.2+, 3.1+, 4+、Chrome for mobile、Firefox for mobile、IE10+ for Win8 devicesをサポートしている。
他の地図ライブラリとの比較
LeafletとOpenLayersはどちらもオープンソースでクライアントサイドのみのJavaScriptライブラリであるため、直接に比較できる。 Leafletの方がはるかに小さく、2015年の時点でLeafletのソースコードは7,000行、OpenLayersは230,000行である[12]。 ライブラリのファイルサイズもLeafletの方が小さい。 Leafletの方がコードベースが新しく、JavaScriptの最新の機能とHTML5、CSS3を利用している。しかし機能面ではOpenLayersにありLeafletにないものがある。 WFS(Web Feature Service)やEPSG 3785以外の投影法へのネイティブサポートなどである。
LeafletはプロプライエタリでクローズドソースのGoogle Maps APIやBing Maps APIとも比較できる。 Google Maps APIは高速、シンプル、柔軟性に富むが、Google Mapsサービスにアクセスするためにしか使えない。ただしGoogleのAPIのDataLayerを使うと外部データソースを表示できる [13]。