Warstwy to obiekty na mapie, które składają się z co najmniej 1 oddzielnego elementu, ale są modyfikowane jako pojedyncza jednostka. Warstwy zwykle odzwierciedlają kolekcje obiektów, które dodajesz na mapie, aby wskazać wspólny związek. Interfejs Maps JavaScript API zarządza prezentacją obiektów w warstwach, renderując ich elementy składowe w jeden obiekt (zazwyczaj nakładkę płytek) i wyświetlając je w miarę zmiany widoku mapy. Warstwy mogą też zmieniać sposób wyświetlania warstwy samej mapy, nieznacznie zmieniając płytki podstawowe w sposób zgodny z warstwą. Pamiętaj, że większość warstw nie może być obsługiwana za pomocą poszczególnych obiektów, ale tylko jako całość.
Omówienie warstw
Interfejs Maps JavaScript API obsługuje kilka typów warstw:
- Warstwa danych Map Google to kontener na dowolne dane geoprzestrzenne. Za pomocą warstwy danych możesz przechowywać dane niestandardowe lub wyświetlać na mapie Google dane GeoJSON.
- Warstwa mapy termicznej renderuje dane geograficzne za pomocą wizualizacji mapy termicznej.
- Warstwa KML renderuje elementy KML i GeoRSS w nakładce mapy interfejsu Maps JavaScript API.
- Warstwa natężenia ruchu pokazuje na mapie warunki natężenia ruchu.
- Warstwę transportu publicznego na mapie przedstawiającą sieć transportu publicznego w Twoim mieście.
- Obiekt Warstwa rowerowa renderuje warstwę ścieżek rowerowych lub nakładek rowerowych na wspólną warstwę. Ta warstwa jest domyślnie zwracana w ramach DirectionsRenderer, gdy żądasz wskazówek dojazdu w trybie BICYCLING.
Dodawanie warstwy
Aby dodać warstwę do mapy, wystarczy wywołać metodę setMap()
, przekazując jej obiekt mapy, na którym ma być wyświetlana warstwa. Aby ukryć warstwę, wywołaj funkcję setMap()
, podając argument null
.
Ten fragment kodu umieszcza mapę w centrum Londynu w Wielkiej Brytanii i dodaje warstwę transportu publicznego.
var mapOptions = { zoom: 13, center: new google.maps.LatLng(51.5,-0.11) } var map = new google.maps.Map(document.getElementById("map"), mapOptions); var transitLayer = new google.maps.TransitLayer(); transitLayer.setMap(map);