Maps JavaScript API 政策

這個主題列出的註明出處相關規定,適用於所有使用 Maps JavaScript API 開發的應用程式,包括該 API 涵蓋的 Place Autocomplete 服務。如要瞭解更多的 Google 地圖平台條款,請參閱《Google 地圖平台服務條款》。

提供使用條款和隱私權政策

如果您使用 Maps JavaScript API 開發應用程式,請務必在應用程式中一併提供使用條款隱私權政策,且相關內容須符合您與 Google 雙方協議中載明的守則:

  • 使用條款和隱私權政策須設為公開。
  • 在應用程式的使用條款中,務必明確陳述使用應用程式時,使用者將受到 Google《服務條款》的約束。
  • 在隱私權政策中,務必告知使用者您目前使用 Google Maps API,並參照援引《Google 隱私權政策》。

適合顯示使用條款和隱私權政策的位置,取決於應用程式的平台。

行動應用程式

如果您開發的是行動應用程式,建議您在相關應用程式商店的應用程式下載頁面和應用程式設定選單中,提供應用程式使用條款和隱私權政策的連結。

網頁應用程式

如果開發的是網頁應用程式,建議您在網站頁尾提供使用條款和隱私權政策的連結。

預先擷取、快取或儲存內容

使用 Maps JavaScript API 的應用程式須遵守您與 Google 簽訂的協議條款。根據協議條款,除了已載述的少數情況,對於任何內容,一律不得預先擷取、建立索引、儲存或快取。

請注意,用於識別地點的地點 ID 不受快取限制的約束,Maps JavaScript API 回應中的 place_id 欄位會傳回地點 ID。如要瞭解如何儲存、重新整理及管理地點 ID,請參閱地點 ID 指南

顯示 Maps JavaScript API 結果

您可以在 Google 地圖上顯示 Maps JavaScript API 結果,也可以不顯示地圖。如要用地圖顯示 Maps JavaScript API 結果,只能在 Google 地圖顯示。禁止在非 Google 地圖上使用 Maps JavaScript API 資料。

如果應用程式在 Google 地圖上顯示資料,則會加入 Google 標誌,且不得變更。如果應用程式顯示 Google 資料時,與 Google 地圖在同一畫面,就不必進一步註明出處為 Google 的資訊。

如果應用程式顯示資料時,網頁或畫面上未一併顯示 Google 地圖,這些資料就須標註 Google 標誌。舉例來說,假使應用程式在一個分頁上顯示 Google 資料,在另一個分頁顯示含有這些資料的 Google 地圖,那麼第一個分頁就須顯示 Google 標誌。假如應用程式提供搜尋欄位 (不論是否使用自動完成功能),則欄位內都需要顯示這個標誌。

Google 標誌應置於地圖左下角,出處資訊則應放在右下角,兩者都要完整呈現在地圖上,不可出現在地圖下方或應用程式內的其他位置。在下列範例地圖中,Google 標誌位於地圖左下角,出處資訊則位於右下角。

政策出處資訊位置

以下 ZIP 檔案內含 Google 標誌,大小適用於電腦版、Android 版和 iOS 版應用程式。請勿調整或修改標誌大小。

下載檔案:google_logo.zip

請勿修改出處資訊。請勿移除、遮蔽或裁剪出標示資訊。您不得在內文中使用 Google 標誌 (例如「這些地圖來自 [Google_logo]」)。

確保出處資訊靠近內容。如果不是用直接嵌入的方式加入 Google 圖像螢幕截圖,則標註的標準出處資訊應與該圖片顯示的相同。必要時,您可以自訂出處資訊文字的樣式和位置,只要把握基本原則,確保文字靠近內容,且能讓一般觀眾/讀者清楚易懂即可。請不要將出處資訊移到內容區域以外的位置,例如放到書尾、檔案或節目的製作/演出人員名單,或是網站頁尾。

加入第三方資料供應商。我們的地圖產品中,部分資料和圖片來自 Google 以外的供應商。如果使用這類圖像,出處說明文字必須包含「Google」名稱和相關資料提供者,例如「地圖資料:Google、Maxar Technologies」。如果圖像引用了第三方資料供應商,只標示「Google」或 Google 標誌並非適當的出處標示。

如果您在裝置上使用 Google 地圖平台,但無法顯示出處資訊,請 與 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: "ChIJpyiwa4Zw44kRBQSGWKv4wgA", // Faneuil Hall Marketplace, 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 物件的欄位是包含出處資訊 displayNameuriphotoUri 的字串,或是空白字串 (如果沒有任何可顯示的出處資訊)。

參閱地點相片說明文件

搜尋結果歸因

在歐洲,如果使用 Google 原始排名,搜尋產品必須提供說明文字,且點按一次即可顯示,說明決定搜尋結果排名的主要因素和權重。說明文字:

標題:這些結果的相關資訊

內文:當您搜尋某個位置附近的商家或地點時,Google 地圖會顯示本地搜尋結果。系統會結合多項因素 (主要包括關聯性、距離和名氣) 找出最符合的搜尋結果。

按鈕 1:瞭解詳情
「瞭解詳情」文字應連結至說明中心文章

按鈕 2:確定

Google 出處資訊樣式守則

如果您無法使用可下載的 Google 標誌,請遵循下列樣式守則,以 CSS 和 HTML 加入 Google 出處資訊。

淨空空間

鎖定圖文標誌周圍的淨空空間大小,應等同或超過 Google 中「G」的高度。

出處資訊與 Google 標誌的間隔應為「G」寬度的一半。

易讀性

署名應一律清楚易讀,並以適當的顏色變化顯示,以配合特定背景。採用的標誌版本配色上須有足夠的對比。

顏色

如果是白色或淺色背景,文字顏色使用 Google 礦石灰 700,黑色色調最高介於 0% 到 40%。

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」,該字就會以適當的字型、顏色和間隔,顯示於白色或淺色背景上。

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;