360度画像ビューアーとは？

360度の正距円筒図法のパノラマ画像をインタラクティブに閲覧できるビューアーです。パノラマ写真をアップロードして、クリック＆ドラッグで360度を見渡し、スクロールでズームし、球体全体の環境を体感できます。

ビューアは Three.js で作られています。エクイレクタングラー形式の JPEG/PNG を球体の内側に貼り付け、カメラを球の中心に置きます。ドラッグで見回し、ホイールまたはピンチで視野角を調整、オートローテート(遅い / 標準 / 速いの速度付き)で両手を離した状態でも一周でき、現在の角度を PNG または JPG で書き出せます。

使い方

1. デバイスから正距円筒図法のパノラマ画像（JPEGまたはPNG）をアップロードするか、ビルトインのサンプルパノラマを使用します。
2. クリック＆ドラッグで360度のシーンを見回します。スクロールやピンチ操作でズームイン・アウトができます。
3. 自動回転トグルをオンにするとハンズフリーで巡回できます。現在のビューをスクリーンショットとしてダウンロードすることもできます。

使用するタイミング

• 内見の予約を入れる前に、不動産物件の 360° 写真を確認したいとき。
• ドローンや一眼で撮ったパノラマを Google マップや Facebook に投稿する前に下見する。
• 美術館、会場、撮影スタジオのバーチャルツアーをオフラインのレビュアーと共有する。

結果

不動産カメラマンがリビングルームの360度パノラマをアップロードし、ビューアーリンクを共有することで、潜在的な購入者がインタラクティブにそのスペースを体験できるようにします。

よくある質問

エクイレクタングラー画像とは何で、自分の画像が該当するかはどう判断しますか?

エクイレクタングラー画像はアスペクト比 2:1(4096×2048 がよくある)で、上下が引き伸ばされ、上端が空、下端が地面を表します。多くの 360° カメラやパノラマアプリは標準でこの形式に書き出します。

画像は読み込めるのに、中央が歪んだり継ぎ目が見えたりします。なぜ?

歪みはエクイレクタングラー投影ではないことが多いサインです(円筒投影やリトルプラネット出力など)。PTGui や Hugin で再投影してください。継ぎ目は撮影時の重なり不足で生じるので、元素材から再ステッチが必要です。

ステレオ 3D や VR フォーマットのパノラマは見られますか?

見られません。ビューアはモノラル 360° の球面を描画するため、上下並びや左右並びの立体パノラマは二重に見えます。VR で見るには、両眼を分けて再生できるプレーヤー(SKYBOX や DeoVR など)とヘッドセットが必要です。

オートローテート中に UI を隠してきれいなデモを見せる方法はありますか?

あります。ツールバーの全画面ボタンを押すとパノラマが画面いっぱいに広がり、コントロールは下端に残るので自動回転・ズーム・スクリーンショット・リセットがワンクリックで使えます。さらに自動回転にはボタンの隣に「遅い・標準・速い」の速度プリセットがあり、落ち着いたプレゼン向けのドリフトから素早いプレビュー回転まで選べます。

パノラマはどこかにアップロードされますか?

いいえ。ファイルは Three.js のテクスチャとしてそのままメモリに読み込まれ、ページ外には出ません。スクリーンショットもローカルでキャンバスのピクセルを読み取って生成しています。

関連ツール