3D 區域探索入門指南

圖片

總覽

3D Area Explorer 解決方案提供了探索地點和體驗位置的全新方式。這項解決方案運用 Google 地圖平台擬真成像 3D 圖塊和 Places 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 地圖平台自動完成搜尋列，尋找要顯示的區域。選取位置後，攝影機就會流暢飛向該區域。

  • Camera：調整攝影機動作速度和軌道類型，以建立所選的瀏覽體驗。

  • 地點 (搜尋點)：定義您要呈現的密度、搜尋半徑和搜尋點類型 (例如餐廳、咖啡廳、地標)。

請使用這個應用程式為使用者提供自訂體驗。

請參閱 3D Area Explorer 自訂項目的詳細說明。

試用版應用程式

這是最終向使用者顯示的應用程式，會載入您在管理應用程式中建立的設定。在這個沉浸式 3D 環境中，使用者將可探索所選區域，並探索您所標示的地點。

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

使用者體驗

圖片

這個應用程式的主要功能如下：

  1. 使用者可以以互動方式探索 3D 區域，包括建築物、地標和地形。
  2. 使用者可以搜尋及探索附近地點 (例如博物館、公園、餐廳)。

  3. 使用者只要選取地點，就能查看該地點的詳細資訊或說明。

  4. 開發人員可以透過設定和控制項 (如果使用「管理」應用程式) 打造個人化的探索體驗。

  5. 已啟用自動旋轉功能，可讓相機根據所選區域的中心自動旋轉。

必要條件

  1. Google Maps API 金鑰：需具備有效的 API 金鑰，並啟用下列 API：

  2. 網路伺服器：您可以透過下列任一位置提供應用程式：

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

您可以在 GitHub 專案的 README 區段中查看部署選項的詳細說明。

部署作業

您可以在 GKE 或 GAE 等任何容器環境中，將應用程式部署為節點應用程式或 Docker 容器。託管示範使用以下架構：

圖片

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

帳單資訊

3D Area Explorer 解決方案使用 Google 地圖平台服務，提供身歷其境的動態體驗。部分 API 可能會產生費用。以下簡單介紹各項 API 與定價連結

Google 地圖平台 - 3D Tiles API：

故事廣告解決方案使用 3D Tiles API，透過地理空間資料提升視覺體驗。如需 3D Tiles API 的定價詳細資料，請參閱 Google 地圖平台的 3D Tiles API 定價。

Google 地圖平台 - Places API：

Places API 用於位置資料相關服務，為報導體驗提供豐富的資訊。如要瞭解 Google Places API 的相關費用，請參閱 Google 地圖平台 Places API 定價。

Google 地圖平台 - Autocomplete API：

自動完成功能可促進使用者互動。如需 Google Maps Autocomplete API 的定價詳細資料，請前往 Google 地圖平台 Places Autocomplete 定價。

CesiumJS：

CesiumJS 用於 3D 地球視覺化。雖然 CesiumJS 本身為開放原始碼，但其他功能或服務可能會產生相關費用。如需任何付費服務的相關資訊，請參閱 CesiumJS 說明文件。

請務必查看每個 API 的定價詳細資料，因為費用是依據用量決定。請注意，Google 地圖平台提供可免費使用特定數量用量的免費方案。定價具體內容可能會因要求數量和用量地區等因素而異。

如需最正確且最新的 Google 地圖平台與 CesiumJS 使用費用資訊，請務必參閱官方定價頁面。請務必遵守這些服務中列出的條款及細則，才能有效管理和瞭解任何相關費用。

結論

本文件概要說明 3D 區域探索工具的功能、元件、使用者體驗和技術相關規定。

這個 API 使用 Google 的擬真成像 3D 圖塊和 Places API，可讓您虛擬探索社區、探索搜尋點，以及瞭解當地歷史。

無論是呈現某個區域、強化探索體驗，還是宣傳數位故事，3D Area Explorer 都提供一個美觀吸睛的平台。

您可以試用試用版，然後使用管理應用程式自訂此版本，打造引人入勝且資訊豐富的 3D 體驗。