In my previous post "Embedding Google Cardboard Camera VR Photosphere with A-Frame", I wrote that some talented programmer would probably create a better solution for embedding Google Cardboard camera photosphere using A-Frame.
I didn't know that Chris Car had already created a sophisticated solution for this problem. You can view it here on A-Frame blog.
You first might have to use Google Cardboard camera converter tool to make your Google Cardboard photosphere.
.Early this year I started looking into the VR (Virtual Reality) web applications. Web browsers now natively support VR applications using WebVR JavaScript API. We can now design virtual worlds using markup language and connect them to devices such as Oculus Rift and Leap motion controller using just a web browser.
To hit the ground running with WebVR. I started an experiment to capture Hackerspace Phnom Penh using Google Cardboard camera app and display it using A-Frame framework. The Google Cardboard camera photosphere is not supported by A-Frame. But the positive responses to my query encouraged me to try an hack using A-Frame Panorama component.
Is it possible to embed Google cardboard camera image capture in a @aframevr powered site?
— Arky (@playingwithsid) December 17, 2015
And it works. Almost I had to tweak the scale setting a bit to try get the perspective right but it does work. The ideal solution is to create a A-Frame custom component, that I leave it for more skilled people.
The markup needed for this demo is simple, you can achieve this with one line.
<a-scene>
<a-sky src="img/hackerspace.vr.jpg" radius="2400" scale="2 1 2"> </a-sky>
</a-scene>
You can see the demo on Youtube or visit this webpage in an compatible web browser.
