Wyświetl większą Mapę Google

Stanie w korkach to bolączka nie jednego kierowcy. Zanim wsiądziemy do auta warto na Mapach Google sprawdzić korki i wyświetlić warstwę natężenie ruchu na drodze.

Prędkość pojazdów pokazana jest kolorami. Zielony: ruch odbywa się płynnie. Pomarańczowy: średnie natężenie ruchu. Czerwony: opóźnienia w ruchu. Im ciemniejszy czerwony, tym ruch jest wolniejszy.

Na mapie zaznaczone są również zdarzenia drogowe. Obejmują one kilka rodzajów sytuacji, które powodują opóźnienia: wypadki, Wypadki, roboty drogowe, Roboty drogowe, zamknięcia dróg, Zamknięte odcinki drogi, inne zdarzenia. W przypadku zamkniętej drogi pojawi się przerywana czerwona linia na odcinku, który jest zamknięty.

Poniżej przyklad mapy z markerem, po kliknięciu którego wyskakuje okno z informacjami. W takim oknie możemy umieścić zwykły tekst, ale także obraz czy link.

Wyświetl mapę na osobnej stronie

Klikajac w marker otworzy się okno. Domyślnie pozostaje otwarte, dopóki użytkownik nie kliknie kontrolki zamknięcia (krzyżyka w prawym górnym rogu okna informacyjnego).

Do stworzenia takiej mapy potrzebne będzie wywołanie funkcji InfoWindow. W tym przykładzie pokazujemy jak podpiąć okno informacyjne do markera, ale możesz je również dołączyć do określonej szerokości/długości geograficznej, wywołując funkcję setPosition ().

W kolejnej częsci naszego kursu Google Maps API zobaczysz jak umieścić na stronie prostą mapę Google z markerem. To nic trudnego. Poradzisz sobie, jeśli tylko masz podstawową wiedzę z HTML i CSS oraz choć minimalną znajomością JavaScript.

  • Jesteś tutaj:  
  • Start