Maps JavaScript API 政策和出處資訊

本文件列出使用 Maps JavaScript API 開發應用程式的相關規定。請注意,使用 Maps JavaScript API 時,須遵守您與 Google 簽訂的協議。

政策

本節說明 Maps JavaScript API 的相關政策。政策提供實用的導入指南和規定,協助您正確使用服務,並符合 Google Maps Platform 的期望。

快取限制的例外狀況

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

內容抓取

系統可能會根據使用者與應用程式的互動,傳回地點名稱。如果您擷取或保留地點名稱,用於使用者工作階段以外的任何其他情境,即構成抓取行為,違反我們的條款。

歐洲經濟區國家/地區

如果客戶的帳單地址位於歐洲經濟區 (EEA),這項產品適用的《服務條款》和功能可能有所不同。使用 Google 地圖平台建構內容前,請詳閱下列歐洲經濟區專屬條款和資訊:

如果您的帳單地址不在歐洲經濟區,則適用下列服務條款:

Google 地圖必須註明出處規定

本節說明透過應用程式顯示 Google 地圖和內容時,必須遵守的出處標示規定和規範。

歸因範例

以下是 Places UI Kit 的出處範例。

非 Google 地圖上的 Places UI Kit 著作權資訊範例
Place Details 密集元件套用必要出處。 在這張非 Google 地圖上,Google 地圖出處標示清晰可見,且 Google Maps Platform 內容與其他內容有明顯區別。

顯示 Google 地圖出處

在應用程式或網站中顯示 Google Maps Platform API 的內容時,必須遵守 Google 地圖作者資訊相關規定。如果內容顯示在已標明出處的 Google 地圖上,則不需額外註明出處。

包含 Google 地圖出處

如果 Google Maps Platform 已在使用者介面 (例如 Places UI Kit) 提供 Google 地圖出處資訊:

  • 無論出處資訊顯示在何處,都請勿移除。請勿修改、隱藏或遮蓋出處,並確保出處在背景中清晰可見。
  • 請一律使用邊框、背景顏色、陰影或足夠的空白等 UI 提示,在視覺上區分 Google 地圖平台內容與其他內容。
  • 進行視覺修改時,您必須遵守所有 Google 地圖作者資訊規定。

作者資訊應盡可能採用 Google 地圖標誌的形式。如果空間有限,可以使用「Google 地圖」文字。 使用者必須能清楚分辨哪些內容是由 Google 地圖提供。

左:Google 地圖標誌出處,右:Google 地圖文字出處
左:Google 地圖標誌出處資訊範例,右:Google 地圖文字出處資訊範例

標誌出處

在應用程式或網站中使用 Google 地圖標誌時,請遵守下列規定。
Google 地圖標誌出處標示的可接受變化版本
Google 地圖標誌出處標示可接受的變化版本示例

下載 Google 地圖標誌

使用官方 Google 地圖標誌檔案。請下載下方標誌,並按照本節的規範使用。

下載 Google 地圖出處素材資源

使用 Google 地圖標誌時,請遵循下列規範。

  • 請勿以任何方式修改標誌。
  • 維持標誌的顯示比例,避免變形。
  • 在雜亂的背景 (例如地圖或圖片) 上,使用有外框的標誌。
  • 在純色或細微漸層等素色背景上,使用無外框的標誌。

標誌大小規格

請遵循下列 Google 地圖標誌大小規格:
  • 標誌高度下限:16 dp
  • 標誌高度上限:19dp
  • 標誌最小留白區域:左、右和頂端 10dp,底部 5dp

如要瞭解 dp,請參閱 Material Design 網站上的像素密度。

Google 地圖標誌,顯示最小留白區域和可接受的大小範圍
Google 地圖標誌範例,顯示最小淨空區和可接受的大小範圍

標誌無障礙功能

請遵守下列 Google 地圖標誌無障礙規定:
  • 標誌和背景之間應保持無障礙對比度。
  • 加入無障礙標籤,並附上「Google 地圖」文字。
Google 地圖標誌出處標示不符規定,且有無障礙問題
Google 地圖標誌出處標示不當和無障礙問題示例

文字出處

如果介面大小不支援使用 Google 地圖標誌,可以拼出「Google 地圖」文字。請按照下列指南進行:

Google 地圖文字出處標示的可接受變化版本
Google 地圖文字出處標示可接受的變化版本示例
  • 請勿以任何方式修改「Google 地圖」文字:
    • 請勿變更 Google 地圖的大小寫
    • 請勿將「Google 地圖」拆成多行
    • 請勿將 Google 地圖本地化為其他語言。
    • 使用 HTML 屬性 translate="no",防止瀏覽器翻譯 Google 地圖。
