Monday, April 18, 2011

Example of Using Flare3D for Molehill

Most of the great Molehill examples that I’ve seen have been created using the new version of Away3D. But there are many other 3D engines out there that will be supporting Molehill. One of the nicest is Flare3D and they have just released a preview of the Molehill-enabled version. This engine is created by a team based out of Argentina. Below is a simple example showing how to dynamically load bitmaps onto 3D planes. The example uses the TwitPic API. You simply enter the Twitter ID and it will show their photos in 3D. Click on the image to see the example and the source code is below that.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91[SWF(width="800", height="600", frameRate="60", backgroundColor="#000000")]
public class MoleTest extends Sprite
{
private var scene:Scene3D;
private var planes:Vector. = new Vector.();
private var shaders:Vector. = new Vector.();
private var numOfImages:int;
private var txt:Text;
private var images:XMLList;
public function MoleTest()
{
Security.allowDomain("s3.amazonaws.com");
Security.loadPolicyFile("s3.amazonaws.com/crossdomain.xml");
var it:InputText = new InputText(this, 50, 50, "leebrimelow");
it.setSize(130, 20);
addChild(it);
var butt:PushButton = new PushButton(this, 200, 50, "Submit", function():void {
getPics(it.text);  
removeChild(butt);
removeChild(it);
});
addChild(butt);
}
private function setup3D():void
{
txt = new Text(this,375,280,"LOADING");
txt.setSize(50, 20);
addChild(txt);
scene = new Scene3D(this);
scene.addEventListener(Scene3D.COMPLETE_EVENT, completeEvent);
scene.addEventListener(Scene3D.UPDATE_EVENT, updateEvent);
scene.camera.setPosition(0, 0, -1500);
for(var i:int=0; i{
var texture0:Texture3D = scene.addTextureFromFile("http://twitpic.com/show/full/"+images[i].short_id);
shaders[i] = new Shader3D("shader"+i);
shaders[i].twoSided = true;
shaders[i].layers.push(new TextureMapLayer(texture0));
shaders[i].build();
planes[i] = new Plane("plane"+i, images[i].width, images[i].height);
scene.addChild(planes[i]);
}
}
private function completeEvent(e:Event):void
{
removeChild(txt);
for(var i:int=0; i{
planes[i].setMaterial(shaders[i]);
planes[i].x = Math.random()*2000-1000;
planes[i].y = Math.random()*2000-1000;
planes[i].z = Math.random()*2000-1000;
}
}
private function getPics(tname:String):void
{
var loader:URLLoader = new URLLoader();
loader.addEventListener(Event.COMPLETE, function(e:Event):void {
var xml:XML = XML(loader.data);
images = xml.images.image;     
numOfImages = images.length();
setup3D();
});
try {
// TwitPic has no cross-domain file so you will need to proxy it
loader.load(new URLRequest(YOUR_PHP_PROXY_SCRIPT));
}
catch(e:Error) {
trace(e.message);
}
}
private function updateEvent(e:Event):void
{
if ( Input3D.mouseDown )
{
scene.camera.rotateY(Input3D.mouseXSpeed, false, Vector3DUtils.ZERO );
scene.camera.rotateX(Input3D.mouseYSpeed, true, Vector3DUtils.ZERO );
}
scene.camera.translateZ( scene.camera.getPosition().length * Input3D.delta / 20 );
scene.defaultLight.rotateY( 2 );
}
}

View the original article here

No comments:

Post a Comment