Maps JavaScript API에 대한 정책

이 주제에서는 Maps JavaScript API 및 해당 API의 일부인 Place Autocomplete 서비스로 개발된 모든 애플리케이션에 적용되는 저작자 표시 요구사항을 안내합니다. 다른 Google Maps Platform 약관을 확인하려면 Google Maps Platform 서비스 약관을 참고하세요.

이용약관 및 개인정보처리방침 제공

Maps JavaScript API 애플리케이션을 개발하면 Google과의 계약에서 명시된 가이드라인을 준수하는 애플리케이션에 대한 이용약관개인정보처리방침을 제공해야 합니다.

  • 이용약관개인정보처리방침은 공개되어야 합니다.
  • 애플리케이션 사용 시 Google 서비스 약관의 적용을 받게 된다는 사실을 애플리케이션 이용약관에 명시해야 합니다.
  • 개인정보처리방침에서 Google Maps API를 사용 중이라는 사실을 사용자에게 알리고 참조 자료로 Google 개인정보처리방침을 포함해야 합니다.

이용약관개인정보처리방침을 공개하는 권장 위치는 사용 중인 애플리케이션의 플랫폼에 따라 다릅니다.

모바일 애플리케이션

모바일 앱을 개발하는 경우, 애플리케이션 스토어의 애플리케이션 다운로드 페이지와 애플리케이션의 설정 메뉴에서 이용약관개인정보처리방침으로 연결되는 링크를 제공하는 것이 좋습니다.

웹 애플리케이션

웹 애플리케이션을 개발하는 경우, 웹사이트의 바닥글에서 이용약관개인정보처리방침으로 연결되는 링크를 제공하는 것이 좋습니다.

콘텐츠 프리패치, 캐싱 또는 저장

Maps JavaScript API를 사용하는 애플리케이션에는 Google과의 계약에서 명시된 약관이 적용됩니다. 계약의 약관에 따라, 약관에서 명시된 제한적인 조건을 제외하고는 어떤 콘텐츠도 프리패치, 색인 생성, 저장 또는 캐싱할 수 없습니다.

장소를 고유하게 식별하는 데 사용되는 장소 ID캐싱 제한에서 제외됩니다. 장소 ID는 Maps JavaScript API 응답에서 `place_id` 필드에 반환됩니다. 장소 ID 가이드에서 장소 ID를 저장, 새로고침, 관리하는 방법을 알아보세요.

Maps JavaScript API 결과 표시

Maps JavaScript API 결과는 Google 지도에 표시하거나, 지도가 없는 환경에서 표시할 수 있습니다. Maps JavaScript API 결과를 지도에 표시하려는 경우, Google 지도에 해당 결과를 표시해야 합니다. Google 지도가 아닌 지도에서는 Maps JavaScript API 데이터를 사용할 수 없습니다.

애플리케이션 내에서 Google 지도에 데이터를 표시하는 경우, Google 로고가 포함되어야 하며 로고를 변경할 수 없습니다. Google 데이터를 Google 지도와 동일한 화면에 표시하는 애플리케이션은 Google에 대한 저작자 표시를 추가로 제공할 필요가 없습니다.

애플리케이션 내에서 Google 지도를 표시하지 않는 페이지나 뷰에서 데이터를 표시하는 경우, 해당 데이터와 함께 Google 로고를 표시해야 합니다. 예를 들어 애플리케이션에서 특정 탭에 Google 데이터를 표시하고, 다른 탭에서는 동일한 데이터를 Google 지도와 함께 표시하는 경우 첫 번째 탭에서 Google 로고를 표시해야 합니다. 애플리케이션에서 검색창을 사용하는 경우 로고를 인라인으로 표시해야 합니다(자동 완성 사용 여부와 무관).

Google 로고는 지도의 왼쪽 하단에 배치하고 저작자 표시 정보는 오른쪽 하단에 표시해야 합니다. 로고와 저작자 표시 모두 지도 안에 있어야 하며 지도 밑에 있거나 애플리케이션의 다른 위치에 게시해서는 안 됩니다. 다음 지도 예시에서는 지도의 왼쪽 하단에 있는 Google 로고와 지도 오른쪽 하단에 있는 저작자 표시를 보여줍니다.

