Leaflet.js adalah Pustaka Peta Sederhana yang Pernah Anda Temukan
Google Maps tentu saja yang paling populer widget peta yang dapat disematkan untuk desainer web. Tapi bagaimana dengan itu? menambahkan fitur khusus seperti tooltips dan spidol pin?
Di sinilah perpustakaan yang luar biasa suka Leaflet.js membantu satu ton.
Ini adalah sebuah proyek open source sepenuhnya gratis awalnya dibuat oleh salah satu orang di Mapbox bernama Vladimir Agafonkin. Sejak itu, Leaflet telah berkembang untuk memasukkan puluhan kontributor keliling dunia.
Itu sering diperbarui dengan perbaikan bug dan fitur baru yang meningkatkan implementasi keseluruhan di situs web apa pun. Sejauh ini, ini adalah perpustakaan pemetaan favorit saya karena kekuatannya dan estetika desainnya.
Ini memiliki begitu banyak fitur yang saya tidak mungkin daftar semuanya, tetapi di sini ada yang paling menarik:
- Akselerasi perangkat keras seluler
- Penanda pin, overlay bentuk, dan tooltips
- Zoom kustom & animasi panning
- Tidak ada dependensi JS
- Dukungan untuk semua browser utama termasuk IE7+
Implementasi agak sulit karena Anda perlu melakukannya masukkan koordinat dan tentukan seberapa besar peta seharusnya.
Pengguna selalu bisa perkecil dan menjelajah, sehingga tampilan selalu bisa berubah. Tapi ini juga berdasarkan bagaimana Anda mendefinisikan peta di halaman.
Ada yang sangat besar halaman dokumentasi penuh info untuk setiap aspek Leaflet. Sayangnya, itu sangat padat sehingga saya tidak bisa merekomendasikan hanya menyelam ke dalamnya karena Anda mungkin akan tersesat. Sebagai gantinya, lihat Halaman tutorial Leaflet yang juga termasuk a panduan mulai cepat untuk pemula.
Anda akan belajar caranya embed peta, ubah ukuran / posisi, dan bagaimana caranya tambahkan grafik khusus di atas, seperti lingkaran atau spidol pin.
Panduan intro yang satu ini bisa mengajarkan Anda semua yang Anda butuhkan untuk menggunakan Leaflet di blog, situs web perusahaan, atau proyek yang akan datang.
Ada banyak alasan bagus untuk menggunakan Google Maps: ini kuat, tepercaya, dan gratis. Tapi Leaflet datang lebih banyak fitur di luar kotak dan Anda hanya perlu tambahkan file CSS / JS ke halaman web Anda untuk memulai. Anda bahkan dapat menemukannya salinan dihosting secara online jika Anda lebih suka pergi rute CDN.
Jangan biarkan dokumentasi membuat Anda takut. Ada banyak yang bisa Anda pelajari tetapi tidak semua fitur diperlukan untuk pengaturan Leaflet dasar.
Dan itu tidak perlu banyak buat peta yang menakjubkan dari awal. Mengintip demo Codepen ini dibuat menggunakan Leaflet.js & Google Maps API.
