Mapping Interactive Flash Objects as Papervision3D Textures

[kml_flashembed movie="wp-content/070531/cube.swf" base="wp-content/070531/" height="384" width="512" /]

(drag to rotate, click the scroll bar or buttons)

There’s a big buzz right now around Papervision3D and its really exciting to see all these people posting incredibly innovative work all over the blogosphere. We took Pierre Lepers’ event model for Papervision3D and used it to add interactivity to a 3D object.

Papervision includes a handy material called MovieMaterial which gives you the ability to use any MovieClip as a texture map for a 3D object.

With the event model, every 3D object dispatches MouseEvent3D events that includes the 2D coordinates of the mouse impact point on the texture map.

By moving the source MovieClip with the correct offset, every event (rollOvers, clicks, mouseWheel) is naturally triggered on the source MovieClip and automatically copied to the 3D object’s MovieMaterial.

Download the sources files

{ 38 comments… read them below or add one }

David May 31, 2007 at 2:55 pm

very nice!

…I wonder how hard it would be to put a Flex2 component on the cube?

Patrick M May 31, 2007 at 3:07 pm

I used flash CS3 and I don’t know much about flex but i dont think it would be any different. It should work if you set your MovieMaterial to update from your flex componentm set its alpha to 0 and move it so that it follows your mouse.

David May 31, 2007 at 3:16 pm

this is something I plan to try out.
Will post it to my blog if I get it going… :-)

C4RL05 June 1, 2007 at 5:29 am

You guys really rock!

This is something that makes life much easier for many people.

Thanks for your contribution.

tw June 1, 2007 at 6:56 pm

Is this a Flash 9 file? I’m getting an unexpected file format when I try to open it in flash 8 do you have the flash 8 version available? :) Please…

Zeh June 4, 2007 at 9:12 am

Genius solution. Bravo.

tw June 6, 2007 at 8:43 pm

Does anyone else have trouble opening the FLA in Flash 8?

Patrick M June 7, 2007 at 2:08 pm

You can open the fla in Flash CS3. Flash 8 doesn’t support actionscript 3.

p*wood June 10, 2007 at 3:10 pm

Using Flash CS3, I opened the source FLA file and simply published but got no cube. I’m an old hand at Flash but totally new to AS3 and CS3. Any thoughts?

Bram June 18, 2007 at 1:28 pm

Super! i love it and inspired me to go on with papervision and 3D development. But the example comes with a outdated version of PV3D and does not function with the current one.

keep up the good work! thanks!

chrisj June 20, 2007 at 12:01 pm

thanks for the GREAT example.
I too am having the same problem as p*wood.
I am using CS3, I open the source .fla and when I publish I get no cube.
Do i need to change the classpath in publish settings?
Do i need to change the cube.as location to the same folder as the cube.fla?
oh, i am seeing on Bram’s post that this example does not work with the latest pv3d version… hmmm

Randy Howk June 20, 2007 at 1:24 pm

I am having similar difficulty. When I publish just the skin shows up not the cube and all of the buttons are non-functional. I will try and debugit. But if you have a working version I would love to see that!

Rh

Patrick M June 20, 2007 at 1:35 pm

The classpath is already set to “classes/” in the publish dialog window so everything should be fine. Do you get any errors when you try publishing ?

Patrick M June 20, 2007 at 1:45 pm

The outdated papervision source included in the example was originally modified by Pierre Lepers and Alexander Zadorozhny. Thought you could probably take the current version of pv3d and modify it based on this outdated version… until they implements mouse events in pv3d.

Patrick M June 20, 2007 at 4:03 pm

Randy, look in the flash preferences to see if you have a default AS3 classpath to the papervision3D classes. If you do, delete it, because this example is not gonna work with the current papervision sources. It is a modified version. As of now, papervision3D doesn’t implement mouse events.

Randy Howk June 21, 2007 at 10:53 am

I deleted the papervision classpath from the prefs and rebooted the machine. Checked to see that the classpath wasn’t there after reboot, downloaded a fresh version of your source, compiled it and same results, ie I just see the cross but no cube. I am not showing any errors or console output. I will just have to dig into it and see where it is not working. Where are the mouse events implemented and I will start there. thanks! this will really help my project if I can get it working!

rh

Randy Howk June 21, 2007 at 2:32 pm

Hey just wanted to update you all: I got it to work! I am on a mac and I had to redefine the class path in the publish settings. Even though it is already set to “classes/” for some reason this wasn’t working on the Mac(probably the weird colon notation instead of slash notation) so I deleted that class path and just redefined the class path to where I had saved the whole folder (Hit the target button and navigate to classes folder inside the folder you downloaded from this site; for all the newbies like me!) Thanks a lot it works great! Now all I have to do is tear it all apart and put my buttons in instead. Big leap forward for me.

Randy

Patrick M June 21, 2007 at 2:35 pm

Hey Randy, glad you find the problem, so what is the exact classpath for the mac ?

Randy Howk June 21, 2007 at 5:10 pm

well that depends on where you saved the interactiveMapSources folder. For instance if you save the folder to your desktop your path would be “Macintosh HD:Users::Desktop:interactiveMapSources:classes” But in Flash just goto File ->Publish Settings -> Flash ->Actionscript 3.0 Settings and click on the gunsite and navigate to wherever you saved the interactiveMapSources folder to. If you already have a classpath setup to papervision in either your preferences or your publish settings make sure your delete it so there are no conflicts.

Patrick M June 21, 2007 at 6:06 pm

