I also updated the smoke Particle System that will help you understand how PaperVision3D delivers interactivity with screen objects and the mouse. You can get a better understanding of the conversion to PV3D in the tutorial above and know more about setting up projects in PV3D here.

As usual, you can grab the sources below:

smokeparticlesystempv3d.zip

I understand that PaperVision natively provides a ParticleSystem and there have been other Particle System code snippets lurking around the internet, but for people, who have been following my particle system tutorials, I’m going to tell you how to convert the same particle system into 3D using PaperVision3D. Here’s how it looks in PaperVision3D; you can use the mouse and the arrow keys to move the camera around:

Code rundown:

If you want to understand the code in the sources below, you can go through the tutorial, I posted about setting up projects in PV3D. The biggest change is to remove the particlesystem class and reduce the Parent Child Hierarchy. I have moved the ParticleSystem class into the main section of our project, such that all particles become direct children of the scene. This reduces the need to have a DisplayObject3D Container. It also helps in managing the particles easily.

You can grab the sources below and don’t forget to leave me some feedback .

simpleparticlesystempv3d.zip

Hi,

I just wanted some time out today to do another tutorial for Particle Systems in ActionScript 3. For people who followed my previous Simple Particle System tutorial; this tutorial is totally based on the previous one. I will be telling you, how to add different factors to the already running particle system. If you have the previous tutorial downloaded, you can just open that up and add lines to it as I explain them. I have also attached an updated version, if you want it all done.

Ok, to the tutorial. Particle systems are of so many types that you can never really deal with all of them, yet they all follow the same basic principles as I explained in the first tutorial. For example, you can use the previous tutorial as a “Water” particle system. Today, I’m going to modify it to look like a “Smoke” particle system. We will add wind to it, so that the smoke gets farther away when wind is fast and the speed of particle emission increases as the wind increases and vice versa. Here’s a preview:

First we change the following line in the Particle Class constructor:

Particle.as

1
2
3
4
5
6
7
8
9
10

public function Particle(l:Vector3D)
{
acc=new Vector3D(0.0,0.05,0.0);
 
vel=new Vector3D(Math.random() * 1.0,Math.random() * 1.3 - 1.0,0);
 
loc=l.construct();
r=10.0;
timer=1.0;
}

This gives a different velocity to every newly generated particle in the system. You can always modify this to have a different effect on how the particles behave when they are born. Next, we need to update this velocity component in every frame, or the particles will remain still. So in our update function, we add:

11
12
13
14
15
16
17
18

public function update():void
{
vel.addition(acc);
loc.addition(vel);
 
timer-= 0.025;
acc.setXY(0,0);
 }

and now to add that force, which we call “wind”. The details on the calculation of the wind factor come later in this tutorial, but for now, add a new function to the Particle class as follows:

19
20
21
22

public function add_force(f:Vector3D):void
{
acc.addition(f);
}

Ok, that is all for the Particle class. If you do not understand any of the above changes, do not worry, I will be explaining them once more in the end. Now to our Particle System class:

ParticleSystem.as

There is no big change in the ParticleSystem class, except for one function:

23
24
25
26
27
28
29
30

public function add_force(dir:Vector3D):void
{
for (var i:int=particles.length - 1; i > 0; i--)
{
var p:Particle=Particle(particles[i]);
p.add_force(dir);
}
}

The above function is propagating the wind factor, which comes from our main FLA into each particle of the Particle System. In other words, this function calls the “add_force” function of the Particle Class. I have kept the names same for both the classes, so that one can understand the propagation. More about the “dir” vector in the next paragraph.

To our main FLA, where all of this comes to life.

31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

var ps:ParticleSystem = new ParticleSystem(0,new Vector3D(stage.stageWidth/2,stage.stageHeight/2,0));
addChild(ps);
 
function update(e:Event)
{
var dx:Number = (mouseX - width/2) / 1000.0; // horizontal drag component
var dy:Number = (mouseY - height/2) / 1000.0; // vertical drag component
 
var wind:Vector3D = new Vector3D(dx,dy,0);
ps.add_force(wind);
 
for (var i:int = 0; i < 2; i++)
{
ps.addParticle();
}
ps.run();
}
this.addEventListener(Event.ENTER_FRAME,update);

Paste the above code in your FLA and run it, you’ll notice that the Smoke gets an acceleration factor when you move the mouse farther away from the Particle System. This gives you a feeling that there is wind acting on the Particle System. Now to explain what we are doing in the code above:

First we take variables dx and dy. The formula is to take the current position of the Mouse Pointer on the screen and convert it so that our particle system takes direction based on that position. For example:

If

mouseX = 192;
mouseY = 145;
width = 200;
height =200;

then the result for the values of the variables dx and dy should be:

dx = 0.092 = (192 – 200/2) / 1000.0
dy = 0.045 = (145 – 200/2) / 1000.0

and then we send this value to our Particle System’s “add_force” function, which propagates this value into every particle in the Particle System. Also, notice the FOR loop, I’m tricking the Particle System as if there are two emitters . If you do not understand what that means, you should go over my previous turorial. Putting this hierarchy together, lets see what our particle system is doing now:

- Calculate a wind factor (wind vector in the Main FLA) using the values of dx and dy.
- Send that wind vector to the “add_force” function in the Particle System class.
- Calling the “add_force” function of each particle and adding that wind factor to their acceleration.

Simple, right? This was pretty easy. I would recommend you try different things in the particle system to take more use of it. You can change the colors of particles over time to give them a FIRE effect .

M.H.A.Q.S.

smokeparticlesystem.zip