はじめに

PLATEAUのデータを利用したwebアプリを作る中で、3D Tiles の利用について悩んだのでまとめておきます

結論

PLATEAUが公開しているデータを利用してアプリに組み込める

データについての詳細は上に記したレポジトリに記載されています

ダウンロードをするだけなら、このレポジトリの 3d-tiles ディレクトリのREADMEの通りに実装すれば利用できます
（2024/05/02現在、サンプルコードには誤りがあるのでコピペでは動かないので注意）

利用可能なデータは、同README内に記載されているのでそちらをご確認ください

ただこの方法ではNext.js と Three.js を用いた場合の描画がうまくいかなかったので、それに対応したデータを利用できないか模索した

以下のパスにアクセスすることで3D Tiles データが利用できる

https://plateau.geospatial.jp/main/data/3d-tiles/${path}/tileset.json

${path}で欲しいデータを示すらしい

サンプルの中では以下の設定が用いられている
path='bldg/13100_tokyo/13101_chiyoda-ku/notexture'

これらの設定は PLATEAU が公開している 3dtiles_url.jsonに対応している

path	summary
`bldg`	`${type_en}`に対応（固定）
`13100_tokyo`	`${city_code}_${city(英語表記)}`に対応すると思われる *
`13101_chiyoda-ku`	`${ward_code}_${ward_en}`に対応
`notexture`	`notexture`に対応

* cityには city_en のカテゴリがなく、厳密には city を英語表記にした訳ではないものもある

PLATEAUが公式で用意している React と three.js のデモでは、どこかからデータををダウンロードして使っているので、それがどこのデータを利用しているのかを調べた

plateau-streaming-tutorialレポジトリのREADMEでは、3DTiles のデータを利用するためには Cesium の利用が必要だと書かれていたが、登録などもろもろ大変だったので、何か利用できる方法がないか探した

ただこの方式でデータの利用がいつまで可能であるかは不明なので、実際に実装するときには自前で用意する必要がありそうですね