Leaflet
作者 Vladimir Agafonkin
初版 2011年5月13日 (2011-05-13)
最新版 1.9.4[1] ウィキデータを編集 - 2023年5月18日 (21か月前)
リポジトリ
ウィキデータを編集
プログラミング
言語		 JavaScript
プラットフォーム ブラウザ対応状況を参照
サポート状況 開発中
種別 JavaScriptライブラリ
ライセンス BSD-2-Clause[2]
公式サイト leafletjs.com ウィキデータを編集
テンプレートを表示

Leafletは広く使われているWeb地図のためのJavaScriptライブラリである。 2011年に最初にリリースされた[3]。 モバイルとデスクトップのプラットフォームのほとんどに対応し、HTML5とCSS3に対応している。 OpenLayersやGoogle Maps API（英語版）とともに最も人気のあるJavaScript地図ライブラリの一つであり、FourSquare、Pinterest、Flickrなどの有名なサイトで使われている。

Leafletを使うと、GISの知識のない開発者でも容易にタイルベースのWeb地図を表示できる。またGeoJSONから地物データを読み込んでスタイリングしたり、インタラクティブなレイヤーを作ることができる（クリックするとポップアップが表示されるマーカーなど）。

LeafletはVladimir Agafonkinによって開発されている。Vladimir Agafonkinは2013年からMapboxに加わっている [4]。

使用例

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: '&amp;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の主なオブジェクトのタイプは次の通りである: [5]

他に様々なユーティリティクラスが存在する（地図投影のためのインターフェイスクラス、変形、DOMの操作など）。

GISフォーマットへの対応状況

Leafletは少数のGIS標準フォーマットに対応しており、それ以外への対応はプラグインによって実現されている。

標準対応状況
GeoJSON良好。geoJson 関数により標準でサポートされている。
KML, CSV, WKT, TopoJSON, GPXLeaflet-Omnivore プラグインによりサポートされている。[6]
WMSTileLayer.WMSにより標準でサポートされている[7]
WFS（英語版）未対応。ただしサードパーティによるプラグインは存在する[8]。
GML未対応。[9]

ブラウザ対応状況

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行である[10]。 ライブラリのファイルサイズも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を使うと外部データソースを表示できる [11]。

歴史

Leafletは2010年、当時Agafonkinが働いていた地図プロバイダCloudMadeのためのWeb地図API JavaScriptライブラリとして生まれた。 2011年5月、CloudMadeはLeafletの最初のリリースを発表した。それは改めて作り直されたものだったが、古いAPIコードの一部を流用したものだった[12]。

このリリースはRetina対応と多くのユーザビリティ、ユーザエクスペリエンスの改善を含んでいた [13]。

このリリースはAPIのメソッドとイベントの範囲を拡大し、GeoJSONの保存機能を追加した。これはMapboxの援助による2日間のコードスプリントで完成した [14]。

このリリースはバグ修正にフォーカスし、リファクタリングと後方非互換性の可能性がまもなく来ることを公表した[15]。

このリリースは、v0.7.7 と比較し 400 を超える変更があった[16]。主な改善点は:

参考文献

[脚注の使い方]
  1. ↑ "v1.9.4 Latest"; 閲覧日: 2023年5月20日; 出版日: 2023年5月18日.
  2. ↑ “License - Leaflet”. Leaflet. 12 February 2015閲覧。
  3. ↑ Lovelace, Robin. “Testing web map APIs - Google vs OpenLayers vs Leaflet”. 2014年8月6日閲覧。
  4. ↑ Macwright, Tom (2014年8月6日). “Leaflet Creator Vladimir Agafonkin Joins MapBox”. Mapbox. 2014年8月6日閲覧。
  5. ↑ “Leaflet API”. 2014年8月6日閲覧。
  6. ↑ https://github.com/mapbox/leaflet-omnivore
  7. ↑ “Leaflet documentation”. 2014年8月6日閲覧。
  8. ↑ https://github.com/Georepublic/leaflet-wfs
  9. ↑ https://github.com/Leaflet/Leaflet/issues/547
  10. ↑ “OpenHub.net comparison between OpenLayers and Leaflet”. OpenHub.net. 2014年8月8日時点のオリジナルよりアーカイブ。2015年4月18日閲覧。
  11. ↑ “Data Layer - Google Maps Javascript API - Google Developers”. 2014年8月6日閲覧。
  12. ↑ “Announcing Leaflet: a Modern Open Source JavaScript Library for Interactive Maps”. CloudMade (2011年5月13日). 2014年8月7日閲覧。
  13. ↑ “Leaflet 0.5 released”. 2014年8月6日閲覧。
  14. ↑ “Leaflet 0.6 Released, Code Sprint in DC with MapBox”. 2014年8月6日閲覧。
  15. ↑ “Leaflet 0.7 Release, MapBox and Plans for Future”. 2014年8月6日閲覧。
  16. ↑ “Meet Leaflet 1.0.”. 2018年2月4日閲覧。

外部リンク

⌬ Phoenix Mesh CID: 未登録 IPFS未登録 📡 0ピア N=1 CRITICAL PQS A84