不符合規定的 Google 地圖文字出處標示
Google 地圖文字出處標示不合規示例
  • 請按照下表說明設定 Google 地圖文字樣式:

    Google 地圖文字樣式規定
    屬性 樣式
    字型系列 Roboto。載入字型為選用步驟。
    備用字型系列 產品中已使用的任何 Sans-Serif 內文字型,或「Sans-Serif」以叫用預設系統字型
    字型樣式 一般
    字型粗細 400
    字型顏色 白色、黑色 (#1F1F1F) 或灰色 (#5E5E5E)。與背景保持無障礙對比度 (4.5:1)。
    字型大小 字型大小下限:12sp
    字型大小上限:16sp
    如要瞭解 sp,請參閱 Material Design 網站上的字型大小單位。
    字母間距 一般

CSS 範例

下列 CSS 會在白色或淺色背景上,以適當的字體樣式和顏色顯示 Google 地圖。

@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

.GMP-attribution {
font-family: Roboto, Sans-Serif;
font-style: normal;
font-weight: 400;
font-size: 1rem;
letter-spacing: normal;
white-space: nowrap;
color: #5e5e5e;
}

視覺效果規定

請遵循下列規定,處理 Google 地圖出處資訊的視覺效果。
  • 請將出處標示放在內容頂端或底部附近,並置於同一個視覺容器中。如果內容只有一行,出處資訊可以放在右側或左側。

  • 使用邊框、背景顏色、陰影或足夠的空白等 UI 提示,將 Google 地圖平台內容與其他內容區隔開來。

  • 請勿將非 Google 地圖平台內容歸功於 Google 地圖,以免造成誤解。
  • 請確認出處資訊一律清晰可見。請勿移除、隱藏、遮蓋或修改。

下圖是這些視覺效果規定的範例。

Google 地圖出處資訊位於內容頂端、底部和側邊的範例
Google 地圖出處標示範例:位於內容的頂端、底部和側邊

範例:兩種區分 Google 地圖內容 (地點評分) 和其他內容的方法
範例:兩種區分 Google 地圖內容 (地點評分) 和其他內容的方法

請勿遮蓋 Google 地圖出處資訊,或與其他來源的內容混淆
請勿遮蓋 Google 地圖出處標示,或與其他來源的內容混淆

第三方資料供應商

地圖產品中的部分資料和圖片來自 Google 以外的供應商。 對於某些產品 (例如 Map Tiles API),我們可能會提供第三方資料供應商的必要出處資訊。在這種情況下,出處資訊文字必須包含「Google 地圖」名稱和相關資料供應商,例如「地圖資料:Google、Maxar Technologies」。如果 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 物件的作者資訊欄位有提供作者相片和個人資料連結,建議您一併加入。下圖是公園評論範例:

顯示作者出處資訊

下列範例呈現如何取得地點、查看是否有評論,以及顯示第一則評論的資料:

// 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'],
});

// Create an HTML container.
const content = document.createElement('div');
const title = document.createElement('div');
const rating = document.createElement('div');
const address = document.createElement('div');
const review = document.createElement('div');
const authorLink = document.createElement('a');

// If there are any reviews display the first one.
if (place.reviews && place.reviews.length > 0) {
    // Get info for the first review.
    const reviewRating = place.reviews[0].rating;
    const reviewText = place.reviews[0].text;
    const authorName = place.reviews[0].authorAttribution.displayName;
    const authorUri = place.reviews[0].authorAttribution.uri;

    // Safely populate the HTML.
    title.textContent = place.displayName || '';
    address.textContent = place.formattedAddress || '';
    rating.textContent = `Rating: ${reviewRating} stars`;
    review.textContent = reviewText || '';
    authorLink.textContent = authorName;
    authorLink.href = authorUri || '';
    authorLink.target = '_blank';

    content.appendChild(title);
    content.appendChild(address);
    content.appendChild(rating);
    content.appendChild(review);
    content.appendChild(authorLink);
} else {
    content.textContent = `No reviews were found for ${place.displayName}.`;
}

// Create an infoWindow to display the review.
infoWindow = new InfoWindow({
    content,
    ariaLabel: place.displayName,
});

查看地點評論說明文件。

顯示相片出處資訊

如果應用程式會顯示相片,請務必標註每張相片擁有者的作者資訊。如果回應內含 Place 物件,相片的詳細資料會包含在 photos 陣列中。如要在回應中新增 photos 陣列,請在要求中加入 photos 資料欄位。

