Deweloperzy mogą umieścić mapę na żywo w Waze na swoich stronach internetowych. Mapa na żywo pozwala użytkownikom wyszukiwać lokalizacje i wyświetlać informacje o natężeniu ruchu w czasie rzeczywistym na podstawie aktualnych danych map z Waze.
Mapę na żywo Waze umieszczasz na swojej stronie za pomocą elementu iframe, przez co dane wyjściowe wyglądają tak:
Domyślnie mapa na żywo zawiera w lewym dolnym rogu link do opcji wyszukiwania i wyznaczania tras.
Przykłady dodatkowych opcji konfiguracyjnych mapy na żywo znajdziesz w przykładach.
Aby umieścić element iFrame w mapie na żywo w Waze:
- Otwórz stronę internetową w edytorze tekstu.
- Aby wygenerować element iFrame na stronie internetowej, dodaj do niej ten kod.
- Otwórz mapę na żywo w Waze i wyszukaj swoją lokalizację za pomocą paska wyszukiwania lub powiększając i klikając konkretny segment mapy.
- Kliknij ikonę udostępniania
w prawym dolnym rogu mapy. Powinno pojawić się wyskakujące okienko z dostosowanym kodem do umieszczenia na stronie. Skopiuj kod i wklej go w treści strony internetowej.
Przykład
Z przykładu poniżej dowiesz się, jak umieścić mapę na żywo na swojej stronie. Zaktualizuj parametry adresu URL odpowiednio do swojego przypadku użycia.
<iframe src="https://embed.waze.com/iframe?zoom=12&lat=45.6906304&lon=-120.810983" width="300" height="400"></iframe>
Jeśli chcesz umieścić element iframe w elastycznej witrynie, zalecamy stosowanie popularnych technik CSS w celu automatycznego ustawiania rozmiaru elementu iframe na podstawie rozmiaru ekranu.
Parametry adresu URL
Tabela poniżej zawiera opis parametrów elementu iframe Waze:
| Parametr | Wymagana? | Opis |
|---|---|---|
desc |
Opcjonalnie | Ustaw ten parametr na dowolną wartość, aby wyświetlić opisowy blok tekstowy na mapie na żywo. Nadawcy używają tego tekstu, aby dostarczać użytkownikom Waze aktualne informacje bez konieczności ręcznego aktualizowania stron internetowych stacji. Cały tekst jest tworzony przez Waze, zapewniając, że jego zawartość jest prawidłowa. |
lat |
Wymagany | Szerokość geograficzna punktu środkowego mapy. |
lon |
Wymagany | Długość geograficzna środka mapy. |
pin |
Opcjonalnie | Aby umieścić pinezkę na środku mapy, ustaw 1. Na przykład: <iframe src="https://embed.waze.com/iframe? zoom=12&lat=45.6906304&lon=-120.810983&pin=1" width="300" height="400"></iframe> |
zoom |
Wymagany | Poziom powiększenia mapy po jej otwarciu. Wartość minimalna wynosi 3 (najmniejsze powiększenie). Maksymalna wartość to 17 (największe powiększenie). |
Lokalizacja
Domyślnym kodem języka jest angielski. Więcej informacji znajdziesz w artykule o lokalizowaniu elementu iframe.
Z przykładu poniżej dowiesz się, jak zmienić język wyświetlania:
<iframe src="https://embed.waze.com/fr/iframe?zoom=12&lat=45.6906304&lon=-120.810983" width="300" height="400"></iframe>
Wytyczne
Aby umieścić mapę na żywo Waze na swojej stronie, musisz przestrzegać tych wytycznych:
- Nie wolno w żaden sposób wiązać Waze z mapą inną niż Waze.
- Nie używaj materiałów z marką Waze (logo, ikon itp.) w mapach innych niż Waze.
Przykłady
W poniższych przykładach pokazujemy, jak używać kombinacji parametrów, aby dodawać różne elementy wizualne do mapy na żywo:
Przykład 1
Poniższa implementacja iframe pokazuje pinezkę mapy.
Manhattan, Nowy Jork (z kodem PIN):
Element iframe używa tego kodu:
<iframe src="https://embed.waze.com/iframe?zoom=13&lat=40.78247&lon=-73.97105&pin=1"
width="100%" height="520"></iframe>
Przykład 2
Poniższa implementacja elementu iframe pokazuje pinezkę mapy i tekst opisowy.
San Paulo (z pinezką i opisem):
Element iframe używa tego kodu:
<iframe src="https://embed.waze.com/iframe?zoom=14&lat=-23.55052&lon=-46.63331&pin=1&desc=1"
width="100%" height="520"></iframe>
Przykład 3
Poniższa implementacja iframe pokazuje pinezkę mapy.
Paryż, Francja (z pinezką):
Element iframe używa tego kodu:
<iframe src="https://embed.waze.com/iframe?zoom=13&lat=48.85661&lon=2.35222&pin=1"
width="100%" height="520"></iframe>
Kontakt ze społecznością deweloperów Waze
Aby dowiedzieć się więcej, dołącz do dyskusji na forum społeczności deweloperów Waze.