REALAPS-Data-Viewer
ガイドマニュアル

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

目次

REALAPS-Data-Viewer について .................................................... 1
REALAPS-Data-Viewer の操作 ........................................................ 2
1 REALAPS-Jpeg について.....................................................................................2
2 用意した REALAPS-Jpeg の読み込み ..................................................................2
3 ファイル情報 .........................................................................................................4
4 視線方向と画角の調整 ...........................................................................................6
5 レイアウトと画像の種類の変更 .............................................................................7[レイアウトの変更] ..................................................................................................................7[画像の種類の変更] ..................................................................................................................8

6 カラースケールのカスタマイズ .............................................................................9[カラースケールの設定] ...........................................................................................................9[照度画像の反射率設定] ...........................................................................................................9[明るさ検討画像の評価モード]...............................................................................................10

7 計測マーカーの配置 ............................................................................................. 11
8 VR の利用 ............................................................................................................12
9 スマホ（iPhone）のジャイロ機能による VR の利用 ..........................................13[用意した REALAPS-Jpeg を iPhone で読み込ませる場合] .................................................13[PC で見ている「あぴ探 AR アーカイブ」の事例を iPhone の VR で見る場合] ...................15[iPhone で「あぴ探 AR アーカイブ」にアクセスして VR で見る場合].................................17

REALAPS-Data-Viewer について
REALAPS-Data-Viewer は、REALAPS-Jpeg を閲覧するための Web アプリケーションです。REALAPS-Jpeg は、全方位の視環境データが格納された画像ファイルで、REALAPSData-Viewer 上で方向を回転しながら、各種データ（リアルアピアランス／グレア／明るさ／明るさ検討／色彩／輝度／照度）の分布や数値を確認することができます。
REALAPS-Data-Viewer には VR 機能があり、ヘッドマウントディスプレイ（VR ゴーグル）を利用することで、簡単に視環境の追体験や共有をすることができます。
REALAPS-Data-Viewer はどなたでもご使用いただけるよう、VTL 社の あぴ探 AR アー
カイブサイト に搭載しています。このサイトでは、REALAPS-Jpeg を読み込ませて閲覧できるほか、全国各地の視環境事例を多数用意していますので、手元に REALAPS-Jpeg がな
くても視環境の追体験が可能です。
また REALAPS-Data-Viewer は、WordPress のプラグイン（無料）としても用意しており、これを導入することで自社サイト上で自由にご活用いただけます。

Web 画面の例

VR モードの Web 画面（VR ゴーグルで仮想体験できます）

1

REALAPS-Data-Viewer の操作
1

REALAPS-Jpeg について
REALAPS-Jpeg は、REALAPS シリーズオリジナルの画像ファイル形式で、拡張子はJPEG 形式と同様の「.jpg」です。サムネイルや一般画像ソフトでは全方位のリアルアピアランス画像が表示されます。
ユーザー自身で REALAPS-Jpeg を用意する場合、REALAPS シリーズのプログラムから生成します。RICOH THETA の撮影データからも REALAPS-Jpeg を生成できます。
REALAPS-Jpeg ファイルが無い場合でも、VTL 社の あぴ探 AR アーカイブサイト上の事
例を用いて REALAPS-Data-Viewer を利用できます。アーカイブサイトから見たい事例を選択し、REALAPS-Data-Viewer を開いてください。

2

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

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

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

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

3

3

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

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

※

PC 上で REALAPS-Data-Viewer を見る場合、画像サイズは 1800×900 になります。

iPhone で VR 確認する場合は、後述する方法で QR コードを経由することにより、高解像度の VR 画像が見られます。

5

4

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

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

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

6

5

レイアウトと画像の種類の変更[レイアウトの変更](1) 画面のレイアウトは、右上メニューから、分割無し／左右 2 分割／上下 2 分割／4 分割から選択できます。現状選択されているレイアウトアイコンはハイライト表示されます。
画角は垂直画角が保持されます。表示する画像の種類は変更できます(2) レイアウトの境界線または交差点をドラッグすることで、レイアウトの配分を変更することができます。（垂直画角が共通になります。）もとの等配分に戻すには、レイアウ
トアイコンを再クリックしてリセットします。

7

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

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

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

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

8

6

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

グレア

明るさ

色彩（CAM）

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

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

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

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

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

ファイル情報画面

10

7

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

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

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

11

8

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

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

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

12

9

スマホ（iPhone）のジャイロ機能による VR の利用
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 のジャイロセンサーと画面が連動するようになります。

「ジャイロスコープ機能を有効化」ボタン

13（2 分割画面で、ツールバーを非表示（後述）にした例）(3) 「VR モードを表示」ボタンから VR モードを開始します。Safari のツールバーが表示されている場合は、「ぁあ」から「ツールバーを非表示」を選択し、画面を広げます。

「VR モードを表示」ボタン(4) この状態で VR ゴーグルを利用すると、頭の動きにあわせた VR 体験ができます。

14

[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 を開いて事例を確認している場合、上部メニューの「このページの QR コードを表示」アイコンをクリックすると VR 用 QR コードがポップアップ表示します。その QR コードを iPhone のカメラで読み取ります。

15

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

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

ジャイロスコープ機能を有効化

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

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

スクロールして事例を選択

リンク画像をタップ

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

QR を長押し17

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

ジャイロスコープ機能を有効化

VR モードを表示(4) VR ゴーグルに装着して VR 確認を行います。
(5) なお、QR コードの長押しを経由せずに VR 設定した場合、画像は PC の場合と同じ解像度（1800×900 pixel）で表示されます。

18