3D 區域探索入門指南

圖片

總覽

3D 區域探索工具解決方案 提供體驗位置資訊這項解決方案運用了 Google 地圖 平台擬真 3D 資訊方塊地點 API 打造吸睛的互動式 3D 環境

3D 區域探索工具的設計能夠滿足多種用途:

  • 強化區域探索功能:使用者只需使用以下指令,即可在線上探索鄰近地區: 取得許多視覺細節,瞭解當地特色和 地標。

  • 宣傳適地性故事:能夠納入搜尋點 運用豐富說明的 (搜尋點) 撰寫 敘事導向體驗,為使用者提供特定資訊 或位置。

  • 鼓勵使用 Google 地圖的 3D 功能進行開發作業:示範示範 Google 3D 地圖資料的潛力 互動式地圖

開始進行:

啟用

重要技術

這個解決方案是以兩項關鍵技術為基礎:

Google 地圖平台 API:

我們使用 Google 地圖平台的多個 API 取得基本地圖和資料 ,打造個人專屬的體驗:

  • Google 地圖擬真成像 3D 圖塊: 以高解析度 3D 模型構成的建築物和地形, 都以視覺元素呈現都市環境。
  • Places API: 應用程式可以辨識並顯示有關 探索區域的搜尋點 (POI) 更豐富多元的使用者體驗 在地知識
  • 自動完成 方便使用者搜尋 興趣。

CesiumJS

CesiumJS 負責算繪和顯示高解析度 3D 。這個模型可處理 Google 擬真成像 3D 的載入和視覺化作業 圖塊:提供建築物和地形的 3D 網格模型。

相機管理:CesiumJS 提供多項工具,可用於控制攝影機 位置、方向和動作包括:

  • 設定初始觀點,將焦點放在 載入應用程式
  • 實作動態攝影機動作,例如自動軌道 探索專用的動畫
  • 處理使用者與地球的互動情形 (如有這類功能) (平移、縮放、旋轉)。

瞭解擬真 3D 圖塊 使用 3D 圖塊轉譯器

主要元件

應用程式分為兩個不同的應用程式,即:

  • 管理應用程式
  • 試用版應用程式

這張圖表概略說明兩者之間的差異和關聯 這兩款應用程式的用途:

圖片

建議您更深入地調查每個應用程式:

管理應用程式

這個應用程式提供容易使用的介面,可用來自訂 3D 體驗:

  • 地點搜尋:使用整合的 Google 地圖平台自動完成功能 以尋找要展示的區域。選取 就會流暢地移動到該區域。

  • 攝影機:調整攝影機移動速度和軌道類型, 以及所選的觀看體驗。

  • 地點 (POI):定義密度、搜尋半徑和點的類型 您感興趣 (例如餐廳、咖啡廳、地標)。

您可以使用這個應用程式為使用者提供個人化體驗。

請務必詳細說明所有自訂項目 3D 區域探索工具自訂功能

試用版應用程式

這是最後一個面向使用者的應用程式,會載入您的設定 您透過「管理」應用程式建立。在沉浸式 3D 環境中,使用者可以 即可探索所選區域,並探索您醒目顯示的地點。

使用管理控制台應用程式自訂外觀和風格後,您可以 下載設定並從原始碼執行自訂應用程式。

使用者體驗

圖片

這個應用程式的主要功能包括:

  1. 使用者可以透過互動方式以 3D 形式探索區域,包括建築物、 地標和地形
  2. 使用者可以搜尋及探索附近的地點 (例如博物館、公園、 餐廳)。
  3. 使用者選取地點後,即可查看詳細資訊或相關敘述 顯示與該地相關的地圖

  4. 開發人員可透過設定和 控制權限 (如果使用「管理控制台」應用程式的話)。

  5. 已啟用自動旋轉,允許相機自動旋轉 將焦點移至所選區域的中心點

先備知識

  1. Google Maps API 金鑰:您需要具備下列 API 的有效 API 金鑰 已啟用:

  2. 網路伺服器:您可以透過以下任一方式提供應用程式:

    • 本機網路伺服器 (例如使用 Node.js、http-server)
    • 靜態網路託管服務 (應用程式隨附 Dockerfile)

您可以在 README 中找到部署選項的詳細說明 專區設定。

Deployment

您可以將應用程式部署為節點應用程式或 Docker 容器 像是 GKE GAE.示範版示範影片使用以下項目 架構:

圖片

  • 在這個架構中,程式碼位於 GitHub 專案中。
  • Cloud Build 會在任何推送至主要作業時擷取程式碼,並在建構作業觸發 作業。
  • 在建構作業中,這個檔案會插入 API 金鑰並建立映像檔 儲存在 Artifact Registry 中。
  • 最後,將 Artifact Registry 中最新的穩定映像檔部署至 Cloud run.
  • 我們也正在執行幾項健康狀態檢查和監控作業 以及已部署應用程式的可用性

帳單資訊

3D 區域探索工具解決方案使用 Google 地圖平台服務,提供 讓人身歷其境的動態體驗部分 API 可能會產生費用。以下是 以及定價連結

Google 地圖平台 - 3D Tiles API:

述說故事解決方案運用 3D Tiles API 強化影像內容 提供地理空間資料的經驗關於 3D 圖塊的定價詳細資料 API,請參閱 Google 地圖平台 - 3D Tiles API 定價

Google 地圖平台 - Places API:

Places API 適用於以位置為基礎的資料,在 述說故事想瞭解與 Google Cloud 產品通訊的 Places API,造訪 Google 地圖平台 - Places API 定價

Google 地圖平台 - Autocomplete API:

自動完成功能可促進使用者互動。定價詳細資料 Google Maps Autocomplete API,歡迎造訪 Google 地圖平台 - Place Autocomplete 定價

CesiumJS:

CesiumJS (用於 3D 地球) 圖表CesiumJS 本身是開放原始碼,但額外功能或 這些服務可能各有相關費用。請參閱 CesiumJS 所有付費服務的說明文件。

請務必查看各 API 的定價詳細資料,也就是費用 會依據用量個別決定請注意,Google 地圖平台 提供一定用量的免費方案,以及特定用量的免費方案 規格可能會因要求數量和用量等因素而異 區域。

請隨時參考官方定價頁面,以取得最正確且最新的資訊 有關 Google 地圖平台和 CesiumJS 使用費用的資訊。確保遵循法規 遵守這些服務列出的條款及細則, 有效掌握任何相關費用。

結論

本文件將簡單介紹 3D 區域探索工具的功能 元件、使用者體驗和技術相關規定

這款遊戲運用 Google 的擬真成像 3D 圖塊和 Places API, 探索社區、發掘搜尋點,以及 瞭解當地歷史

是否能展示某個區域、以更深入的方式探索,或是宣傳數位管道 述說故事,3D 區域探索工具提供賞心悅目的平台。

歡迎試用並利用管理應用程式自訂介面,打造具有吸引力的 更豐富的 3D 體驗