vicc blog

株式会社ヴィックの技術ブログです。

Cesium+PLATEAU+Unreal EngineでRhinoモデルを地球上に配置する方法

viccのキョウです。みなさんはGoogle Earthを使った経験があると思います。今はインターネットの普及で地球上のあらゆる場所を見ることができる素晴らしい時代です。実際に建築を設計する時に、仮想の敷地に建築の3Dモデルを自由に配置し、周りの環境シミュレーションすることが可能です。

Cesium ionというプラットフォームで3Dモデルの地理情報を統合し、さらにPLATEAUから日本の精度高い3D都市モデルを加えて幅広く利用できます。建築設計でよく使うRhinoモデルと合わせれば、全体の情報量と視認性が上がって各条件の検討がしやすくなります。これからRhinoモデル、日本の都市モデルPLATEAU、Cesiumプラットフォームの活用方法を紹介しようと思います。

Cesium for Unreal

Rhinoモデルを配置する方法

①Rhinoceros + Cesium + PLATEAU

cesium.com www.mlit.go.jp

Cesiumは強力な3D 地理空間のオープンプラットフォームです。ブラウザ上で3Dモデルのアップロードはもちろん、さらにJavaScriptのライブラリを使えばデータ可視化の形状追加、シミュレーション分析ツール、UIウィジェットなど、たくさんのカスタマイズ機能があります。ただし、Google Earthより地形の解像度が低い部分もあり、日本地域の都市モデルの精度があまり良くないので、PLATEAUと一緒に利用することをおすすめします。PLATEAUは国土交通省が主導する3D都市モデルのプロジェクトで、日本の主要都市のモデルを誰でも自由に利用できるのが最大の特徴です。

②Rhinoceros + PLATEAU + Cesium for Unreal

www.unrealengine.com

方法①の延長線としてUnreal Engine上でCesiumのアセットとPLATEAUのモデルを活用します。Unreal EngineはGoogle EarthやCesiumよりも大量の複雑な建築モデルを統合することができます。Unreal Engineのきれいな表現はもちろん、さらに静止画、動画、XR、環境シミュレーションなど、様々なコンテンツに対応可能になります。現在Cesium for Unreal はUE4.26から対応可能です。今回のテストプロジェクトはUE5.0.3を使用します。

今回使用したソフトウェア、コンテンツ:


① Rhinoceros + Cesium + PLATEAU

1-1. Rhinocerosから地理情報を設定してKMZデータを出力

最初はRhinoの3Dモデルに地理座標を設定するため、まずGoogle Earth Proで配置したい場所を確認します。Google Earth Proを起動して「ツール」のタブから「オプション」を開きます。

Google Earth Proの「オプション」タブ

3Dビューのページで緯度/経度表示を「度(10進法)」に設定し適用します。

緯度/経度表示のオプション

配置したい場所で新規の目印を追加し表示した緯度、経度を記録します。

配置したい緯度、経度を記録

Rhinoの「EarthAnchorPoint」コマンドで記録した場所の緯度、経度、北方向などを設定します。3DモデルをGoogle Earthのファイル形式(.kmz)を出力します。

EarthAnchorPointで設定したRhinoモデル

一般的に地理空間に配置するモデルは3d tileというデータをよく使われています。Rhinoの出力可能な3d tile形式は.gltf .glbなどありますが、KMZで出力したらGoogle Earth Pro上にも表示できます。しかしGoogle Earth Proにはモデルの頂点数制限があるため、複雑なモデルはそのまま表示できない可能性があります。

Google Earth Pro上に表示するRhinoモデル


1-2. 3DモデルをCesium ionに配置 (.KMZ)
Cesiumの公式サイトからサインインしてCesium ionのページを開きます。もし方法②のCesium for Unrealを使う場合はEpic Gamesアカウントとの連携が必要です。

Cesium ionのログイン画面

「My Assets」 のタブから「Add Data」ボタンでKMZモデルをアップロードできます。「What kind of data is this?」のオプションはKML/COLLADA(tile as 3D Tiles)を選択し、「KML/COLLADA Options」のReference terrainはCesium World Terrainを選択してアップロードします。

アセットのアップロード

アップロードが完成したらCesiumからGoogle Earthのようにweb上表示できます。しかしCesiumデフォルト表示は3D都市モデルが入っていませんので、ここで左側のJavaScript codeのスペースからOpenStreetMapの3D OSM Buildingsのモデルを追加します。

//OSM Buildingsの都市モデルを追加する
const osmBuildingsTileset = await Cesium.createOsmBuildingsAsync();
viewer.scene.primitives.add(osmBuildingsTileset);

これでRhinoモデルと3D OSM Buildingsのモデルと両方をCesium上に配置しました。

Rhinoモデルを配置した画面


1-3. Cesium ion + PLATEAUの使用方法

OSM Buildingsの都市モデルは簡単に使用できるけど、しかし精度があまり高くないです。ここからPLATEAUの都市モデルを利用します。

www.geospatial.jp

PLATEAUから提供しているデータはたくさんの形式がありますが、地理情報が記述された3D Tiles形式を使いたいと思います。ダウンロードしたzipデータはそのままKMZと同じオプションでCesium ionにアップロード可能です。 今回は江東区建物(テクスチャあり)のモデルをアップロードします。

江東区モデルの表示

