(x,y) = (int(edge*(3-coords)/2), int(edge*(5-coords)/2) )Įdge = inSize/4 # the length of each edge in pixels # edge is the length of an edge of the cube in pixels # coords is a tuple with the side and x,y,z coords # (a sin θ cos ø, a sin θ sin ø, a cos θ) = (x,y,1) Mathematically, take polar coordinates r, θ, ø, for the sphere r=1, 0 1 or tan θ 2.527:Įlif phi > pi/4 and phi 3*pi/4 and phi 5*pi/4 and phi 1: Now projecting from the point at center of the sphere produces a distorted grid on the cube. Imaging a sphere with lines of latitude and longitude on it, and a cube surrounding it. This gives us a clue as to how the box is constructed. We can try and reverse engineer quite what is happening by feeding a square grid into the program. It's hard to tell quite what algorithm is used in the program. You could put the command to do this into a script and just run that each time you have a new image. ImageMagick has a bunch of command-line tools which could slice your image into pieces. If you want to do it server side there are many options. I'm also hesitant to rely on the WebGL functionality, since it seems either slow or buggy on mobile devices. I have okay experience with JavaScript, but I'm pretty new to Three.js. Maybe this is a long shot, but I thought I'd ask. Is there a mathematical way to convert these, or some sort of script that does it? I'd like to avoid going through a 3D application like Blender, if possible. I found Andrew Hazelden's Photoshop actions, and they seem kind of close, but no direct conversion is available. Preferably, I'd like to do the conversion myself, either on the fly in Three.js, if that's possible, or in Photoshop. I then resize and convert these to a cubemap with this website: (Flash) I'm recording the images on the iPhone with Google Photo Sphere, or similar apps that create 2:1 equirectangular panoramas. This requires a cube map, split up into six single images. For mobile performance reasons I'm using the Three.js CSS 3 renderer.
![panorama video convert to 6 face panorama video convert to 6 face](https://www.jamesfmackenzie.com/img/posts/cube-faces-guide.png)
I'm currently working on a simple 3D panorama viewer for a website.