정책 저작자 표시 위치

다음 zip 파일에는 데스크톱, Android 및 iOS 애플리케이션별 적정 크기의 Google 로고가 있습니다. 어떤 방식으로든 로고를 수정하거나 크기를 조정해서는 안 됩니다.

다운로드: google_logo.zip

저작자 표시를 수정해서는 안 됩니다. 저작자 표시 정보를 삭제하거나, 가리거나, 일부를 자를 수 없습니다. Google 로고는 인라인으로 사용할 수 없습니다(예: '이 지도는 [Google_logo]에서 제공받았습니다').

저작자 표시는 콘텐츠와 가까운 곳에 배치해야 합니다. 직접 삽입하는 경우가 아닌 Google 이미지의 스크린샷을 사용한다면 이미지에 나타난 표준 저작자 표시를 포함시키세요. 저작자 표시 텍스트를 콘텐츠에 가까이 배치하고 일반 사용자나 독자가 쉽게 알아볼 수 있다면 필요에 따라 저작자 표시 텍스트의 스타일과 위치를 맞춤설정할 수 있습니다. 저작자 표시를 콘텐츠와 멀리 떨어진 위치로 이동해서는 안 됩니다(예: 책의 마지막 부분, 파일이나 영상의 크레딧, 웹사이트의 바닥글).

서드 파티 데이터 제공업체를 포함해야 합니다. Google의 지도 제품에 포함된 일부 데이터와 이미지는 Google 외 제공업체가 제공합니다. 이러한 이미지를 사용하는 경우, 저작자 표시에서 서비스명인 'Google'과 관련 데이터 제공업체를 명시해야 합니다(예: '지도 데이터: Google, Maxar Technologies'). 이미지에 인용된 서드 파티 데이터 제공업체가 있는 경우 저작자 표시에 'Google' 또는 Google 로고만 포함해서는 안 됩니다.

기기에서 Google Maps Platform을 사용 중이며 저작자 표시가 실용적이지 못한 경우 Google 영업팀에 문의하여 사용 사례에 적합한 라이선스를 확인하세요.

기타 저작자 표시 요구사항

다음 안내에 따라 서드 파티 저작자 표시를 가져오고 해당 저작자 표시를 앱에서 표시하세요.

장소의 저작자 표시 가져오기

앱에서 Place.fetchFields를 호출하여 가져온 리뷰 정보를 표시하는 경우, 가져온 장소 세부정보에 대한 서드 파티 저작자 표시도 같이 표시해야 합니다.

API에서는 Place 객체를 반환합니다. Place 객체로 저작자 표시를 가져오려면 요청마다 반환되는 Place.attributions 속성을 사용하세요(필드로 명시하지 않아도 됨). 속성에서는 String객체의 List를 반환하거나, 표시할 저작자 표시가 없는 경우 null을 반환합니다. 다음 예시 코드에서는 장소를 가져오고 관련 저작자 표시를 표시합니다.

  // Use place ID to create a new Place instance.
  const place = new Place({
      id: 'ChIJB9a4Ifl744kRlpz0BQJzGQ8', // Crazy Good Kitchen
  });

  // Call fetchFields, passing the desired data fields.
  await place.fetchFields({
      fields: ["displayName", "formattedAddress", "location", "reviews"],
  });

  // Check for any place attributions.
  if (!place.attributions) {
      console.log('No attributions were found.');
      return;
  } else {
      // Log the place attribution
      for (var attribution of place.attributions) {
          console.log(attribution);
      }
  }

  

리뷰 표시

Place 객체는 최대 5개의 리뷰를 포함할 수 있으며, 각 리뷰는 Review 객체로 표시됩니다. 앱에서 이러한 리뷰를 선택적으로 표시할 수 있습니다.

Google 사용자가 작성한 리뷰를 표시하는 경우, 리뷰와 가까운 위치에 작성자의 이름을 배치해야 합니다. Review 객체의 작성자 저작자 표시 필드에 작성자의 사진과 프로필로 연결되는 링크가 있는 경우, 이들 또한 포함하는 것이 좋습니다. 다음 이미지는 공원에 대한 리뷰의 예시를 보여줍니다.

작성자 저작자 표시

