Leaflet.js là Thư viện bản đồ đơn giản nhất bạn sẽ tìm thấy
Google Maps chắc chắn là phổ biến nhất tiện ích bản đồ nhúng cho các nhà thiết kế web. Nhưng những gì về thêm các tính năng tùy chỉnh chẳng hạn như chú giải công cụ và đánh dấu pin?
Đây là nơi có một thư viện tuyệt vời như Tờ rơi giúp một tấn.
Đây là một dự án nguồn mở hoàn toàn miễn phí ban đầu được tạo ra bởi một trong những kẻ tại Mapbox có tên Vladimir Agafonkin. Kể từ đó, Tờ rơi đã phát triển để bao gồm hàng chục người đóng góp vòng quanh thế giới.
Nó thường xuyên cập nhật với sửa lỗi và các tính năng mới cải thiện việc thực hiện tổng thể trên bất kỳ trang web nào. Đây là thư viện bản đồ yêu thích của tôi bởi vì sức mạnh tuyệt đối và thiết kế thẩm mỹ của nó.
Nó có rất nhiều tính năng mà tôi không thể liệt kê hết, nhưng đây là những điều thú vị nhất:
- Tăng tốc phần cứng di động
- Pin đánh dấu, lớp phủ hình dạng và chú giải công cụ
- Thu phóng tùy chỉnh & panning hoạt hình
- Không phụ thuộc vào JS
- Hỗ trợ cho tất cả các trình duyệt chính bao gồm IE7+
Thực hiện là một chút khó khăn vì bạn cần phải nhập tọa độ và xác định bản đồ nên rộng bao nhiêu.
Người dùng luôn có thể thu nhỏ và chảo xung quanh, vì vậy quan điểm luôn có thể thay đổi. Nhưng nó cũng dựa trên cách bạn xác định bản đồ trên trang.
Có rất nhiều trang tài liệu đầy đủ thông tin cho mọi khía cạnh của Tờ rơi. Đáng buồn thay, nó dày đặc đến mức tôi không thể khuyên bạn chỉ nên lặn vào đó bởi vì bạn có thể sẽ bị lạc. Thay vào đó, hãy kiểm tra Trang hướng dẫn tờ rơi trong đó bao gồm một hướng dẫn nhanh cho người mới.
Bạn sẽ học cách nhúng bản đồ, thay đổi kích thước / vị trí, và làm thế nào để thêm đồ họa tùy chỉnh lên trên, chẳng hạn như vòng tròn hoặc đánh dấu pin.
Hướng dẫn giới thiệu này có thể dạy bạn mọi thứ bạn cần để sử dụng Tờ rơi trên blog, trang web của công ty hoặc bất kỳ dự án nào sắp tới.
Có rất nhiều lý do tuyệt vời để sử dụng Google Maps: đó là mạnh mẽ, đáng tin cậy và miễn phí. Nhưng tờ rơi đi kèm rất nhiều tính năng khác và bạn chỉ cần thêm các tệp CSS / JS vào trang web của bạn để bắt đầu. Bạn thậm chí có thể tìm thấy bản sao được lưu trữ trực tuyến nếu bạn thích đi theo con đường CDN.
Đừng để tài liệu làm bạn sợ. Có rất nhiều thứ bạn có thể học nhưng không phải tất cả các tính năng là cần thiết cho một thiết lập tờ rơi cơ bản.
Và nó không mất nhiều để tạo một bản đồ tuyệt vời từ đầu. Hãy xem qua bản demo Codepen này được tạo sử dụng API của Leaflet.js & Google Maps.