🗼

【Unity】ARでプラレールとPLATEAUの街をミックスさせる方法

2021/05/10に公開1

話題のPLATEAUですが、ARでプラレールとミックスしてみたところ、300以上のいいねを頂きました。

https://twitter.com/jugemjugemjugem/status/1390917630547030018?s=20

ということで、作り方を解説します。

モデルを置くだけなんですが、UnityにPLATEAUのデータをインポートして動かそうとすると重いので、軽量にします。

軽量にする方法はすでに書いている方がいらっしゃいましたが、有償のソフトウェアが必要だったので、無償のソフトウェアだけで軽量化する方法を紹介します。(Macのみです)

完成コードはこちらにあります。
(PLATEAUのデータはコミットしていいのか分からなかったので、除いてあります)

https://github.com/TokyoYoshida/ARCity

1. PLATEAUのサイトからデータをダウンロードする

PLATEAUのサイトからデータをダウンロードします。
こちらのページから、例えば「533935」(東京タワーを含んでいて結構派手です)のデータをダウンロードしてみてください。

https://www.geospatial.jp/ckan/dataset/plateau-tokyo23ku-fbx-2020

2. (オプション)Unityで表示してみる

重いけど早く表示してみたい方は、Unityで表示してみましょう。
ダウンロードしたファイルを解凍して、LOD2\53393589フォルダにある、53393589_bldg_6677.fbx53393589_bldg_6677.fbmをUnityのAssetにドラッグ・アンド・ドロップします。インポートされたら、シーンに配置したら見ることができます。

ただ、ものすごく重いのと、原点の位置がズレているのがわかると思います。これを解消していきましょう。

3. テクスチャーを軽くする

テクスチャー画像はtif形式になっているので、jpegに変換してしまいましょう。Macのプレビューツールで一括変換できます。

プレビューを起動するとファイルが選択できるようになるので、53393589_bldg_6677.fbmフォルダ以下のtifファイルをすべて選択します。

画像をすべて読みこんだら、編集 > すべてを選択ですべての画像 を選択し、
ファイル > 選択中のイメージを書き出す を選択し、出てきたダイアログの「オプション」を押すとファイルの形式が選べるので、JPEGを選びます。品質はお好みですが、目一杯品質を下げると、112MBあったデータを2.71MBまで小さくすることができます。

なお、プレビュー変換したJPEGファイルは拡張子が.jpegになっていますが、これを.jpgに変更しておきます。(sedやxargsを使うと素早く変換することができます)

4. モデルが参照しているテクスチャーファイルの拡張子を変更する

3Dモデルファイル(.fbx)の中身を書き換え、.tifファイルを参照しているものを.jpgに変換します。

バイナリエディタで開きます。エディタはなんでもいいですが、私はHex Friendというのを使いました。

バイナリエディタで開いたら、.tif.jpgに置換します。
これでテクスチャーファイルの拡張子の変更ができました。

5. モデルを統合する

PLATEAUのデータは複数のモデルで構成されていますが、これを統合することでモデルを軽量にすることができます。

モデルを統合する方法は、ネットで検索すると2つ見つかりました。
方法はそれぞれの記事をご覧ください。

  1. Blenderを使う方法
    https://sakaf.net/posts/plateau-merge/

  2. Unityを使う方法
    https://zenn.dev/fumo/articles/7cad6c25dd99b7

どちらの方法でも良いのですが、私はBlenderを使う方法を使っています。

6. モデルの位置を修正する

PLATEAUのモデルの位置は、23区全体を配置することを想定しているようです。
このため、東京タワーのある地区のデータは中心からかなり外れたところにあります。
ということで、下の記事を参考にモデルの位置を修正します。

https://howtousearchicad.com/function/import-export/8834/

データ「533935」の場合、だいたいXが-82、Zが-380ぐらいするとちょうど原点になります。

また、注意点としてBlenderのオブジェクトモードではなく、編集モードで位置を調整しないと、正しく原点に配置されません。

7. Unityにインポートする

仕上がったモデルをUnityにインポートしてみます。
ダウンロードしたファイルを解凍して、53393589_bldg_6677.fbx53393589_bldg_6677.fbmをUnityのAssetにドラッグ・アンド・ドロップします。インポートされたら、シーンに配置したら見ることができます。

軽量になったモデルはサクサク動くようになります。

8. AR化する

AR化は、AR Foundationを使いました。

AR Foundationの導入はこちらの記事をご覧ください。

https://note.com/npaka/n/nc24ba42aa710

平面上のタップしたところにモデルを置く方法はこちらにあります。

https://nn-hokuson.hatenablog.com/entry/2020/07/31/152233

なお、モデルは1/10にして配置しました。縮尺は見ての通り間違っていますが、東京タワーが適度な高さになり、プラレールとうまく馴染んでくれます。

プラレールの比率に合わせようとすると、東京タワーは4メートルぐらい必要になるので、普通の家の屋内では表示できないかもしれません😉

最後に

iOSを使ったARやML、音声処理などの作品やサンプル、技術情報を発信しています。

作品ができたらTwitterで発信していきますのでフォローをお願いします🙏

Twitter
https://twitter.com/jugemjugemjugem

Qiitaは、iOS開発、とくにARや機械学習、グラフィックス処理、音声処理について発信しています。
https://qiita.com/TokyoYoshida

Noteでは、連載記事を書いています。
https://note.com/tokyoyoshida

Zennは機械学習が多めです。
https://zenn.dev/tokyoyoshida

Discussion

栗山 和樹栗山 和樹

良記事ありがとうございます!PLATEAUの取り込みは毎回大変なので、情報を頂けて助かりました!