REALAPS Data Viewer ガイドマニュアル

2023年10月18日
株式会社ビジュアル・テクノロジー研究所 (略称 VTL)

REALAPS Data Viewerについて

REALAPS Data Viewerは、REALAPS Jpeg を閲覧するための Web アプリケーションです。REALAPS Jpeg は 、全方位 の視環境 データが格納された画像ファイルで 、REALAPS Data Viewer 上で方向を回転しながら、各種データ(リアルアピアランス/ グレア/明るさ/明るさ検討/色彩/輝度/照度 の分布 や数値 を確認することができます 。
REALAPS Data Viewerには VR 機能があり、ヘッドマウントディスプレイVR ゴーグルを利用 することで 、簡単に 視環境の 追体験 や共有 をすることができます 。

REALAPS Data Viewerはどなたでもご 使用 いただけるよう、 VTL 社の あぴ探 AR アーカイブサイト に 搭載しています。このサイトでは、 REALAPS Jpeg を読み込ませて閲覧できるほか、全国各地の視環境事例 を 多数用意していますので、手元に REALAPS Jpeg がなくても視環境の 追体験が可能です。またREALAPS Data Viewerは、WordPress のプラグイン(無料)としても用意しており、こ れ を導入することで自社 サイト上で自由にご活用いただけます。

Web画面の例
VRモードのWeb画面( VR ゴーグルで仮想体験できます)

REALAPS Data Viewer の操作

① REALAPS Jpeg について

REALAPS Jpeg は、REALAPSシリーズオリジナルの画像ファイル形式で、拡張子はJPEG形式と同様の「 jpg 」です。サムネイルや一般画像ソフトでは 全方位のリアルアピアランス画像が表示されます。

ユーザー自身でREALAPS Jpegを用意する場合、REALAPSシリーズのプログラムから生成します。RICOH THETAの撮影データからもREALAPS Jpeg を生成できます 。REALAPS Jpeg ファイルが無い場合でも、VTL 社のあぴ探 AR アーカイブサイト上の事例を用いてREALAPS Data Viewerを利用できます。アーカイブサイトから見たい事例を選択し、REALAPS Data Viewer を開いてください。

② 用意したREALAPS Jpeg の読み込み

(1) VTL 社の あぴ探 AR アーカイブサイト > REALAPS Data Viewer 、またはREALAPS Data Viewer が導入されたサイトにアクセス します。
(2) REALAPS Data Viewerの Web 画面に REALAPS Jpegファイルをドラッグ&ドロップします。または 、画面をクリックすると読み込みダイアログが開きますのでREALAPS Jpegファイルを指定します。

【REALAPS Jpeg読み込みページ】はこちらから

(3) 新しいタブにREALAPS Jpeg の内容が表示されます。
デフォルトでは 4 分割の画面に、リアルアピアランス/グレア/明るさ検討/色彩の各画像が表示されます 。レイアウトや画像の種類は後で変更することができます。

(4) 既にデータが表示された画面に別の REALAPS Jpegをドラッグ&ドロップした場合は、以前のデータは消えて新規データに更新されます。右上メニュー > 「≡」 > 「 画像のロード 」でも同様の操作になります。

(5) Webブラウザで画面を閉じるとREALAPS Data Viewerは終了します。

③ ファイル情報

(1) あぴ探アーカイブの事例などで 撮影場所の説明テキストが埋め込まれている場合、画面左下にポップアップが表示されます。「 × 」をクリックするか、左下の「情報」ボタンをクリックすると非表示になります。「情報」ボタンの再クリックで表示・非表示の切り替えができます。
(2) 画面内のマップピンアイコンをクリックすると、「あぴ探AR マップ」にリンクし、地図上で場所を確認することができます。

地図上のピンをクリックすると同様の紹介文が表示されます

(3) 画面 右上 の メニュー > 「≡」 「ファイル情報 を 表示」をクリックすると、データの概要が表示され ます。「 × 」で 画面が閉じます 。

※PC 上で REALAPS Data Viewer を見る場合、 画像サイズは 1800×900 になります。iPhoneで VR確認する場合は、後述する方法で QRコードを経由することにより、高解像度のVR 画像が見られます。

④ 視線方向と画角の調整

(1) 視線の方向を変えるには、 いずれかの画像 上で マウス ドラッグします。 キーボードの矢印キーでも上下左右 の 回転 移動が できます。
(2) 画角を変えるには、画像 上でマウスホイールを操作します。ホイールを上に動かすと表示が拡大し、画角は小さくなります。ホイールを下に動かすと表示が縮小し、画角は大きくなります。

(3) 画面右下に、垂直画角と視線方向の情報が表示されます。初期状態では、垂直画角:90 度 、方位角・仰角: 0 度です。この数値を直接編集して視界を変更できます。

(4) どの画像上で操作しても、すべての画像で視界が連動します。画面レイアウト(後述)を変更した場合も鉛直画角と視線方向は保持されます。

⑤ レイアウトと画像の種類の変更

[レイアウトの変更]

(1) 画面のレイアウトは、右上メニューから、分割無し/左右 2 分割/上下 2 分割/4 分割から選択できます。現状選択されているレイアウトアイコンはハイライト表示され ます。画角は垂直画角が保持されます。表示する画像の種類は変更できます。

(2) レイアウトの境界線または交差点をドラッグすることで、レイアウトの配分を変更することができます。(垂直 画角が共通になります。)もとの等配分に戻すには、レイアウトアイコンを再クリックしてリセットします。

[画像の種類の変更]

(1) 表示する 画像の種類は、 REALAPS Jpeg に搭載されているデータに応じて、下記の種類から選ぶことができます。 各画像のタイトルのプルダウンメニューから変更できます 。リアルアピアランスと測光色については、オーバーフロー画像 からオーバーフロー部分を確認できますので、必要に応じてご活用ください 。

(2) 画像タイトル横の「?」をクリックすると、各 画像についての説明がポップアップ 表示されます。「もっと詳しく」で、あぴ探サイト内の詳細説明にリンクします。「?」を再クリックするとポップアップが非表示になります。

(3) 画像 タイトルは、右上メニューの「 画像セレクターを表示 」ボタンで表示・非表示を切り替えられます 。クリックしてアイコンをグレーアウトさせると、 すべての画像のタイトルが 非表示になります。

「画像セレクターを表示」ボタン

⑥ カラー スケールのカスタマイズ

[カラースケールの設定]

(1) 各画像のカラースケールは必要に応じてカスタマイズできます。スケール画面の 歯車ボタンをクリックすると設定画面が表示され、最小値・最大値などを 編集してカラーと対応させ ることができます 。歯車ボタンを再クリックすると設定画面が閉じます 。

左からグレア・明るさ・色彩(CAM)・ 輝度

(2) スケール画面は、右上メニュー の「 スケールを表示」ボタンで表示・非表示を切り替えられます。ボタンをグレーアウトすると、すべての画像のスケールが非表示になります。

「スケールを表示」ボタン

[照度画像の反射率設定]

照度

照度画像では、スケール 設定画面で指定する反射率を用いて照度を算出します。反射率は、マンセル N 値あるいは数値により指定します。最小値・最大値の編集はほかの画像 の場合 と同様です。

[明るさ検討画像の評価モード]

明るさ検討

(1) 明るさ検討画像では、プリセットとして「オフィス」「 ミュージアム 」 「リビング」 の 3 つの 評価 モード を用意しています。 空間の目的にあわせて選択してください。「自由設定」では色 区分の境界値を自由に設定できます。

(2) また 、それぞれの評価 モード に応じて「明るさ感推定値」が表示されます。全方位画像のうち、水平視野 360° 、垂直視野 ± 40°(計 80° バンド に対する算定値になります。「自由設定」では推定値は表示されません。

同じ空間での明るさ感推定値の比較

(3) 「 ファイル情報」(前出)では、全ての評価モードの明るさ感推定値が一覧で確認できます。

計測マーカーの配置

(1) 画像上でクリックするとその位置に計測マーカーが配置され、各画像に応じた計測値が表示されます。どの画像上で配置しても、マーカーの位置 は 連動します。


(2) 配置済みのマーカーを 削除するには、マーカーを 再クリックします。

(3) マーカーは、右上メニューの「マーカー を表示」ボタンで表示・非表示を切り替えられます。ボタンをグレーアウトさせると、すべての画像のマーカーが非表示になります 。非表示の状態でも位置の情報は保持 され、 ボタンの再クリックで再表示されます。「マーカーを表示」ボタン

「マーカーを表示」ボタン

(4) 配置 した マーカーを すべて 削除するには、 右上 メニュー > 「≡」 >「 すべてのマーカーを 除去」をクリックします。

⑧ VR の利用

(1) 右上メニューの「 VR モード を表示」ボタンをクリックすると、まずディスプレイ最大輝度についての注意事項が表示されます。問題なければ「開始」をクリックしてください。

(2) 暗転後、10 秒のフェードイン時間を経て、全画面表示でVR 用の画面が表示されます。VRモードでも、マウスドラッグ、矢印キー、マウスホイールで方向や画角の調整ができます。

(3) VR モード画面を映したスマホをVR ゴーグルにセットし装着することで、視環境の追体験や共有が可能になります。PCとスマホをミラーリングさせると、操作や情報共有がしやすくなります。

⑨ スマホ i Phoneのジャイロ機能によるV Rの利用

iPhone のジャイロ機能とVR ゴーグルを併用することで、頭の動きにあわせたVR 体験ができます。用意した REALAPS Jpeg を iPhoneで読み込ませるか、または iPhone で「あぴ探ARアーカイブ」サイトの事例を使用します。いずれもWebブラウザにはSafariアプリを使用します。

[用意したREALAPS-Jpeg をiPhoneで読み込ませる場合]

(1) あらかじめ iPhone の 設定アプリから Safari の「ポップアップブロック」をオフにしておきます。これにより REALAPS Data Viewer の読み込み画面を利用 できるようになります 。
読み込み画面は、VTL社のあぴ探ARアーカイブサイト > REALAPS Data Viewer に用意してあります。

(2) 読み込み画面をタップして 、用意した REALAPS Jpegを選択します。 画面にREALAPS Jpeg が表示されたら 、 上部メニューの「ジャイロスコープ機能を有効化」ボタンをタッチすると、iPhoneのジャイロセンサーと画面が連動するようになります。

「ジャイロスコープ機能を有効化」ボタン
(2 分割画面で、ツールバーを非表示(後述)にした例)

(3) 「 VR モードを表示」ボタンから VR モードを開始します 。Safari のツールバーが表示されている場合は、「ぁあ」から「ツールバーを非表示」を選択し 、画面を広げます。

「VR モードを表示」ボタン

(4) この状態でVR ゴーグルを利用すると、頭の動きにあわせたVR体験ができます。

[PCで見ている「あぴ探ARアーカイブ」の事例をiPhoneのVRで見る場合]

PC上のQRコードを iPhoneで読み取ります。QRコードの表示方法には下記の2つがあります。

(1) PCで「あぴ探 ARアーカイブ」のページをスクロールして事例を選択すると、まず VR用QRコードの貼られた画像が表示されます。そのQR コードをiPhoneのカメラで読み取ります。なおこの画像をクリックすると 、該当 事例がREALAPS Data Viewerで開きます。 

PCブラウザ
iPhoneのカメラでQRコードを読み取り 、リンク先に移動します

(2) すでに REALAPS Data Viewer を開いて事例を確認している場合 、上部メニューの「このページの Q R コードを表示」アイコンをクリックすると VR 用 QR コードがポップアップ表示します。その QRコードを iPhoneのカメラで読み取ります。

表示されるQ Rコードを iPhoneで読み取ります

(3) QRコードから iPhone 上でリンク先へ移動すると、この事例が Safari の REALAPS Data Viewerで表示されます。このとき、画像は高解像度( 5376× 2688 pixel)で設定されます 。

(4) 前述( 13〜14 ページ)の手順でVR のための画面を設定します。

ジャイロスコープ機能を有効化
VRモードを表示

(5) VR ゴーグル に装着して VR 確認を行います。

[iPhoneで「あぴ探ARアーカイブ」にアクセスしてVRで見る場合]

(1) iPhoneのSafariで「あぴ探 ARアーカイブ」サイトに直接アクセスし 、スクロールしてV Rで確認したい事例を選びます。まずリンク画像が開き、これをタップすると 該当事例が REALAPS Data Viewerで表示されます。(リンク画像には QR コードが付いていますが、これは利用できません)

①スクロールして事例を選択 → ②リンク画像をタップ → ③REALAPS Data Viewer 画面

(2) 上部メニューの「 QRコードを表示」アイコンをクリックすると VR 用 QR コードがポップアップ表示します。QRコードを長押しして表示されるメニューから「(” apitan-ar.net ”)開く」を選択すると、画像が高解像度( 5376 × 2688 pixel )で 再設定されます。

(3) 前述( 13〜14 ページ)の手順でVRのための画面を設定します。

ジャイロスコープ機能を有効化
VRモードを表示

(4) VR ゴーグル に装着して VR 確認を行います。

(5) なお、QRコードの長押しを経由せずに VR 設定した場合、画像はPCの場合と同じ解像度( 1800 × 900 pixel )で表示されます。