300万点超の点群データをブラウザで快適に表示する - Potree LODビューアの構築

大規模な点群データ（LiDAR/LAZ）をWebブラウザで表示しようとすると、メモリ不足でクラッシュしてしまうことがあります。本記事では、Potree のLOD（Level of Detail）技術を使って、数百万点の点群をストレスなく表示する方法を紹介します。

https://3dtiles-viewer.vercel.app/potree-lod-viewer.html

使用データ

• データ名 : Utah State Capitol（ユタ州議事堂）
• 出典 : OpenTopography
• ダウンロードURL : https://object.cloud.sdsc.edu/v1/AUTH_opentopography/www/education/MatlabTopo/Utah_state_capitol.laz
• ファイルサイズ : 15MB（LAZ圧縮）
• 点数 : 3,481,512点
• 位置 : Salt Lake City, Utah, USA

課題

このデータをそのままThree.jsなどで読み込もうとすると、ブラウザがフリーズする可能性があります。

解決策：Potree

Potreeは、大規模点群データのためのWebGLベースのビューアです。**LOD（Level of Detail）**により、カメラに近い部分は詳細に、遠い部分は粗く表示することで、数十億点のデータでもスムーズに動作します。

仕組み

1. 点群をオクトリー構造 で空間分割
2. 各ノードに異なる詳細度のデータを格納
3. 視点に応じて必要なノードのみ動的に読み込み

手順

1. LAZファイルのダウンロード

2. LAZからPotree形式への変換

PotreeConverterをDockerで実行します。

出力結果 :

変換後のサイズ : 54MB

生成されるファイル構造：

3. Potreeライブラリの準備

Potree 1.8をダウンロードして配置します。

4. ビューアHTMLの作成

5. デプロイ

GitHubにpushしてVercel/GitHub Pagesで公開します。

結果

デモURL : https://3dtiles-viewer.vercel.app/potree-lod-viewer.html?data=files/utah_capitol/cloud.js

カメラをズームすると、自動的に詳細なノードが読み込まれます。

パフォーマンスのポイント

1. Point Budget : viewer.setPointBudget(3_000_000) で一度に描画する点数を制限
2. Adaptive Point Size : 距離に応じてポイントサイズを自動調整
3. EDL (Eye-Dome Lighting) : 深度感を強調して視認性向上

IIIF Presentation API 3.0 との統合

点群データにメタデータ（タイトル、出典、ライセンスなど）を付与するため、IIIF Presentation API 3.0を活用します。

IIIFマニフェストの作成

マニフェストの主要プロパティ

ビューアでのマニフェスト読み込み

使用方法

IIIFを使うメリット

1. 標準化されたメタデータ形式 - 他のIIIF対応ツールとの互換性
2. 多言語対応 - labelやsummaryで複数言語をサポート
3. ライセンス・帰属の明示 - rightsとrequiredStatementで法的情報を提供
4. データ提供者情報 - providerでデータの出典を明確化
5. 拡張性 - カスタムコンテキストでPotree固有のプロパティを追加可能

まとめ

• 大規模点群の表示にはLOD が必須
• PotreeConverter （Docker）で簡単に変換可能
• Potree 1.8 で数百万点以上もスムーズに表示
• IIIF Presentation API 3.0 でメタデータを標準化
• 追加データは ?manifest=path/to/manifest.json で読み込み可能

参考リンク

• Potree GitHub
• PotreeConverter Docker (synth3d)
• OpenTopography - 点群データ出典
• IIIF Presentation API 3.0 - メタデータ仕様
• デモ - 実際のビューア