3D エリア エクスプローラ スタートガイド

イメージ

概要

3D エリア エクスプローラ ソリューションは、まったく新しい方法で場所を発見して体験します。このソリューションでは、Google Maps Platform の Photorealistic 3D TilesPlaces API の機能を活用して、魅力的でインタラクティブな 3D 環境を作成します。

3D エリア エクスプローラは、次のような複数の目的で使用できるように設計されています。

  • エリア探索を強化する: ユーザーは、細部まで鮮明な画像で近隣地域をバーチャルに探索し、地域の特色やランドマークを把握することができます。

  • 位置情報に基づくストーリーを宣伝する: スポット(スポット)と詳細な説明を組み込めるため、特定の場所についてユーザーに説明し、情報を提供するナラティブ主導のエクスペリエンスを作成できます。

  • Google マップの 3D 機能を使用して開発を刺激する: 没入感のあるインタラクティブな地図を作成する Google の 3D マッピング データの可能性を実証します。

ご利用方法:

有効にする

主なテクノロジー

このソリューションは、次の 2 つの主要なテクノロジーを使用して構築されています。

Google Maps Platform API:

このエクスペリエンスを作成するために、Google Maps Platform のいくつかの API を使用して基本地図とデータを取得します。

  • Google Maps Photorealistic 3D Tiles: 建物や地形の高解像度 3D モデルにより、都市環境をリアルで視覚的に表現できます。
  • Places API: 探索エリア内のスポット(POI)に関する詳細情報を識別して表示し、地域の情報でユーザー エクスペリエンスを向上させます。
  • 予測入力は、ユーザーが特定の場所や関心のある地域を検索するのに役立ちます。

CesiumJS

CesiumJS は、高解像度の 3D 地球儀のレンダリングと表示を行います。これは、建物と地形の 3D メッシュモデルを提供する Google の Photorealistic 3D Tiles の読み込みと可視化を処理します。

カメラの管理: CesiumJS には、カメラの位置、向き、動きを制御するツールが用意されています。これには以下が該当します。

  • アプリの読み込み時に、指定した近隣地域にフォーカスするよう初期視点を設定します。
  • 探索のための自動軌道アニメーションなど、カメラの動的な移動の実装。
  • 地球に対するユーザー インタラクションの処理(パン、ズーム、回転など)。

Photorealistic 3D Tiles が 3D Tiles レンダラと連携する方法を学習する。

主要コンポーネント

このアプリケーションは、次の 2 つの異なるアプリに分かれています。

  • 管理アプリ
  • デモアプリ

次の図は、2 つのアプリケーションの違いと相関関係の概要を示しています。

イメージ

各アプリをさらに調査することが有益です。

管理アプリ

このアプリは、3D エクスペリエンスをカスタマイズできるユーザー フレンドリーなインターフェースを備えています。

  • 場所検索 : 統合された Google Maps Platform 予測入力検索バーを使用して、表示する地域を検索できます。場所を選択すると、そのエリアにカメラがシームレスにジャンプします。

  • カメラ: カメラの移動速度と軌道のタイプを調整して、選択した表示エクスペリエンスを作成します。

  • 場所(POI): 密度、検索半径、スポットの種類(レストラン、カフェ、ランドマークなど)を定義します。

このアプリを使用すると、エンドユーザーのエクスペリエンスをカスタマイズできます。

すべてのカスタマイズについて詳しくは、3D エリア エクスプローラのカスタマイズをご覧ください。

デモアプリ

これは、管理アプリで作成した構成を読み込む、最後のユーザー向けのアプリケーションです。この没入型の 3D 環境では、ユーザーは選択されたエリアを探索し、ハイライト表示された場所を見つけることができます。

管理アプリを使用してデザインをカスタマイズしたら、構成をダウンロードし、ソースコードからカスタム アプリケーションを実行できます。

ユーザー エクスペリエンス

イメージ

