2016年2月25日木曜日

RICOH THETA ビュアーブックマークレット作りました

オープンソースの
  • three.js
  • thview.js
をお借りして、RICHO THETA で撮影した jpg 画像をPC・スマホで適切に表示するブックマークレットを作成しました。

需要があるかどうかわかりませんが、とりあえず晒しておきます。

Android の Chrome と、Chormebook の Chrome で動作確認しています。

ソース:
(function(f){
 var s = document.createElement("script");
 s.src = "https://cdn.rawgit.com/aike/thview.js/master/example/three.min.js";
  s.onload=function(){f()};
 document.body.appendChild(s);

 var s2 = document.createElement("script");
 s2.src = "https://cdn.rawgit.com/aike/thview.js/master/example/thview.js";
 document.body.appendChild(s2);

 var div = document.createElement('div');
 div.id = 'ph1';
 div.style = "position:absolute;top:0;left:0;";
 document.body.appendChild(div);
})(function(){
 new ThView({id:'ph1', file:location.href, width:document.documentElement.clientWidth * window.devicePixelRatio, height:document.documentElement.clientHeight * window.devicePixelRatio});
});


ブックマークレット:
javascript:(function(c){var b=document.createElement("script");b.src="https://cdn.rawgit.com/aike/thview.js/master/example/three.min.js";b.onload=function(){c()};document.body.appendChild(b);var a=document.createElement("script");a.src="https://cdn.rawgit.com/aike/thview.js/master/example/thview.js";document.body.appendChild(a);var d=document.createElement("div");d.id="ph1";d.style="position:absolute;top:0;left:0;";document.body.appendChild(d)})(function(){new ThView({id:"ph1",file:location.href,width:document.documentElement.clientWidth*window.devicePixelRatio,height:document.documentElement.clientHeight*window.devicePixelRatio})});


クリエイティブ・コモンズ・ライセンス
hidemaru 作『THETA Viewer for Browser』はクリエイティブ・コモンズ 表示 4.0 国際 ライセンスで提供されています。
https://github.com/aike/thview.jsにある作品に基づいている。