Leaflet - インタラクティブマップのためのJavaScriptライブラリ

2023年5月18日 — Leaflet 1.9.4 がリリースされました！

Leaflet は、モバイルフレンドリーなインタラクティブマップのための主要なオープンソースJavaScriptライブラリです。わずか42KBのJSで、ほとんどの開発者が必要とするすべてのマッピング機能を備えています。

Leaflet は、シンプルさ、パフォーマンス、および使いやすさを念頭に置いて設計されています。すべての主要なデスクトップおよびモバイルプラットフォームで効率的に動作し、多数のプラグインで拡張でき、美しく、使いやすく、十分に文書化されたAPIと、シンプルで読みやすいソースコードがあり、貢献するのが楽しいです。

ここでは、'map' divにマップを作成し、選択したタイルを追加し、次にポップアップにテキストを含むマーカーを追加します。

var map = L.map('map').setView([51.505, -0.09], 13);

L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

L.marker([51.5, -0.09]).addTo(map)
    .bindPopup('A pretty CSS popup.<br> Easily customizable.')
    .openPopup();

クイックスタートガイドで詳細を学び、その他のチュートリアルを確認するか、直接APIドキュメントに進んでください。ご不明な点がございましたら、まずFAQをご覧ください。

最高の信頼

GitHub foursquare Pinterest Facebook Evernote Etsy Flickr 500px Data.gov 欧州委員会ワシントン・ポストフィナンシャル・タイムズ NPR USAトゥデイ国立公園局 IGN.com OpenStreetMap

特徴

Leaflet は、すべての人にすべてのことを実行しようとはしません。代わりに、基本的なことを完全に機能させることに焦点を当てています。

すぐに使えるレイヤー

タイルレイヤー、WMS
マーカー、ポップアップ
ベクターレイヤー：ポリライン、ポリゴン、円、長方形
画像オーバーレイ
GeoJSON

インタラクション機能

慣性によるドラッグパン
スクロールホイールズーム
モバイルでのピンチズーム
ダブルクリックズーム
エリアへのズーム (Shiftキーを押しながらドラッグ)
キーボードナビゲーション
イベント：クリック、マウスオーバーなど
マーカードラッグ

視覚機能

ズームとパンのアニメーション
タイルとポップアップのフェードアニメーション
マーカー、ポップアップ、マップコントロールの非常に優れたデフォルトデザイン
Retina解像度サポート

カスタマイズ機能

簡単なリスタイリングのためのピュアCSSポップアップとコントロール
画像ベースおよびHTMLベースのマーカー
カスタムマップレイヤーとコントロールのためのシンプルなインターフェース
カスタムマップ投影（EPSG:3857/4326/3395がすぐに利用可能）
既存のクラスを拡張するための強力なOOP機能

パフォーマンス機能

モバイルでのハードウェアアクセラレーションにより、ネイティブアプリと同じくらいスムーズに感じられます
パンとズームを本当にスムーズにするためにCSS機能を利用する
動的なクリッピングと簡略化によるスマートなポリライン/ポリゴンレンダリングにより非常に高速になります
不要な機能を省くためのモジュール式ビルドシステム
モバイルでのタップ遅延の解消

マップコントロール

ズームボタン
帰属表示
レイヤースイッチャー
スケール

ブラウザサポート

デスクトップ

Chrome
Firefox
Safari 5+
Opera 12+
IE 9–11
Edge

モバイル

iOS 7+用のSafari
モバイル版Chrome
モバイル版Firefox
Win8デバイス用のIE10+

その他

非常に軽量
外部依存関係なし

Leafletに本当に欠けている機能が見つかった場合は、まずプラグインがあるかどうか、および以前にGitHub issueで議論されているかどうかを確認してください。そうでない場合は、新しいGitHub issueを開いてください。

参加する

世界で最高のマッピングライブラリを作りましょう！LeafletはもともとVolodymyr Agafonkinによって作成されましたが、現在は多数の貢献者によって開発されています。プルリクエストはいつでも歓迎します。ただし、Leafletの開発に参加する方法は他にもたくさんあります。

バグの発見と報告、ドキュメントの改善、Stack Overflow、GIS Stack Exchange、GitHub issueでの他のユーザーのサポート、X（旧Twitter）で@LeafletJSへメンション、同僚や友人の間でLeafletについて広めることで、プロジェクトに多大な貢献をすることができます。

Leafletの開発への参加に関する詳細については、貢献ガイドをご覧ください。