アプリケーションの主な機能は次のとおりです。

  1. ユーザーは、建物、ランドマーク、地形など、地域を 3D でインタラクティブに探索できます。
  2. ユーザーは、付近の場所(美術館、公園、レストランなど)を検索して見つけることができる。
  3. 場所を選択すると、その場所に関する詳細情報やナラティブが表示されます。

  4. デベロッパーは、設定とコントロール(管理アプリを使用している場合)で探索エクスペリエンスをカスタマイズできます。

  5. 自動回転が有効になり、選択した領域の中心を中心にカメラが自動的に回転します。

前提条件

  1. Google Maps API キー: 次の API を有効にした有効な API キーが必要です。

  2. ウェブサーバー: 次のいずれかからアプリケーションを提供できます。

    • ローカル ウェブサーバー(Node.js、http-server などを使用)
    • 静的ウェブ ホスティング サービス(アプリケーションに Dockerfile が含まれる)

デプロイ オプションの詳細については、GitHub プロジェクトの README セクションをご覧ください。

デプロイ

このアプリは、GKEGAE などのコンテナ環境にノード アプリケーションまたは Docker コンテナとしてデプロイできます。ホストされるデモでは、次のアーキテクチャを使用します。

イメージ

  • このアーキテクチャでは、コードは GitHub プロジェクトにあります。
  • Cloud Build は main への push でコードを取得し、ビルド オペレーションをトリガーします。
  • ビルドの一環として、API キーを挿入してイメージを作成します。このイメージは Artifact Registry に保存されます。
  • 最後に、Artifact Registry から Cloud Run に最新の安定版イメージをデプロイします。
  • また、ヘルスチェックとモニタリングを実行して、デプロイされたアプリの状態を確認します。

お支払い情報

3D エリア エクスプローラ ソリューションでは、Google Maps Platform サービスを使用して、臨場感のある動的なエクスペリエンスを提供します。API によっては料金が発生する場合があります。こちらは API の概要と料金へのリンクです

Google Maps Platform - 3D Tiles API:

Storytelling ソリューションは、3D Tiles API を利用して地理空間データによる視覚的エクスペリエンスを向上させます。3D Tiles API の料金の詳細については、Google Maps Platform の 3D Tiles API の料金をご覧ください。

Google Maps Platform - Places API:

位置情報に基づくデータには Places API が採用され、ストーリーテリング エクスペリエンスに豊富な情報が追加されます。Google Places API に関連する料金については、Google Maps Platform の Places API の料金をご覧ください。

Google Maps Platform - Autocomplete API:

予測入力機能により、ユーザー操作が強化されます。Google Maps Autocomplete API の料金について詳しくは、Google Maps Platform の Places Autocomplete の料金をご覧ください。

CesiumJS:

CesiumJS は地球の 3D 可視化に使用されます。CesiumJS 自体はオープンソースですが、追加の機能やサービスごとに費用が発生する場合があります。プレミアム サービスについては、CesiumJS のドキュメントを参照してください。

料金は使用量に基づいて個別に決まるため、各 API の料金の詳細を確認することが重要です。Google Maps Platform では、一定量の使用量に対する無料枠が用意されています。料金の詳細は、リクエスト数や使用地域などの要因によって変わる場合があります。

Google Maps Platform と CesiumJS の使用料金に関する正確かつ最新の情報については、公式料金ページをご覧ください。これらのサービスに記載されている利用規約を遵守して、関連する費用を効果的に管理し、把握します。

おわりに

このドキュメントでは、3D エリア エクスプローラの機能、コンポーネント、ユーザー エクスペリエンス、技術要件について概説します。

Google の Photorealistic 3D Tiles と Places API を活用することで、近隣を仮想的に探索し、スポットを発見し、地域の歴史を学ぶことができます。

3D エリア エクスプローラは、地域の紹介、探索の強化、デジタル ストーリーテリングのプロモーションなど、視覚的に魅力的なプラットフォームを提供します。

デモを試し、管理アプリを使用してカスタマイズすることで、魅力的で有益な 3D エクスペリエンスを構築できます。