Continuing with my experiments with Papervision3D, today I was looking more into creating the Qucktime VR like panoramas. There are quite a number of well done panoramas but all of them require custom cropped images etc. What I really wanted to do was to just have them be generated off images in my Flickr account. Of course this is unrealistic a bit since the way panoramas work requires the two edges of the photo being viewed to merge seamlessly with each other. This way there is a sense of continuity. However, I took some ‘creative license’ and the result is below.
Creating Panoramas the right way:
There is an excellent tutorial on how to create simple Panoramas the right way here. The idea is simple. Create 6 photographs of a location and map each of them on the different planes of a cube. Then set a Free Camera in the middle of the cube and then use the mouseX/mouseY properties to change the camera’s rotation about the X and Y axis.
The direction I wanted to take was to load an image from Flickr and then chop it up into 4 equal sizes, and then use them as textures on my cube. I realized pretty early on that there was no way I could enable looking up/down since I couldnt take any part of the image as surfaces for those planes, so I restricted the motion to only the X-axis.
Loading an image from Flickr, taking bitmap snapshots at quarter intervals each only 1/4 of the width of the photo (thank you flickr.com/crossdomain.xml) for each surface and then mapping to the surfaces was really easy and I was pretty much done soon. It looked okay-ish but there was one big issue: As I mapped the images to planes 1,2,3 and 4 (left, front, right, back) successively, the edge between plane 4 and 1 killed the look since they did not merge seamlessly. I was about to shrug and walk away (after all this was just to get more familiar with P3D), when I had an idea. I was already taking snapshots of the images loaded in, it wouldnt be that hard to take another set of snapshots that were flipped on the Y axis (ie mirror images). Then, I mapped the original 4 pieces to just 2 planes (say left and front surfaces of the cube). The edge of the front plane then connected with its own mirror image, and the mirror images were mapped to the remaining 2 surfaces. This way there were no disjointed segments butting against each other.
[SWF]http://www.arpitonline.com/blog/swf/flickr/Main.swf, 500, 600 [/SWF]
I’ll make another post on my mirrored image generator next but in the meanwhile check it out and let me know what you think.
P.S: It took me another 30 minutes to fix a bug when I put the swf on my server, since Loaders dont check crossdomain.xml by default. Arghhh !
Code Zen 