MarcPelland.com
Welcome at » Guide to Getting Started in Papervision 3D

Guide to Getting Started in Papervision 3D

Introduction

Table of Contents

Overview

Papervision 3dIn this tutorial you will learn a little bit about what 3D is and how it is used on the web. As well as how to harness tools that have been created for you to build your own 3D experiences.

I am going to start out with a brief discussion and introduction of 3D and what Papervision brings to the table and then move on to the full tutorial. The files for the tutorial can be found by clicking here: tutorial files

What is 3D?

A standard website is created in 2D space; that is it consists of objects (text, images, video, etc) on an X and Y plane. People have faked perspective in the past using graphics tool, but in general it has been 2D. What 3D does is add another dimension to that traditional plane. Alongside the X and Y, there is now a Z. This 3rd dimension allows for depth to be shown.

circlesI remember my entry exam for college, I had to look at a series of shapes and come up with any number of ideas for what it could be. For instance, if you look at a circle with another circle inside it you would think that it was just two circles. If you were told to imagine those same two circles in 3D space the possibilities are much greater as to what they are. It could be a bowling pin from the top, an empty glass, a garbage can, or a football being tossed into the center of a hoop.

If you are having still having trouble envisioning the 3rd dimension, here is a great video/project by Rob Bryanton explaining how dimensions work:

What is Papervision?

Papervision is a 3D engine built with Actionscript that enables developers to start working in 3D. Using a ton of math, the Papervision team has found a way to create a simulated 3D environment.

Papervision consists of a ton of Actionscript classfiles that developers can use to create objects, scenes, and even worlds in 3D space. 3D applications and engines generally build objects using smaller objects, Papervision is no different. It uses triangles as the building blocks for larger objects in the scene. The more triangles that are used, the better the quality but more triangles means that it is harder on the processor.

Being open-source, developers are able to see all the code that they are working with which allows for a better understanding of what they are using. This also means that the development community has to ability to build on what the original developers have done without having to go through the hardships involved in extending something that is not open-sourced.

Open source means that it can be easier to understand how a complex system works because you can view all of the code that it was built with. If you have any more questions regarding the benefits of an open-source system, there is a good article located here: http://www.directionsmag.com/article.php?article_id=889&trv=1

Why use Papervision?

greatwhitePapervision is a great 3D engine for Flash, but there are others. These include Sandy, Away3D, Alternative, and more. When push comes to shove it is more of a personal preference that I came to like working with Papervision.

I think that the biggest reason to use Papervision (other than comfort from it being the first engine that I tried) is that it is so widely supported in the Flash community. I seem to be able to find more help with Papervision than with any of the other application. Having the ability to tap into the minds of other developers in forums, at conferences, and anywhere really is a priceless tool.

What has been done with Papervision?

I have to start off with a site that I had a hand in building, and that is www.amg-360.com. Apart from a couple of prototypes, this was my first major 3D application for the web.

Some other good examples can be found at: http://dailypv3d.wordpress.com

Pages: 1 2 3 4 5

