Five SDK で空間ビューアーを作ります。動作する React + TypeScript プロジェクトから始め、必要な機能を追加します。
スターターと拡張例は Five SDK 6.9.2、Three.js 0.117.1、React 18.3.1、Node 24 を使います。
動作する結果から始める
アカウント・キー不要で 公開シーンを実行 できます。同じスターターは サーバー側の Team データ にも対応します。
スターターの SDK examples で移動、モード、点選択、ラベル、画像出力を試せます。以下のガイドは同梱の実ソースを参照します。
機能を選ぶ
| 目的 | ガイド | 使用する公開 API |
|---|---|---|
| Work の読み込みと解放 | シーン読み込み | parseWork, appendTo, load, refresh, dispose |
| モード・視点・カメラの変更 | カメラとモード | changeMode, moveToPano, updateCamera, getCurrentState |
| タップ応答とラベル配置 | イベントと座標 | on, model.intersectRaycaster, project2d |
| 現在フレームの出力 | 画像キャプチャー | getSize, getPixels |
| React 内への設置 | React ライフサイクル | マウント、キャンセル、サイズ変更、破棄 |
| 公開アプリの接続 | 本番チェックリスト | アセット、サーバー認可、ブラウザーリソース |
| メソッドやイベントの検索 | API 対応表 | 固定版の型定義と AI ガイド |
Dnalogel は 空間 UI と計測、Vreo は ストーリー再生、Live は ルーム単位の同期 を追加します。それぞれ独自の依存関係とサービス要件があります。
バージョン付き参照元
メソッドの引数、イベントデータ、型はバージョン付きの定義を確認してください。