But there’s probably a way to set a relative classpath on the mac like the one i had for windows. Try just putting a . in front of “classes/” like this “.classes/”

chrisj June 22, 2007 at 3:30 pm

I got it to work as well.. thanks Randy for pointing me in right direction.

On mac in the .fla file I went to publish settings, then Settings, selected the only option in Class Path window, hit the Browse To Path icon and chose the classes folder thats in the same folder as the Cube.fla file.

Also, I had to go into the classes folder and remove the Cube.as and put it in the same folder as the Cube.fla file.

Hope that helps.

Luis June 30, 2007 at 7:27 am

Do you know some way to male this works on Flex?
I am trying but, I can´t make this work….
Great Job…..Congratulations

sim July 2, 2007 at 3:59 am

sry but the src is just really confusing – no structure at all and not well commented too o.O can’t seem to get into is

Christian July 21, 2007 at 9:59 am

OK!!

windows: just go to publishsettings – klick on tab “Flash”.
1. ActionScript 3.0, select it if not by default there.
2. klick “settings”
3. classpath change to: ./classes thx Patrick M, worked for me

publish, works …..

Ben July 25, 2007 at 3:16 pm

just wandering if you had a solution for being able to rotate the camera too (or a reason why it can’t)? I also noticed that the camera cannot position to 0,0,0

Andrew Paul Simmons July 29, 2007 at 2:35 pm

I don’t understand. None of the download src files built the cube. Also, how do you get the mouse move event?

Lukasz August 2, 2007 at 4:35 pm

hey, I was having the same problem, where only the skin would load up but no cube.
I’ve managed to get it to work. Seems to be a clash between namespacing, but not sure why.
I went to my application data folder, where Flash stores all its intrinsic classes.
I’m using Vista so this path will prob be different for XP users.
C:\Users\lukasz.karluk\AppData\Local\Adobe\Flash CS3\en\Configuration\Classes
In there I had I my com.mosesSupposes.fuse library.
All I did was renamed the “com” to “_com” and it resolved the conflict. Cube loads fine now.
My suggestion… have a look if at some stage you might have dropped a library in there that might be causing a namespace conflict.

Harry vyvey August 3, 2007 at 3:35 am

when I run it, it runs fine, but when i try to scroll my flash just crashes…
any idea’s why?

iggy August 3, 2007 at 3:41 am

first few times i had the cube, everything was perfect… and than i tried to modify graphics. after that i can’t get cube even dough i export original files from zip… that’s weird!

iggy August 3, 2007 at 3:44 am

yup!
publishing trick really works!
thanks a lot!

void August 15, 2007 at 2:19 am

*cry* i tried to use this stuff for my page with pv3d 1.5, but theres is no way to just copy the stuff who added to pv3d (i also think its really bad, he should better make his own package to extends pv3d with this feature)

anyway, at last i used the papervision version of this sources and now everything is bugged (z-depths wont work etc) :(

but i need this feature to get my movieclip stuff working….dunno what to do :(

Patrick M August 15, 2007 at 9:47 am

Try Away3D, MouseEvent3D comes from it. http://www.away3d.com

What’s this movieclip stuff you’re talking about?

ar34z January 9, 2008 at 3:13 am

After reading all above comments my cube still didn’t show up. I still had the texture only (downloaded january 9, 2008).

I moved everything to my c:\ in a new folder with no spaces in the name. I don’t think that matters anything at all, but I guess the following did:

I opened up Cube.as and the constructor function was public nor private. It was just “function Cube ()”.
I made this function public and also the “createCube()” function, which was nothing like public or private. I saved the file, published the whole thing and it worked :)

I used the PV3D source files provided in the zip file.

I hope this helps anyone.

Patrick M January 9, 2008 at 11:23 am

This example was made before Papervision had the InteractiveSceneManager. So if you’re working with papervision3D 1.5 and up right now, there’s really no reason for anybody to work with this code.

Dan August 13, 2008 at 7:45 am

Helo,
I tried to use the source files but i am just a designer , is there any way to use it without
knowing any code ?

Javier Pati?o April 16, 2009 at 11:03 am

Hello great work…maybe is possible load and a web page like texture?

basakbabies November 21, 2009 at 9:58 am

Awesome! Like lightning awesome.

roman January 27, 2010 at 5:00 am

Hello guys, that’s really great, but i have another problem.
I want to map interactive flex object (panel, canvas or …) as papervision texture, but not with standard papervision objects (cube, plane….), but with custom collada 3d models, for now i know only how to map bitmaps but no more. Please help me who knows smth about it…

Leave a Comment

{ 6 trackbacks }

Ivan Todorov of BLITZ | Blog » Blog Archive » Source: Mapping Interactive Objects as Papervision3D Textures
May 31, 2007 at 2:38 pm
Mapping Interactive Flash Objects as Papervision3D Textures « Red Escape | FOR YOUR DESIGN | Design Studio
August 6, 2007 at 2:25 pm
RockOnFlash m/ :: John Grden » Wanna click that button on that 3D object? Now you can. Oh, and it’s so easy, a caveman could do it.
August 17, 2007 at 11:59 am
subobjective21 interactive » Working with multiple 3D objects with precise interaction.
July 3, 2008 at 7:44 pm
Cube - mehrere Bilder auf eine Fläche klickbar - Flashforum
February 5, 2010 at 2:57 am
Usar un MovieClip como textura y acceder a sus propiedades en Papervision3D « Wikaina – Blog
April 15, 2010 at 11:29 am