다음 예시에서는 장소를 가져오고, 리뷰를 확인한 다음 첫 리뷰의 데이터를 표시하는 것을 보여줍니다.

  // Use place ID to create a new Place instance.
  const place = new Place({
      id: 'ChIJB9a4Ifl744kRlpz0BQJzGQ8', // Crazy Good Kitchen, Boston MA
  });

  // Call fetchFields, passing "reviews" and other needed fields.
  await place.fetchFields({
      fields: ["displayName", "formattedAddress", "location", "reviews"],
  });

  // If there are any reviews display the first one.
  if (!place.reviews) {
      console.log('No reviews were found.');
  } else {
      // Log the review count so we can see how many there are.
      console.log("REVIEW COUNT: " + place.reviews.length);

      // Get info for the first review.
      let reviewRating = place.reviews[0].rating;
      let reviewText = place.reviews[0].text;
      let authorName = place.reviews[0].authorAttribution.displayName;
      let authorUri = place.reviews[0].authorAttribution.uri;

      // Create a bit of HTML to add to the info window
      const contentString =
        '<div id="title"><b>' + place.displayName + '</b></div>' +
        '<div id="address">' + place.formattedAddress + '</div>' +
        '<a href="' + authorUri + '" target="_blank">Author: ' + authorName + '</a>' +
        '<div id="rating">Rating: ' + reviewRating + ' stars</div>' +
        '<div id="rating""><p>Review: ' + reviewText + '</p></div>';

      // Create an info window.
      infoWindow = new InfoWindow({
          content: contentString,
          ariaLabel: place.displayName,
      });

      // Add a marker for the place.
      const marker = new AdvancedMarkerElement({
          map,
          position: place.location,
          title: place.displayName,
      });

      // Show the info window.
      infoWindow.open({
          anchor: marker,
          map,
      });
  }
  

사진의 저작자 표시

앱에서 사진을 표시하는 경우, 사진에 포함된 작성자 저작자 표시를 함께 표시해야 합니다. 응답의 Place 객체에 포함된 사진에 관한 세부정보는 photos 배열에 포함되어 있습니다. 응답에 photos 배열을 추가하려면 요청에 photos 데이터 필드를 포함시키세요.

사진 배열의 각 요소는 Photo의 인스턴스로, AuthorAttribution 유형의 authorAttributions 배열이 포함되어 있습니다. AuthorAttribution 객체의 필드는 저작자 표시의 displayName, uri, photoUri를 포함하는 문자열이거나 표시할 저작자 표시 정보가 없는 경우 빈 문자열입니다.

Google 저작자 표시의 스타일 가이드라인

다음은 다운로드 가능한 Google 로고를 사용할 수 없는 경우 CSS 및 HTML 형식의 Google 저작자 표시를 위한 스타일 가이드라인입니다.

공간 확보하기

락업 주변의 빈 공간은 Google의 'G' 높이와 같거나 높아야 합니다.

저작자 표시 문구와 Google 로고 간 공간은 'G' 너비의 반이어야 합니다.

가독성

작성자 이름은 항상 명확하고 읽기 수월해야 하며 배경에 적합한 색상으로 표시되어야 합니다. 선택하는 로고 버전에 대해 충분한 색상 대비를 사용하세요.

색상

0%~40% 색조 범위의 검은색을 사용하는 흰색 또는 밝은 색상의 배경에서 Google Material Gray 700 색상의 텍스트를 사용하세요.

Google
#5F6368
RGB 95 99 104
HSL 213 5 39
HSB 213 9 41

어두운 배경, 화려하지 않은 패턴을 포함하는 배경 또는 사진에서는 작성자 이름 및 저작자 표시에 흰색 텍스트를 사용하세요.

Google
#FFFFFF
RGB 255 255 255
HSL 0 0 100
HSB 0 0 100

글꼴

Roboto 글꼴을 사용하세요.

예시 CSS

다음 CSS는 'Google'이라는 텍스트에 적용되었을 때 흰색 또는 밝은 색상의 배경에서 'Google'을 적절한 글꼴, 색상 및 간격으로 렌더링시킵니다.

font-family: Roboto;
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 16px;
padding: 16px;
letter-spacing: 0.0575em; /* 0.69px */
color: #5F6368;