48 Responses




  1. If your looking for some tutorials on Papervision you can check out http://hubpages.com/hub/Papervision-3D-programming-tutorial-Depth-of-Field and http://hubpages.com/hub/Papvervision-3D-programming-tutorial-Casting-Shadows

  2. chris




    nice article. it has been a huge help in getting me going. thanks for taking the time to write it.

  3. KS




    The latest SVN branch is http://papervision3d.googlecode.com/svn/trunk/as3/trunk/src/

  4. kkx




    Thank you very much!

  5. XIII




    after setting up the primitives, i dont see any objects when i test the movie, just background without anything objects.

    i script and import onto the main FLA, what did i missed? O_o

  6. raj




    Hi,
    I am a beginner who just started learning papervision3D. I am using Flex builder for it.
    So far I found your article very nice until I encountered the statement, “One thing to note is the use of the MovieAssetMaterial, for this I had to create a MovieClip in the Flash library and export it for actionscript (Linkage). Once defined, the materials can be used on any object, over and over again”.
    Could you please tell me or point me to a tutorial which describes how to create a MovieClip in the Flash Library and export it for actionscript (linkage).




  7. In flex i believe that you can just use the [Embed] metatag and point it to a swf. Give it an id and then use that as a movieassetmaterial, take a look here: http://www.bit-101.com/blog/?p=853.




  8. Super helpful tutorial. Thanks Matthew.

    When I try to compile HelloMaterials.as in Flex Builder 3 using [Embed(source="spheremat1.swf", symbol='spheremat')] to give sphereMaterial a texture i keep getting this in the Problems panel:

    “An Embed variable must not have an existing value.”

  9. Lauri




    Just a little thing I noticed:

    I checked out revision 876 today and tryed these tutorials with flash cs4 and I had to add opacity to this line to make it work:

    var planeMaterial:ColorMaterial = new ColorMaterial(0×55FF11, 100);




  10. Yes! in this line:
    var planeMaterial:ColorMaterial = new ColorMaterial(0×55FF11);
    I have the same error… why??
    1084: Error de sintaxis: se esperaba rightparen antes de 55.




  11. very odd errors with the materials because the constructor doesn’t even require a color. it is provided with a default:

    public function ColorMaterial( color:Number=0xFF00FF, alpha:Number = 1, interactive:Boolean = false )

    unfortunately I don’t have a copy of CS4 but i might be able to play around tonight to see if i can reproduce the issue

  12. tim




    Marc,
    Is there a way to make it work with CS3 using an external swf for assets, like so:

    [Embed(source="assets.swf", symbol="sphereMaterial")]
    var sphereMaterial:MovieAssetMaterial = new MovieAssetMaterial(“sphereMaterial”);




  13. using an external file is done with the BitmapFileMaterial for images or the asset material with a swf. but you have to properly load it in. the embed tag that you are showing there is a flex meta tag that isn’t valid in CS3. you could just use a loader in cs3 and reference that movie once it has finished loading.

  14. yukimi




    Hi Marc, I’m using papervision3d and flash cs3. How do I add a swf as an object/movieclip (just like any other primitives – sphere, cube, etc)? And I want this swf object appear at a highest index (so that it appears at the front)? Please advise. Thanks.




  15. Thank you for your website and the tutorials Marc :) , now all I have to do is learn Flash, Actionscript3 and Papervision3D :(

    Porly G




  16. Marc,
    I am going to keep working on this my self, but in case you have any insight, I get the following error when publishing HelloMaterials:
    INFO: Papervision3D 2.0.0 (March 12th, 2009)

    INFO: Viewport autoScaleToStage : Papervision has changed the Stage scale mode.
    ReferenceError: Error #1065: Variable sphereMaterial is not defined.
    at global/flash.utils::getDefinitionByName()
    at org.papervision3d.materials::MovieAssetMaterial/createMovie()
    at org.papervision3d.materials::MovieAssetMaterial/set texture()
    at org.papervision3d.materials::MovieAssetMaterial()
    at HelloAnimation()

    I’ve never seen a MovieClip referred to as a Class before. Is there a Script that goes with the MovieAssetMaterial MovieClip?




  17. Figured this part out:
    The Linkage to the empty MovieClip should be sphereMaterial… NOT MovieAssetMaterial




  18. Hey Danny,
    you have lost me. sphereMaterial is the linkage name of the movieclip in the library. I am applying it as a MovieAssetMaterial

  19. Joe




    Hello Marc !
    Thank you a lot for this tutorial.
    After lots of research on the web, I can’t fix my problem :
    I Create a FLA files with HelloPapervision.as as Document CLASS, and I have my HelloPapervision.as with the first simple code.
    When I extends BasiView, the flash compiler say :

    TriangleMaterial.as, line 24 :
    1020: Method marked override must override another method.

    Is it the good way to lunch the application ?

    Thank you for you help …
    I still continue to search my nut

  20. Joe




    Ok it’s work … it was the mess in my org folder… sorry !!
    Let’s go :)

  21. Roberto




    Hi! A very nice job!!
    But if you cancel the rotationY of sphere and container in the overrided function in the “Controlling Objects with the Mouse” section, it will be better…

    Bye!

  22. Jay




    Very nice tutorials. Please, keep’em coming!! =)




  23. You’re so GOOD.
    It works properly! Thanx

  24. hackdan




    Cool anybody knows how import or parse collada with animation and run it in PV3d ?

  25. Krodil




    Hey.. nice work.. :)

    I get the cam feed and such, but when I run I get error
    1017: the definition of base class ObjectContainer3D was not found..
    Any help…




  26. I tried this code with Papervision 2 and it gives me a huge error in Papervision 2 code.
    The Papervision version is Papervision3D_2.1.920

    there about 20 compiler errors for package org.papervision3d.objects.parsers.Max3DS
    like this one:
    ” 1178: Attempted access of inaccessible property _textureExtensionReplacements through a reference with static type org.papervision3d.objects.parsers:Max3DS. ”

    also compiler errors for few more classes.

    I took a look at the code, and I saw that some variables are declared later than they are used, for example in the class
    org.papervision3d.objects.parsers.Max3DS ,
    the variable
    private var _textureExtensionReplacements:Object;
    is declared in line 636, but the compiler error is in the line 41 – “1178: Attempted access of inaccessible property _textureExtensionReplacements through a reference with static type org.papervision3d.objects.parsers:Max3DS.”
    I had this mistake in my work but PV3D2 developers knows better. Maybe I should contact them? Does anyone use PV3D 2 ? WHat results do you get?




  27. MovieAssetMaterial, for this I had to create a MovieClip in the Flash library and export it for actionscript (Linkage). Once defined, the materials can be used on any object, over and over again”.




  28. Thanks for the introduction! I am always reading your blog and only today I have spotted the post with introduction! I am one hundred percent sure that Jodi is cool as other members are.




  29. Such an interesting post never had any of this informative blog till now. I might suggest my friends to visit here too.




  30. This a nice tutorial and very detailed with matching table of contents. I like the way you elaborated each step since it is easy to follow. Even if those people who don’t have enough knowledge about programing would have an ease to follow each step.




  31. Thanks for sharing!




  32. Many thanks to the person who made this post, this was very informative for me. Please continue this awesome work. Sincerely…

    The article is very well!




  33. Very good post. Made me realize I was totally wrong about this issue. I figure that one learns something new everyday. Mrs Right learned her lesson! Nice, informative website by the way.




  34. i dont see any objects when i test the movie, just background without anything objects.




  35. Nice topic and post, as we were just talking about what things can happen in the medicine industry.




  36. This design is incredible! You definitely know how to keep a reader entertained. Between your wit and your videos, I was almost moved to start my own blog (well, almost…HaHa!) Fantastic job. I really loved what you had to say, and more than that, how you presented it. Too cool!




  37. I took a look at the code, and I saw that some variables are declared later than they are used, for example in the class




  38. Thank you for this article. That’s all I can say. You most definitely have made this blog into something special. You clearly know what you are doing, you’ve covered so many bases.Thanks!




  39. Very good an article details write very in place thanks for sharing




  40. Really valuable written content. the information that you shown is amazing and many prominently i liked the way you provided things here.




  41. you have lost me. sphereMaterial is the linkage name of the movieclip in the library. I am applying it as a MovieAssetMaterial




  42. A great post, thanks for taking the time to share, continued success to your site in the future! GOOD Work!!




  43. Hi there,
    Really nice job,There are many people searching about that now they will find enough sources by your tips.
    Also looking forward for more tips about that




  44. thank you very Retrojordansbuy.com.




  45. A great post, thanks for taking the time to share, continued success to your site in the future! GOOD Work!!

  46. MUHAMMAD Junaid




    Hi, I want to develop web based 3d Virtual book Shop/store(website)
    as my BS-Software Engineering final year project

    Basic scenario that the shop must be capable of is as follow

    The Shop is as it is physically , the online customer will go to the shop website when the user entered the URL of website the website opens and ask for MALE OR FEMALE—when the customer select one it will enter in the shop(A BOOK STORE IN MY MIND) with the selected MALE OR FEMALE character/AVATAR—now he is allowed freely to move in the shop and interact freely with different products (preview the books ,Cdz and other media available) and add to cart and at the end SHOP I/ Pay for it

    I want another functionality i.e online users that currently on that webpage are also visible to the other user on that website

    THE ADMIN PANEL WILL ALLOW ME TO Customize the web content if it is going to deploy for another shop some how like this

    What SHOULD I NEED/USE
    Flash, Google O3d , WebGL , Java3d ,X3D ,VRML , Unity3D , Infinity or etc…etc
    HTML 5 …??? Support or Help me ??? paper Vision ???

    I need Help about Technologies/platforms/languages should and shouldn’t

    I NEED A GUIDANCE for it

    I need help regarding it . .ALSO IF YOU KNOW any 1 having experience or knowledge about it that will help me please sent his/her EMAIL ID so that I contact him or Forward my Email or Refer me

    I’ll Be very thankful to you

    BEST REGARDS
    MUHAMMAD Junaid




  47. Great tips, I would like to join your blog anyway




  48. Hi Junaid,

    That sounds like a plausible site, with the exception of being able to see everyone else that is in the store as well.. I would limit that to a couple people, just to keep the complexity down.

    If you were to consider it in Flash (3d), I would recommend building with the latest (Molehill) version of a 3d engine. The engine that you use is up to you, I have been playing around mostly with Alternativa and Away 3D but have seen good things with Flash and Yogurt. I don’t really know enough about the rest of the 3d technologies to give much advice with them, but if you are focusing on a website and don’t want to restrict people who are coming to your site, then i would suggest Flash.

Leave a Reply

Captcha
Enter the letters you see above.