Flint Particle System Forum - moving to 3D

moving to 3D

noTxt — Wed, 07 Apr 2010 23:48:02 +0100

Hey Richard - thanks for being a total badass,

I've been using flint to make a silly interactive project at work
http://www.idbranding.com/#/ideas/thebuzz

Now one of the designers wants the bees to go back and forth behind the flowers, which I don't think is possible in 2D because all objects are children of the renderer and therefore stuck in the display list.

So, I thought I'd try 3Ding it, but I'm a little stuck on how to get the x and y coordinates for out of Point3D, which I need to place the textFields. Any ideas or easier approaches?

helping newbs is good karma,
... noTxt

moving to 3D

Richard — Fri, 09 Apr 2010 09:07:47 +0100

Hi noTxt

To get the on screen x,y coordinates of the particle you need to apply the camera transform to the position vector. The basic code for this would be

var p:Point3D = camera.transform.transform( particle.position ) as Point3D;
p.project();

Now p's x and y should be the x and y where the image will be rendered.

However, to make this work in 3D you'll need to include the flowers in the scene, otherwise you're still limited by the bees being in one display object and the flowers in another. Flint's native 3D renderer only renders particles so (unless you want to make the flowers particles) you'll likely need to use Away3D or Papervision3D as the renderer for the particle system. Then, if you include the flowers in the scene, Away3D or Papervision3D will take care of which is in front or behind for you.

Another option would be to go back to 2D but create two emitters and two renderers. Configure the emitters identically, add them to the renderers and place one renderer in front of the flowers and one behind. Now you can swap the bees between the emitters by adding and removing them from the particles array of each emitter.

I hope that doesn't sound too complex.
Richard

moving to 3D

noTxt — Tue, 13 Apr 2010 18:43:31 +0100

Thanks a ton!

It sounds complex but not too complex. I'd been thinking along the same lines but hadn't quite put it to myself so clearly. I'm going to try for the 2D execution - ( it'll be quite a bit smaller/faster, yeah? ).

I'll let you know how it turns out and hopefully get it moved from "how do I" to "show and tell".

thanks again,
... noTxt

moving to 3D

kidmotion — Sun, 30 May 2010 17:22:12 +0100

how did you use your MOUSE_OVER listener to your particle? I'm currently trying to do something similar where if you click a particle it brings up specific information by keeping track of the id of the particle.

for(var i:int = 0; i < 15; i++){

var _angel:ImageClass = new ImageClass(Angelltem, _id, _array)
addInitializer(_angel);
counter = new Blast(i);
_angel.addEventListener("CLICKED", tops); --------------throwing error
}

My AngelItem class has the EventListener and I'm trying have the particle listen for it.

Thanks

moving to 3D

kidmotion — Mon, 31 May 2010 16:22:17 +0100

Just in case anyone had the same question, here is how I solved this.

-Create class that extends MovieClip or Sprite
-create your emitter, renderer, and setup all the defaults/actions/intializers you want
-renderer.mouseEnabled = true;
-renderer.mouseChildren = true;

-This is where I created an array

for(var i:int = 0; i < 15; i++){
_angel = new Angelltem(i, _angelArr); //** AngelItem is a class I'm using for my particles**//

_angel.addEventListener(MouseEvent.CLICK, clickedAngel); //** this probably should be in the AngelItem Class but just for sake of demonstration**//

var particle = Particle2DUtils.createParticle2DFromDisplayObject(_angel, renderer, emitter.particleFactory);
emitter.addExistingParticles([particle], true);
}

private function clickedAngel(e:MouseEvent):void{
trace(e.currentTarget._id)
}

This s how I created an array of particles and added eventListeners to each one.