3D 區域探索入門指南

圖片

總覽

3D 區域探索工具解決方案讓您以全新方式探索地點，並探索位置。這項解決方案運用 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 地圖平台自動完成搜尋列，尋找要展示的區域。選取位置後，攝影機就會流暢地飛往該區域。

  • 攝影機：調整攝影機移動速度和軌道類型，建立所選觀看體驗。

  • 地點 (POI)：定義密度、搜尋半徑以及要加入的搜尋點類型 (例如餐廳、咖啡廳、地標)。

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

請參閱所有自訂 3D 區域探索工具自訂項目的詳細說明。

試用版應用程式

這是最終向使用者顯示的應用程式，會載入您在管理應用程式中建立的設定。在這個沉浸式的 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 區域探索工具解決方案使用 Google 地圖平台服務，提供身歷其境的動態體驗。部分 API 可能會產生費用。以下簡要說明 API 和定價連結

Google 地圖平台 - 3D Tiles API：

述說故事解決方案運用 3D Tiles API，透過地理空間資料提升視覺體驗。如需 3D 圖塊 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 區域探索工具的功能、元件、使用者體驗和技術需求。

它利用 Google 的擬真成像 3D 圖塊和 Places API，讓您能以虛擬方式探索社區、探索搜尋點，以及瞭解當地歷史。

不論是展示區域、強化探索功能，還是宣傳數位敘事，3D 區域探索工具都能提供令人驚豔的視覺效果。

試用並透過 Admin 應用程式加以自訂，打造引人入勝且富含資訊的 3D 體驗。