Waze iframe 사용

개발자는 웹사이트에 Waze 라이브 맵을 삽입할 수 있습니다. 실시간 지도를 통해 방문자는 Waze의 실시간 지도 데이터를 기반으로 위치를 검색하고 실시간 교통정보 업데이트를 볼 수 있습니다.

iFrame을 사용하여 웹사이트에 Waze 실시간 지도를 삽입하면 다음과 같이 출력됩니다.

기본적으로 라이브 지도의 왼쪽 하단에는 지도의 검색 및 경로 옵션에 대한 링크가 포함되어 있습니다.

추가 라이브 지도 구성 옵션의 예는 예를 참고하세요.

Waze 실시간 지도를 사용하여 iFrame을 삽입하려면 다음 단계를 따르세요.

  1. 텍스트 편집기에서 웹페이지를 엽니다.
  2. 웹페이지에서 iFrame을 생성하려면 웹페이지에 iFrame 코드를 추가하세요.
  3. Waze 라이브 지도를 열고, 검색창에서 또는 확대하고 지도의 특정 부분을 클릭하여 현재 위치를 검색합니다.
  4. 지도의 오른쪽 하단에 있는 공유 아이콘 을 클릭합니다.

  5. 맞춤 소스 코드와 함께 팝업이 표시됩니다. 코드를 복사하여 웹페이지 본문에 붙여넣습니다.

예

다음 예는 라이브 지도를 웹사이트에 삽입하는 방법을 보여줍니다. 사용 사례에 맞게 URL 매개변수를 업데이트하세요.

<iframe src="https://embed.waze.com/iframe?zoom=12&lat=45.6906304&lon=-120.810983"
  width="300" height="400"></iframe>

반응형 웹사이트에 iFrame을 삽입하려면 일반적인 CSS 기법을 사용하여 화면 크기에 따라 iFrame 크기를 자동으로 설정하는 것이 좋습니다.

URL 매개변수

다음 표는 Waze iFrame의 매개변수를 설명합니다.

매개변수 필수 여부 설명
desc 선택사항 이 매개변수를 원하는 값으로 설정하면 라이브 지도에 설명 텍스트 블록을 표시합니다. 방송사는 Wazer에게 최신 정보를 제공하기 위해 방송국 웹사이트를 수동으로 업데이트할 필요 없이 이 텍스트를 사용합니다. 모든 텍스트는 콘텐츠가 정확하도록 Waze에서 생성됩니다.
lat 필수 항목 지도 중심점의 위도입니다.
lon 필수 항목 지도 중심점의 경도입니다.
pin 선택사항

지도의 중앙에 핀을 배치하려면 1로 설정합니다. 예를 들면 다음과 같습니다.

<iframe src="https://embed.waze.com/iframe?
  zoom=12&lat=45.6906304&lon=-120.810983&pin=1"
  width="300" height="400"></iframe>
zoom 필수 항목

지도가 열릴 때의 확대 수준입니다.

최솟값은 3 (최소 배율)입니다. 최댓값은 17 (최대 배율)입니다.

현지화

기본 언어 코드는 영어입니다. 자세한 내용은 iFrame 현지화를 참고하세요.

다음 예는 표시 언어를 변경하는 방법을 보여줍니다.

<iframe src="https://embed.waze.com/fr/iframe?zoom=12&lat=45.6906304&lon=-120.810983"
  width="300" height="400"></iframe>

가이드라인

Waze 라이브 맵을 자신의 사이트에 퍼가려면, 다음 가이드라인을 준수해야 합니다.

  • 어떤 식으로든 Waze가 아닌 지도 사용과 연관되지 않아야 합니다.

  • Waze 브랜드가 아닌 자료 (로고, 아이콘 등)를 Waze 이외의 지도에 사용하지 마세요.

예시

다음 예는 매개변수 조합을 사용하여 라이브 지도에 다양한 시각적 요소를 추가하는 방법을 보여줍니다.

예 1

다음 iframe 구현은 지도 핀을 보여줍니다.

뉴욕주 맨해튼 (PIN 사용):

iframe은 다음 코드를 사용합니다.

<iframe src="https://embed.waze.com/iframe?zoom=13&lat=40.78247&lon=-73.97105&pin=1"
            width="100%" height="520"></iframe>

예 2

다음 iframe 구현에서는 지도 핀을 표시하고 설명 텍스트를 포함합니다.

San Paulo (고정 및 설명 포함):

iframe은 다음 코드를 사용합니다.

<iframe src="https://embed.waze.com/iframe?zoom=14&lat=-23.55052&lon=-46.63331&pin=1&desc=1"
            width="100%" height="520"></iframe>

예시 3

다음 iframe 구현은 지도 핀을 보여줍니다.

프랑스 파리 (PIN 포함):

iframe은 다음 코드를 사용합니다.

<iframe src="https://embed.waze.com/iframe?zoom=13&lat=48.85661&lon=2.35222&pin=1"
            width="100%" height="520"></iframe>

Waze 개발자 커뮤니티에 문의하기

자세한 내용을 알아보려면 Waze 개발자 커뮤니티 포럼에서 대화에 참여하세요.