Biblioteki do renderowania map wektorowych w przeglądarce

13

Czy istnieje biblioteka JavaScript typu open source, taka jak Leaflet lub OpenLayers, która może być używana w aplikacji internetowej lub mobilnej i ładuje mapy wektorowe zamiast obrazów? Potrzebuję tylko informacji o drodze i niektórych POI.

Jedyną biblioteką, którą znalazłem, były polimapy - ale nadal potrzebowałbym serwera lub usługi, która obsługuje wektorowe dane SVG (najlepiej z OpenStreetMap). Jest też fajny projekt na Androida o nazwie Mapsforge, ale potrzebowałbym go do aplikacji internetowej lub innych urządzeń mobilnych.

openstreetmap web-mapping vector web-service vector-tiles Karussell
źródło

Odpowiedzi:

10

W przypadku rysowania wektorów Leaflet lub OpenLayers będą w porządku. Nic nowego.

W przypadku map kafelkowych wektorowych (tj. Różnych rozdzielczości / poziomów szczegółowości przy różnych poziomach powiększenia) TileStache jest prostym i dobrym serwerem. Korzystałem z wielu eksperymentów z Polymaps (AFAIK, jedyna działająca przeglądarka wektorowa z kafelkami w formacie js). Niektóre osoby używały OpenLayers do dodawania obsługi wektorów kafelkowych , ale AFAIK nie został zintegrowany z bagażnikiem od roku, więc prawdopodobnie nie będzie w najbliższej przyszłości z powodu braku zainteresowania.

Sam TileStache (serwer) działa bardzo dobrze. Niemniej jednak znalazłem kilka błędów w Polymaps i ponieważ nie jest już aktualizowany (porzucony projekt), nie mogę się przekonać do użycia go w produkcji (sam musiałbym go zachować ... Nie mogę tego uzasadnić ja jeszcze.)

Moim rozwiązaniem było napisanie niestandardowego renderera wektorów natywnych OpenGL, który jest używany w AmigoCloud . Tak właśnie renderowane są wszystkie mapy w naszym serwisie. W tym celu TileStache dostarczył całkiem dobrze.

Chcesz spojrzeć na dostawcę wektora TileStache . Aby dowiedzieć się, jak z niego korzystać, możesz zapoznać się z bardzo podstawowym zestawem testów wektorowych, który napisałem .

Niestety nie sądzę, aby Ulotka wspierała wektory kafelkowe.

Ragi Yaser Burhum
źródło
Dzięki! Czy w Internecie dostępna jest prosta wersja demonstracyjna tilestache?
Karussell,
Gęstość zaludnienia w polymapach używa pamięci podręcznej dostawcy wektorów kafelkowych (tj. Nie działa serwer tilestache, ale tylko kopia tego, jak wyglądałoby wyjście). Patrząc na kod, powinno być oczywiste, że jest to polymaps.org/ex/population.html . Niestety, wersje demonstracyjne tilestache dostępne online nie korzystają z dostawcy wektorów. Niemniej jednak, jeśli uruchomisz serwer tilestache-server lokalnie i zastąpisz adresy URL wersji demo twojego hosta lokalnego skonfigurowanym wektorowym źródłem danych (plik shapefile, postgis itp.), To zadziała. W razie potrzeby proszę o pomoc.
Ragi Yaser Burhum
Nie zgadzam się z tą odpowiedzią, szczególnie tą. For just drawing vectors, Leaflet or OpenLayers will do just fine. Nothing new there.To zadziała, jeśli wektory mają zostać nałożone, ale co powiesz, jeśli cała mapa (cała warstwa podstawowa) będzie zorganizowana jako wektory?
giser
@giser Właśnie dlatego rozróżniam „tylko rysowanie wektorów” i „mapy kafelkowe wektorów”. Drugą odpowiedzią było określenie „całe” mapy wykonane wyłącznie z wektorów. Oto przykład takiej rzeczy: bl.ocks.org/mbostock/5593150
Ragi Yaser Burhum
@RagiYaserBurhum: Przepraszam, źle to zrozumiałem.
giser
10

Aktualizacja: od opublikowania tego Mapbox wypuścił Mapbox GL JS , który renderuje wektorową mapę bazową opartą na WebGL w przeglądarce.

W tym momencie nie ma ustalonej opcji. Jedyną w pełni wektorową produkcyjną mapą jest MapsGL firmy Google, która jest bardzo ograniczona ze względu na obsługę i wydajność przeglądarki.

W tej chwili najbardziej zbliżone do open source to Kothic.js i toczenie własnych kafelków za pomocą skryptu Kothic .

tmcw
źródło
+1 hej, to jest fajne! nie rozumiem, dlaczego zostałeś przegłosowany!
Karussell
6

Jeśli dobrze zrozumiem twoje pytanie, zarówno OpenLayers, jak i Ulotka załadują / pokażą dane wektorowe.

Na przykład

http://leafletjs.com/examples/geojson/

ładuje to plik GeoJSON na mapę ulotki, która używa OSM przez CloudMade w tle.

OpenLayers prawdopodobnie obsługuje więcej różnych typów formatów wektorowych, takich jak KML

http://dev.openlayers.org/examples/dynamic-text-layer.html

Jeśli masz na myśli, że chcesz serwować dane wektorowe na mapie, spójrz na MapServer, GeoServer i ESRI ArcGIS Server, które wszystkie będą zapisywać dane wektorowe na twojej mapie jako Web Feature Server (WFS).

tjmgis
źródło
Mam na myśli samą mapę jako dane wektorowe, a nie niektóre funkcje, które ładuję na mapę.
Karussell
serwowanie dużej ilości danych przez typ wektorowy może zawiesić się, a nawet zabić przeglądarkę, ze względu na zbyt wiele <svg>elementów należy o tym pamiętać
Krystian
@Krystian To znaczy, jeśli renderujesz mapę za pomocą SVG. Najwyraźniej możesz to wyrenderować za pomocą OpenGL / WebGL (tak jak Google Maps na Androidzie / iOS i na eksperymentalnych mapach javascript WebGL).
Ragi Yaser Burhum
@RagiYaserBurhum tak, nie myślałem o tym, ale w tym konkretnym przypadku nie można korzystać z WebGL, z powodu ograniczeń w API ect ..
Krystian
1
OP nie wspomniał o ArcGIS API, więc nie zakładałem, że (wiele GIS można zrobić bez ArcGIS). Tak, zgadzam się, że mieszanie ArcGIS JS z WebGL byłoby uciążliwe. Wektory kafelkowe są nowe - ale mają duże szanse na bycie przyszłością. Może
Ragi Yaser Burhum
2

Znalazłem inny interesujący projekt o nazwie GL-Solar, który opiera się na technologii webgl zamiast SVG lub płótna. Choć jest na wczesnym etapie rozwoju, wygląda obiecująco.

Również MapCSS , Cartagen i d3.js należy wymienić. Plik d3.js jest używany w internetowym edytorze osm iD . Jest też post na blogu o ulotce i renderowaniu HTML5.

Karussell
źródło