Report a Bug

SIGN IN!

Particle Effects Generation


Particle effects can add a lot of detail and pop to your graphics and gameplay. Here is an implementation I use to incorporate single pixel particle effects for sparks and explosion details.
  1. FireGib = EntityParticle.extend({
  2. // shorter lifetime
  3. lifetime: 1.0,
  4. fadetime: 0.5,
  5.  
  6. // velocity value to be set
  7. vel: null,
  8.  
  9. gravityFactor: 0,
  10.  
  11. // bounce a little less
  12. bounciness: 0.6,
  13.  
  14. // add animation sheet of sprites
  15. animSheet: new ig.AnimationSheet('media/sprites/burnpix.png',1,1),
  16.  
  17. init:function( x, y, settings ){
  18. // add ember animation
  19. this.addAnim( 'idle', 0.3, [0,1,2,3] );
  20.  
  21. // update random velocity to create starburst effect
  22. this.vel = { x: (Math.random() < 0.5 ? -1 : 1)*Math.random()*100,
  23. y: (Math.random() < 0.5 ? -1 : 1)*Math.random()*100 };
  24.  
  25. // send to parent
  26. this.parent( x, y, settings );
  27. }
  28. });

I have a complete walkthrough at clokwork.net and the source code for a game using these effects, PiSpace, and the particle.js entities are on GitHub.

Please email me with any questions if you like.

This is just a sample. Hit the links for the complete code.


Contributed by:
clok
View Profile
Category:Game Elements
Updated:March 15, 2012
Rating:
Your Rating (0)
Average Rating (5)
Ready to get to the point?

Your Email will remain private and is only used for good. We promise!


Please use only letters, numbers or underscores.

SIGN UP!