in 3D

North Face Demo Using Papervision3D!

After reading Mike Downey’s post yesterday and checking out the 3D video carousel, I decided that this would be a good example to create to help me learn Papervision3D. The API couldn’t be easier to use and if you use the AS3 version it is lightening fast! Click on the image below to see the example. I embedded the FLV files so that there wouldn’t be buffering issues. It’s around 6 megs so just give it a chance to load. I’m so excited about Papervision3D! The AS3 is also shown below. Flash 9 player required!

[as]import org.papervision3d.scenes.*;
import org.papervision3d.cameras.*;
import org.papervision3d.objects.*;
import org.papervision3d.materials.*;

var sp:Sprite = new Sprite();
sp.x = 320;
sp.y = 200;

var radius:int = 800;

var s:Scene3D = new Scene3D(sp);
var cam:Camera3D = new Camera3D();
cam.z = -150;

var center:Plane = new Plane();
center.visible = false;

var bmd:BitmapData = new BitmapData(320, 240);
var bmd2:BitmapData = new BitmapData(320, 240);
var bmd3:BitmapData = new BitmapData(320, 240);
var bmd4:BitmapData = new BitmapData(320, 240);

var mat1:BitmapMaterial = new BitmapMaterial(bmd);
mat1.oneSide = false;
var plane1:Plane = new Plane(mat1,320, 240, 5, 5);
plane1.x = Math.cos(Math.PI*2) * radius;
plane1.z = Math.sin(Math.PI*2) * radius;
plane1.rotationY = 270;

var mat2:BitmapMaterial = new BitmapMaterial(bmd2);
mat2.oneSide = false;
var plane2:Plane = new Plane(mat2,320, 240);
plane2.x = Math.cos(Math.PI/2) * radius;
plane2.z = Math.sin(Math.PI/2) * radius;
plane2.rotationY = 180;

var mat3:BitmapMaterial = new BitmapMaterial(bmd3);
mat3.oneSide = false;
var plane3:Plane = new Plane(mat3,320, 240);
plane3.x = Math.cos(Math.PI) * radius;
plane3.z = Math.sin(Math.PI) * radius;
plane3.rotationY = 90;

var mat4:BitmapMaterial = new BitmapMaterial(bmd4);
mat4.oneSide = false;
var plane4:Plane = new Plane(mat4,320, 240);
plane4.x = Math.cos(Math.PI*1.5) * radius;
plane4.z = Math.sin(Math.PI*1.5) * radius;
plane4.rotationY = 0;


this.addEventListener(Event.ENTER_FRAME, render);

var angle:Number = 0;

function render(e:Event)
angle += (this.mouseX – 320) * 0.001;
cam.x = Math.cos(angle) * 900;
cam.z = Math.sin(angle) * 900; = center;

vid1.visible = false;
vid2.visible = false;
vid3.visible = false;
vid4.visible = false;[/as]


Write a Comment



  1. 1. Frickin awesome
    2. You’re the man dude
    3. How can I be down? (Seriously I totally look up to you now)
    4. Submit this to PaperVision
    5. I’m totally amazed at how fast it is.

  2. When do we get to play with Papervision3D?
    I can’t find a download anywhere, on their site it says there are in private beta, but I see a lot of blogs posting things made with Papervision3D…

    Maybe I should start a blog.. (nay, don’t have the time for that kind of thing..)

  3. Amazing, as always Lee. You could even set the rotation speed a bit slower, cause its almost too responsive on my MacBook :)

  4. I can’t wait to use papervision, but certainly not for a carrousel. I have done a lot, and a lot of other “3d” code, using Kirupa 3d world.

    The sandy framework also allow some cool stuff in 3d for Flash 8. Perpervision really good demos are the rhino with reflection, star wars, QTVR look alike and playing cards in the wild. Theses are superb, innovative stuff.

  5. Wow! Really inspiring stuff, lee! I’m in agreement with the others here, we need some papervision tuts up on GTAL! ;D

  6. Really cool! I build a similar example and I ask me why you use mat1.updateBitmap()? It is necessary or can we only use the draw-command to update the video-texture?

    Thanks in advance for your response!


  7. Hello,

    I try to do the same work and I want to known if it’s possible to have the full code please ????

    Thanks …

  8. hi
    thats very are always mindblowing and outstanding LEE,but can i have the same effect in flash8.So can u give a tutorials on all of your papervision3D using Flash8.Its a request to from all of us

  9. I’ve done the Carousel with Lee’s instructions and updated it to CS3 ActionScript3, but this Carousel is really great.
    The videos on the Carousel look great plus having the videos themselves turn and showing the back side of the video is an awesome technique.
    What’s the chances of getting the FLA and ActionScript for it? :-)

    Great Job!


  10. How do you setup the video within Flash. Please explain this reference to the video file — bmd.draw(vid1.v);.

    Any assistance would be appreciated.

    Thank you!

  11. I tryed to update your Carousel for the Great White 2.0 release, but it seems that something is wrong with the angle stuff. Can you remake this great Tutorial if possible? Would be really great.

    – Mike