Korzystanie z iFrame Waze

Deweloperzy mogą umieścić mapę na żywo Waze na swoich stronach. Mapa na żywo umożliwia użytkownikom wyszukiwanie: lokalizacje i sprawdzaj informacje o natężeniu ruchu w czasie rzeczywistym na podstawie danych map z Waze w czasie rzeczywistym.

Mapę na żywo Waze umieszczasz w swojej witrynie za pomocą elementu iframe, dzięki czemu wyniki wyszukiwania wyglądają np.:

Domyślnie mapa na żywo zawiera link do opcji wyszukiwania i wyznaczania trasy na tej mapie w w lewym dolnym rogu.

Przykłady dodatkowych opcji konfiguracji mapy na żywo: Przykłady.

Aby umieścić element iframe z mapą na żywo w Waze:

  1. Otwórz stronę w edytorze tekstu.
  2. Aby wygenerować element iframe na stronie, dodaj do niej kod iframe.
  3. Otwórz mapę na żywo w Waze. wyszukać swoją lokalizację, korzystając z paska wyszukiwania lub powiększając widok i klikając określone danego fragmentu mapy.
  4. Kliknij ikonę udostępniania w prawym dolnym rogu mapy.
  5. Powinno pojawić się wyskakujące okienko z dostosowanym kodem do umieszczenia na stronie. Skopiuj kod i wklej go w treści do Twojej strony internetowej.

Przykład

Ten przykład pokazuje, jak umieścić mapę na żywo w witrynie. Zaktualizuj URL dla 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, użyj popularnych technik CSS do ustawia automatycznie rozmiar elementu iframe, zależnie od rozmiaru ekranu.

Parametry adresu URL

W poniższej tabeli opisano parametry elementu iframe Waze:

Parametr Wymagana? Opis
desc Opcjonalnie Ustaw ten parametr na dowolną wartość, by na mapie na żywo wyświetlał się opisowy blok tekstowy. Nadawcy używają tego tekstu, aby przekazywać użytkownikom Waze aktualne informacje, bez potrzeby ręczne aktualizacje stacji witryn. Cały tekst jest tworzony przez Waze, dzięki czemu treści jest poprawne.
lat Wymagany Szerokość geograficzna punktu środkowego mapy.
lon Wymagany Długość geograficzna punktu środkowego mapy.
pin Opcjonalnie

Ustaw na 1, aby umieścić pinezkę w środku mapy. 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 to 3 (najmniejsze powiększenie). Maksymalna wartość to 17 (w większości powiększenie).

Lokalizacja

Domyślnym kodem języka jest angielski. Więcej informacji znajdziesz w artykule Lokalizacja iFrame.

Ten przykład pokazuje, 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 w swojej witrynie, musisz przestrzegać tych wytycznych:

  • Nie należy w żaden sposób wiązać Waze z używaniem mapy spoza Waze.

  • Nie używaj materiałów marki Waze (logo, ikon itp.) na mapach, które nie są związane z Waze.

Przykłady

Poniższe przykłady pokazują używanie kombinacji parametrów do dodawania różnych elementów wizualnych do mapy na żywo:

Przykład 1

W poniższym wdrożeniu iframe widoczna jest pinezka 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

Następująca implementacja elementu iframe wyświetla pinezkę na mapie i zawiera opis.

San Paulo (z kodem PIN 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

W poniższym wdrożeniu iframe widoczna jest pinezka mapy.

Paryż, Francja (z kodem PIN):

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>

Skontaktuj się z Deweloperami Waze Społeczność

Aby dowiedzieć się więcej, dołącz do rozmowy na Programiści Waze Forum pomocy.