相片陣列的每個元素都是 Photo 的執行個體,內含 AuthorAttribution 類型的 authorAttributions 陣列。AuthorAttribution 物件的欄位是包含出處資訊 displayName、uri 和 photoUri 的字串,或是空白字串 (如果沒有任何可顯示的出處資訊)。

請參閱地點相片說明文件。

搜尋結果歸因

在歐洲,使用 Google 的純排名時,搜尋產品必須提供說明文字,說明決定搜尋結果排名的主要因素和主要因素的權重,且使用者最多只需點按 1 次即可查看。說明文字:

標題:關於這些結果

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

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

按鈕 2:確定

自動完成使用者地址

如果使用者在「客戶應用程式」中使用「自動完成」功能預先輸入街道地址,且該街道地址在不使用「自動完成」功能的情況下,也能由使用者完整且準確地提供,則使用者選取的地址不受《Google Maps Platform 協議》中的 Google 地圖內容限制約束。這項例外狀況僅適用於使用者選取的街道地址,且僅限於該使用者的特定交易,不適用於自動完成功能提供的建議地址清單或其他 Google 地圖內容。這項例外狀況不適用於其他 Google 地圖平台服務提供的任何搜尋點或地址查詢功能。

自動完成使用者地址

在上圖中,左側的地址清單仍受 Google 地圖內容限制。使用者選取地址後,該地址就不受 Google 地圖內容限制,僅用於該使用者的適用交易。

AI 輔助摘要

在應用程式中顯示 AI 輔助的摘要 (包括地點、區域和評論摘要) 時,請務必遵守下列規定:

  • 顯示必要的作者資訊、回報連結和推薦連結,如下所示。
  • 使用者必須能閱讀 Google 地圖提供的完整摘要文字。

顯示 AI 輔助摘要的揭露文字

顯示任何類型的 AI 輔助摘要時,請務必在摘要下方,附上在地化的揭露聲明文字 (在回應主體的 disclosureText 欄位中提供)。請勿修改或擴充 API 提供的揭露文字。

所有 AI 輔助摘要類型的揭露聲明
圖 1:揭露文字正確顯示在三種 AI 輔助摘要類型下方。

地點和區域摘要的其他規定

應用程式中顯示的地點和區域摘要,必須附上下列文字和必要連結:

文字 規定
關於此摘要 請使用以下連結前往「Google 收集及使用在地商家資訊的方式」:https://support.google.com/local-listings/answer/9851099。
報表摘要

使用回應中 flagContentUri 欄位包含的連結,向 Google 回報摘要內容的問題。

注意:無論在哪個區域,凡是透過 Places API (新版) 提供的 AI 輔助摘要,都將受到 Google 內容和產品政策的規範。您必須告知使用者,如果他們認為某些內容應根據適用法律從 Google 服務中移除,請使用提供的檢舉內容網址 (flagContentUri) 檢舉。

地點和區域摘要揭露
圖 2:AI 輔助區域摘要,其中包含必要相關連結,使用者可透過溢位選單存取。

評論摘要規定

應用程式中顯示的評論摘要必須附上標題,並加上「評論摘要」文字。此外,您必須使用下列文字和必要連結:

文字 規定
關於此摘要 請使用下列連結前往「Google 收集及使用在地商家資訊的方式」:https://support.google.com/local-listings/answer/9851099
報表摘要

使用回應中 flagContentUri 欄位包含的連結。

注意:無論在哪個區域,凡是透過 Places API (新版) 提供的 AI 輔助摘要,都將受到 Google 內容和產品政策的規範。您必須告知使用者,如果他們想根據適用法律檢舉應從 Google 服務中移除的內容,應使用提供的檢舉內容網址 (flagContentUri) 檢舉。

查看評論 使用回應中 reviewSummary.reviewsUri 欄位包含的連結。
評論摘要揭露事項
圖 3:AI 輔助評論摘要,使用者可透過溢位選單查看必要的相關連結。

車用螢幕指南

為確保駕駛安全,Google 建議在車輛停妥時,才顯示 AI 生成的摘要。在行車模式下顯示摘要時,畫面上的資訊應簡單、清楚且簡潔,確保駕駛能快速將注意力放回路況:

  • 最多 3 行
  • 120 個半形字元或 24 個字詞
  • 字型大小至少 24 dp

尤其是在汽車業,開發人員有責任以安全且符合所有當地法律和法規的方式,呈現 AI 輔助的摘要。