Skip to content

A-Frame Component - <a-sky> alternative to handle 'stereo cube maps'

License

Notifications You must be signed in to change notification settings

wallabyway/aframe-stereocube

Repository files navigation

Stereo-Sky A-Frame Component

An alternative to <a-sky>, but uses stereo cube-map textures (ie. left and right eye textures)

Presented at Autodesk Forge conference.

Tutorial links:

final

video showing that a-frame works on gearVR browser: mp4

Intermediate Steps:

final

Using images from Autodesk A360 Gallery, Project: brooke-and-lauren-model

Slides

google docs

Usage:

Add stereocube.js ...

< script src="stereocube.js" >

Then, attach the component to an entity using the path to the folder holding your cubemap as the attribute. Add two, one for the left eye, one for the right and set the eye property too, like this...

<a-entity skycube="folder:brooke1L; eye:left" scale="1 1 -1"></a-entity>
<a-entity skycube="folder:brooke1R; eye:right" scale="1 1 -1"></a-entity>

Note: the scale property was added here, instead of as a modification to the matrix, to avoid raycast issue with the skybox.

Inside the folder, the component assumes the following naming scheme:

var urls = [ 'L-0.jpg', 'L-1.jpg', 'L-2.jpg', 'L-3.jpg', 'L-4.jpg', 'L-5.jpg' ];
ie. front, right, back, left, floor, ceiling

This is the scheme used by Three.js's CubeTexture. If your cubemap images do not follow this scheme, you will need to rename them (or fork this repo and alter the above in stereocube.js).

Finally, add the 'stereocam' property to your camera, like this:

<a-camera stereocam position="0 0 0"> </a-camera>


Referenced

Notes

Blogs

Other a-frame walkthrough's

Random

  • I'd prefer to use cubetextureLoader, but ran into issues with caching (??): github
  • aframe's coordinate system: aframe-demo
  • material based cubemap: PhaseOne

About

A-Frame Component - <a-sky> alternative to handle 'stereo cube maps'

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published