- tinyworldmap là bản đồ thế giới dành cho các ứng dụng web ưu tiên offline và băng thông thấp, được thiết kế để dùng cùng Leaflet
- Hỗ trợ đầy đủ mọi mức zoom và phiên bản đầy đủ nhất có kích thước gzip 450KB; phần dựng hình phía client đã được profiling và kiểm thử để không có độ trễ cảm nhận được ngay cả trên điện thoại cấu hình thấp từ 10 năm trước
- Bản đồ mặc định hiển thị 10.000 thành phố đông dân nhất đã được thêm vào OpenStreetMap, bao gồm các thành phố và thị trấn có dân số từ 48.000 người trở lên tại thời điểm viết
- Có hai cách sử dụng: làm basemap thay thế các tile OpenStreetMap hoặc làm bản đồ fallback để khi offline chuyển các yêu cầu tile OSM sang tile được tạo cục bộ
- Dữ liệu bản đồ tuân theo giấy phép ODBL như OpenStreetMap, và cần ghi công OpenStreetMap cùng tinyworldmap trong footer Leaflet hoặc vị trí tương tự
Mục đích và phạm vi của tinyworldmap
- tinyworldmap là bản đồ thế giới dành cho các ứng dụng web ưu tiên offline và băng thông thấp
- Được thiết kế để dùng cùng Leaflet và hỗ trợ mọi mức zoom
- Phiên bản đầy đủ nhất có kích thước gzip 450KB, và 1.1MB sau khi giải nén
- Khả năng dựng hình phía client đã được profiling và kiểm thử rộng rãi trên điện thoại cấu hình thấp từ 10 năm trước, và không có độ trễ có thể cảm nhận được
- Demo có tại Nightly demo, Stable demo, v3 announcement
Dữ liệu bản đồ mặc định
- Theo cấu hình mặc định, bản đồ hiển thị 10.000 thành phố đông dân nhất đã được thêm vào OpenStreetMap
- Tại thời điểm viết, phạm vi này bao gồm mọi thành phố và thị trấn có dân số từ 48.000 người trở lên
Hai cách dùng với Leaflet
Kiểu bản đồ và bản đồ tùy chỉnh
- Hàm khởi tạo nhận tùy chọn
render để thay đổi giao diện bản đồ
- Tùy chọn
style của từng lớp được áp dụng lên CanvasRenderingContext2D của Canvas
- Ví dụ, có thể thay đổi kiểu bằng cách đặt
fillStyle cho lớp state_borders
let render = {
state_borders: {
style: {fillStyle: '#f00'}
}
}
new L.GridLayer.TinyWorld({maxZoom: 19, render}).addTo(map)
- Nếu tổ chức của bạn cần bản đồ nội dung tùy chỉnh gồm bản đồ đường, bản đồ thành phố, bản đồ bằng ngôn ngữ khác, hoặc dữ liệu OSM hay không phải OSM, có thể yêu cầu báo giá qua
business@tinyworldmap.com
Các tùy chọn tệp bản đồ nhỏ hơn
-
Phiên bản không có đường biên
tiny-world-cities-10000.js(on) chứa dữ liệu của bản đầy đủ nhưng loại bỏ ranh giới bang/tỉnh, ranh giới quốc gia và đường bờ biển
- Phiên bản này giảm 300KB theo gzip và 825KB sau khi giải nén
- Ưu điểm của phiên bản không có đường biên là toàn bộ dữ liệu được bao gồm đều có độ chính xác cao
- Ranh giới quốc gia trong bản đầy đủ không chính xác ở mức zoom cao, nên khi overlay các hình bám theo ranh giới quốc gia hoặc đường bờ biển, hình ảnh có thể trông không tự nhiên
- Trong những trường hợp đó, phiên bản không có đường biên thường trông đẹp hơn
-
Phiên bản không có nhãn thành phố
- Có hai tệp không có nhãn thành phố
tiny-world-borders.js(on): bỏ ranh giới bang/tỉnh
tiny-world-nocities.js(on): giữ ranh giới bang/tỉnh
- Nhãn thành phố chiếm 410KB sau khi giải nén và 172KB khi nén
-
Phiên bản giảm số lượng thành phố
- Các tệp có nhãn thành phố cũng có các phiên bản cho 2.000 và 4.000 thành phố
- Chỉ cần thay
10000 trong tên tệp bằng 2000 hoặc 4000
- | Số thành phố bao gồm | Ngưỡng dân số |
- | --- | --- |
- | 10.000 | trên 48.000 người |
- | 4.000 | trên 137.000 người |
- | 2.000 | trên 287.000 người |
Giấy phép và ghi công
- Dữ liệu tinyworldmap tuân theo giấy phép ODBL giống như dữ liệu OpenStreetMap
- ODBL yêu cầu ghi công
- Nếu cấu hình theo cách được hướng dẫn, footer Leaflet phải bao gồm ghi công OpenStreetMap và tinyworldmap
- Nếu không, bạn phải tự thêm riêng phần ghi công OpenStreetMap và tinyworldmap
1 bình luận
Ý kiến trên Hacker News
Tôi thích ý tưởng này. Nó giải quyết được vấn đề phải thu nhỏ quá xa rồi chờ máy chủ render ô lục địa vừa yêu cầu
Tuy vậy, tôi không rõ trường hợp sử dụng nào mà người ta biết vị trí tương đối của West Bloomfield Township và Waterford Charter Township, hai vùng ngoại ô Detroit, nhưng lại không biết chúng thuộc bang nào hay thậm chí Great Lakes có tồn tại
Sẽ tốt hơn nếu dùng nhiều dữ liệu hơn cho đường bờ biển, và ít hơn nhiều cho việc chia nhỏ khu vực đại đô thị
Chúng che mất quá nhiều thông tin khác có thể hữu ích
Trông rất hay, nhưng chi tiết đường bờ biển quá thấp. Một số thị trấn ở Anh đang nổi trên biển, còn Greenland và Bắc Canada thì ngược lại chiếm hết các đỉnh
Có vẻ mức độ chi tiết theo phép chiếu Mercator đã được tính đến, nhưng nên hạ ưu tiên những khu vực hầu như không có người ở
Cơ sở dữ liệu SQLite của QRank trước đây cũng từng được đăng trên HN
[1] https://qrank.wmcloud.org/
[2] https://github.com/hikeratlas/qrank
Một tỉnh của Netherlands bị hiển thị như một hòn đảo tách khỏi phần đất liền của cả nước, dù thực tế không phải vậy. Trong khi đó bản đồ lại biết tới tận năm tên thành phố trong tỉnh đó, và vài cái gần như chồng lên nhau
Mặt khác, cá nhân tôi thấy việc đưa Afsluitdijk vào là chi tiết không cần thiết, nhưng tôi hiểu rằng với chương trình thì khó phân biệt giữa phần đất cần vẽ và hạ tầng hàng hải đơn giản
Đáng ra tôi nên mở ticket trên trình theo dõi lỗi, nhưng tôi chưa đăng nhập trên di động nên hiện tại bình luận HN là cách tốt nhất. Nếu ai đó cũng thấy vậy thì có thể dựa trên bình luận này để đề xuất điều chỉnh tỷ lệ, thêm khoảng cách tối thiểu giữa các thành phố, hoặc giảm kích thước toàn bộ tệp
French Polynesia thậm chí còn không tồn tại trên bản đồ
Lý do ban đầu không làm vậy là vì trên điện thoại cũ, đặc biệt là Firefox for Android, việc vẽ quá nhiều đa giác có thể gây crash. Sau đó tôi đã tối ưu quy trình vẽ, nhưng vẫn cần cẩn trọng
[1] https://tinyworldmap.com/beta.html
Đây là kiểu vấn đề mà kiểm soát chất lượng cơ bản phải lọc ra được
Tôi cũng đã làm thứ gì đó tương tự. Ưu tiên offline, rất nhỏ, dựa trên vector, nhưng tập trung vào quốc tế hóa
Có sẵn bằng mọi ngôn ngữ của Liên Hợp Quốc. Chỉ có Spanish là bị bỏ sót vì tôi quên mất, trong khi làm trong vài giờ là xong, thật đáng xấu hổ
Tên quốc gia và thành phố dùng tên chính thức được Liên Hợp Quốc ghi nhận. Vì vậy tên ngắn chính thức của UK là “United Kingdom of Great Britain and Northern Ireland”
https://map.ache.one/en
Việc vẽ một bản đồ nhẹ và xử lý quốc tế hóa tương đối dễ, vì có nhiều nguồn dữ liệu công khai và thư viện hỗ trợ
Phần thực sự khó hoàn toàn là định nghĩa hành chính. Hễ có dữ liệu gắn với đa số quốc gia thì sẽ luôn có chỗ lệch với nguồn bản đồ, và cuối cùng bạn phải tự làm bản đồ tùy chỉnh
Không có đồng thuận về việc “quốc gia” là gì. Western Sahara trên danh nghĩa là một quốc gia, nhưng trên thực tế Morocco đã tiếp tục chiếm đóng; Somalia thì Somaliland và Puntland vận hành gần như các quốc gia độc lập nhưng không được công nhận chính thức. Greenland, Niue và những nơi khác nằm đâu đó ở giữa
Theo kinh nghiệm của tôi ở cấp quốc gia, đó là một quy trình thủ công với đủ kiểu vá víu bẩn thỉu, và phần khó nhất là kiểm thử xem đã khớp đúng chưa. Đặc biệt khó là chọn mức độ khái quát hóa phù hợp và đáp ứng hình dung mà mọi người mong đợi ở bản đồ khu vực của họ
Tôi tò mò không biết liệu tác giả có thấy công sức để cải thiện mạnh bản đồ này là xứng đáng hay không
Dấu sao nằm ở Dar Es Salaam nhưng nhãn lại là Dodoma. Dodoma mới là thủ đô thực tế, nhưng nằm về phía trung tâm đất nước hơn
Dễ thương đấy. Trước đây tôi từng làm một thứ tương tự, dù không hoàn toàn giống hệt
https://web.archive.org/web/20020611095429/http://www.cs.man.ac.uk/~hancockd/CityZen/index.html
20.000 đoạn thẳng, 3.350 địa điểm, cộng cả trình xem và trò đố vui, tất cả chỉ 162KB
Cảm ơn vì phản hồi. Để giải thích bối cảnh của lựa chọn này, cho đến gần đây trọng tâm chính của dự án này không phải là hình dạng quốc gia
Trong thời gian dài, phiên bản không có biên giới trong README là phiên bản duy nhất, và tôi đã không nghĩ rằng có thể thêm toàn bộ thế giới. Nhưng hóa ra là làm được
Tôi đã phát hành phiên bản nightly loại bỏ các vịnh hẹp và bổ sung thêm chi tiết ở những nơi khác, bao gồm cả các đảo vốn được yêu cầu nhiều. Nhìn chung độ phân giải cũng cao hơn
Lý do ban đầu không làm như vậy là vì việc vẽ quá nhiều đa giác có thể làm treo các điện thoại cũ, đặc biệt là Firefox for Android. Sau đó tôi đã tối ưu hóa quy trình vẽ, nhưng vẫn cần cẩn trọng
[1] https://tinyworldmap.com/beta.html
Tôi không chắc 10.000 thành phố đông dân nhất có phải là bộ lọc tốt nhất hay không
Cách này sẽ ưu tiên các thành phố ở những nước lớn, còn các nước nhỏ thì nhiều khả năng phần lớn thành phố sẽ bị loại
Cần có một bộ lọc phụ kiểu lấy top X thành phố theo từng quốc gia. Như vậy có lẽ sẽ bao quát được cả các thành phố quan trọng của những nước nhỏ
Các tiêu chí như thủ đô quốc gia, thủ phủ vùng, thành phố toàn cầu, hay tính trung tâm trong khu vực có thể hữu ích để bổ sung cho điều kiện cơ bản
Trong thảo luận này, có lẽ các nhà địa lý học và nhà bản đồ học sẽ đưa ra lời khuyên hữu ích hơn
Thật thú vị khi chọn 10.000 khu định cư lớn nhất trên thế giới thì ngưỡng lại xuống đến dân số 48.000
Tôi vẫn đang cân nhắc xem con số này có đáng ngạc nhiên hay không
Kể cả tăng lên 200 thành phố thì vẫn còn trên 100.000 người. Theo Wikipedia, Daly City, CA ở vị trí #333 có dân số 100.007 người: <https://en.wikipedia.org/wiki/List_of_United_States_cities_b...>
Kiểu phân bố quy mô này, giống như nhiều tình huống mở rộng khác, nhìn chung gần tuyến tính trên đồ thị log-log
Ở China, phải xuống tới vị trí 106 mới gặp một thành phố dưới 1 triệu dân. Mỹ chỉ có 9 thành phố như vậy
India thì tôi vừa kiểm tra lại: có 46 thành phố trên 1 triệu dân, thành phố đứng thứ 100 là Malegaon có 471.000 người, còn Aurangabad đứng thứ 300 vẫn vượt 100.000 người
Tuy vậy, “thành phố” là một khái niệm rất tùy ý. Một số thành phố lớn hàng đầu thế giới theo tiêu chuẩn của quốc gia khác có thể được xếp là vùng đô thị lớn, thậm chí là bang hoặc tỉnh
Thành phố lớn nhất theo diện tích lại có dân số rất thấp. Sermersooq của Greenland có dân số 24.148 người, diện tích 575.300km², tức khoảng gấp 144 lần Rhode Island, và trong các bang của Mỹ thì chỉ Texas và Alaska là lớn hơn. Alaska cũng chỉ lớn hơn khoảng 12%
Địa lý đô thị là một lĩnh vực phức tạp, nên người ta thường so sánh đồng thời nhiều thang đo và định nghĩa như vùng thống kê đô thị, diện tích khu đô thị và dân số. Làm vậy sẽ giảm bớt tính tùy ý của ranh giới chính trị và phản ánh tốt hơn tổng dân số cùng ảnh hưởng kinh tế
Cũng khá ngạc nhiên khi biên giới thô như thế này mà dung lượng tệp lại chỉ ở mức đó
Có vẻ tổng dung lượng dữ liệu vẫn còn thấp hơn khá xa điểm cân bằng tối ưu giữa tính hữu dụng và kích thước tệp. Ví dụ, dù gấp đôi dung lượng thì biên giới có lẽ cũng không đến mức lởm chởm như vậy
Với mô tả rằng “bản đầy đủ chứa toàn bộ dữ liệu ngoại trừ biên giới và đường bờ biển, nhờ đó giảm 200KB”, điều này có nghĩa khoảng 29% là dữ liệu biên giới/đường bờ biển và 71% là tên cùng vị trí thành phố
Cá nhân tôi nghĩ có thể loại bỏ khá nhiều thành phố. Đặc biệt là những thành phố chồng lấn lên nhau, vì phải phóng to đến mức nhìn thấy cả mảng đất màu xám và tên thành phố thì chúng mới hiện ra, nên thay vào đó có lẽ tốt hơn là làm đường bờ biển chính xác hơn
Tôi cũng không rõ việc cần vị trí trên bản đồ thế giới tổng quát xảy ra thường xuyên đến mức nào. Ví dụ, với một địa điểm đang quan tâm hiện tại, có lẽ thứ thường cần hơn là một bản đồ nhẹ hiển thị các tuyến cao tốc lân cận và các tuyến giao thông công cộng để đi tới đó
Nếu làm một phiên bản chia toàn bộ Trái Đất theo đơn vị vài km², có lẽ ngay cả ở kích thước bằng một phần mười vẫn có thể chứa mức chi tiết khá hữu ích. Bản đồ toàn cầu low-poly tất nhiên vẫn có công dụng, như theo dõi Trạm Vũ trụ Quốc tế, nhưng có vẻ ít phổ biến hơn nhiều
Dù dân số ít hơn 40.000 thì thủ đô vẫn phải được đưa vào, và nên được đánh dấu bằng dấu sao theo cách nào đó
Thật sự rất tuyệt. Tôi ấn tượng với việc nó tải nhanh như vậy trên điện thoại
Ý tưởng nén dữ liệu không gian thành Paths rất hay
Nếu muốn tránh giấy phép ODbL thì dùng dữ liệu Natural Earth thay vì OSM cũng sẽ tốt
Sẽ còn tuyệt hơn nữa nếu kèm theo cả công cụ chuyển dữ liệu không gian sang Paths