3D Tiles形式のモデルなので、Cesium ionはPLATEAU VIEW Appと同じくモデルに記述された情報を表示できます。

PLATEAUのモデルをクリックすると情報を表示する

もし複数のモデルを表示したい場合はアップロードしたモデルのIDを記録して、JavaScriptで二つのモデルを追加し同時に表示できます。

「My Assets」のモデルID

//複数のアセットを表示する
try {
  const tileset = await Cesium.Cesium3DTileset.fromIonAssetId(#######);
  const tileset2 = viewer.scene.primitives.add(
  await Cesium.Cesium3DTileset.fromIonAssetId(#######)
);

これでRhinoモデルとPLATEAUモデルを合わせて配置することが完成です。画面上部の「Share」ボタンからリンクを共有すれば、ブラウザを経由して配置されたシーンをアクセスできます。複数人が一緒にシーンをアクセスしてモデル情報をチェックすることも可能です。

Rhino+PLATEAUモデルを配置した画面


② Rhinoceros + PLATEAU + Cesium for Unreal

2-1 .Cesium for Unrealのプロジェクト作成

一般的にPLATEAUのモデルを直接にUnrealEngineに使う場合はいくつか方法があります。

  • FBX形式でインポートする。
  • CityGMLをdatasmithの形式に変換して使う。
  • PLATEAU SDK for Unrealを導入しダイレクトでモデルをインポートする。

今回はCesium for Unrealを使うなので、Cesium ionにアップロードしたアセットはそのままリンクされて利用できます。

まずは使っているUnreal EngineバージョンにCesium for Unrealをインストールします。今回はUE 5.0.3バージョンにインストールしました。次はCesium for Unreal Samplesのプロジェクトを作成すればCesiumの機能一式が揃えてすぐに利用できます。Cesium for Unreal頻繫にアップデートがあるので、常にバージョンを確認ください。

Cesium for Unreal


2-2 .Cesium for Unrealの設定

Cesium for Unreal Samplesのプロジェクトを開くと「Cesium」のタブを選択して「Connect to Cesium ion」のボタンをクリックします。ブラウザからCesiumをログインして、Cesium for Unreal がアセットにアクセスすることを許可する画面が表示されます。「Allow」を選択し、Unreal Engine に戻って続行します。

Cesium for Unreal Samplesのプロジェクト画面

Cesium for Unrealのパネル

次に、UE5のプロジェクトをCesium ionのアセットにアクセスするため、トークンを作成することが必要です。Cesiumパネルの「Token」をクリックし、表示したオプションから「Create a new token」を選択し、「Create New Project Default Token」ボタンを押します。これでCesium ion Assetのパネルにアップロードしたモデルを同期できて、モデルを追加する準備が整いました。

Cesiumのtokenの設定

Cesium ionのモデルと同期する


2-3 .Cesiumプロジェクトの設定

Cesium for Unreal Samplesを使う場合はデフォルトマップ「01_CesiumWorld」には既にいろんなアセットを追加されたが、今回はモデルを配置する必要な機能だけを説明します。

「CesiumGeoreference」のアクタを選択し、配置したい緯度、経度、高さはこのアクターで変更できます。最初記録した緯度、経度を入力してRhinoモデルの位置に移動できます。配置する場所とUE5の原点位置を合わせるため、入力した位置で「Place Georeference Origin Here」のボタンを押します。「World Outliner」のアセットは自動的に新しい原点位置に移動します。

プロジェクトの原点位置の設定

「Cesium ion Assets」のパネルからCesiumにアップロードしたモデルを選択し、Add to Levelのボタンを押して追加します。方法①使った建築モデル、PLATEAU モデル、Cesium OSM Buildingsなど必要なモデルをレベルに追加できます。

Cesium ionからモデルを追加できる
これでCesiumプロジェクトの設定が完成しました。

CesiumからRhinoとPLATEAUモデルをインポートした

最後にUE5のDatasmith pluginを使えば複雑な建築モデルはRhinoの3dmデータを直接にインポートできます。方法①のRhinoモデルの「EarthAnchorPoint」と「CesiumGeoreference」設定した緯度、経度が同じであれば位置は自動的に合わせます。しかし、RhinoモデルとCesiumのモデルと高さが違う状況があるので実際に高さを確認しながら調整します。

Rhinoモデルを直接にUE5にインポートすると高さが違う状況


まとめ

方法①のCesiumプラットフォームで気軽にモデルの形状と周り環境の関係を可視化して確認できます。設定したシーンのリンク先をシェアすればスマートフォン、タブレットでも気軽にモデルの情報を確認できます。方法②のUE5の環境でより良い表現ができて、さらにXRのコンテンツに出力することもできます。総合的にCesium + PLATEAUの情報を統合して建築本体を確認するだけではなく、周りの地形や構造物など全体の空間を把握できます。うまく運用すれば、建築設計、都市開発、防災、メタバース、デジタルツインなど分かりやすく計画を立てると思います。




参考資料:

Rhino: Google Earthに自分で作成した3Dモデルを表示させる https://www.applicraft.com/tips/rhinoceros/google_earth/

Project PLATEAUで公開された3D都市モデルをCesiumで表示してみる https://ufirst.jp/memo/2021/04/post-2864/

Cesium for Unreal Quickstart https://cesium.com/learn/unreal/unreal-quickstart/

CesiumGlobeAnchorComponent https://cesium.com/learn/unreal/unreal-placing-objects/