Loading [MathJax]/extensions/Safe.js
MENU

Google VR Viewでホットスポットまわりのコードをいじってみる2


ホットスポットを表示する場合のPitchの範囲と透過度の設定部分をさわってみます。

現状だとPitch範囲が25°くらいなので、例えば高層ビルの上層にホットスポットを置いても

視点をアップするとホットスポットはフェードアウトして見えなくなります。

また、ホットスポットをお顔の上に置くと透明度はあるのですが、透過度が低いので少々邪魔に感じてしまいます。

この辺をいじってみます。

イベントについても少々…….

vrview

対象

vrview-master/build/embed.js


embed.js

Pitchの範囲

var FADE_START_ANGLE_DEG = 35;
var FADE_END_ANGLE_DEG = 60;

この設定値を変更します。

var FADE_END_ANGLE_DEG = 80;

 

透過度

var MAX_INNER_OPACITY = 0.8;
var MAX_OUTER_OPACITY = 0.5;

この設定値を変更します。

var MAX_INNER_OPACITY = 0.3;
var MAX_OUTER_OPACITY = 0.1;

さらに

HotspotRenderer.prototype.fadeOffCenterHotspots_ = function(camera){

if (angleDeg < FADE_START_ANGLE_DEG) {
opacity = 1; //<—- 0.2くらいに変更

  }

}

これで、ホットスポットが中央に来たらかなりうすく表示されます。

イベント

ホットスポット関連のイベントは以下の通り。

onMouseDown_
onMouseMove_
onMouseUp_
onHotspotFocus_
onHotspotBlur_

onTouchStart_
onTouchEnd_

Focusはマウスオーバー、Blurはマウスアウトに対応します。

引数にIDを持つので、これらを使えばホットスポットで個別にアクションを起こせます。クリックした時に色が変わったり、マウスのオーバー・アウトで大きさが変わるのも、これらに関連した関数にコーディングされています。


Google VR Viewでホットスポットを使ってみる(on the web)


 

Be the first to comment

Leave a Reply

Your email address will not be published.


*