drawcall / Proton

Javascript particle animation library
https://drawcall.github.io/Proton/
MIT License
2.41k stars 275 forks source link

custom behaviour function - change color of single particle on applyBehaviour #10

Closed greynor closed 8 years ago

greynor commented 9 years ago

Hello, I just stumbled upon an interresting problem.

Let me describe the frame:

Split the canvas in 4 parts with a horizontal and vertical centered line. When a particle enters one of the 4 areas, it should change it's color.

I tried using particle.color = xxx, I tried adding a behaviour with particle.addBehaviour(new Proton.Color(color, color)); Any ideas?

emitter.addBehaviour(customBehaviour());

customBehaviour = function() { return { initialize : function(particle) { particle.alpha = 0; }, applyBehaviour : function(particle) { if (particle.energy <= particle.age/10) { particle.alpha = particle.energy; } else { particle.alpha = particle.age/10; } var cx = canvas.width / 2, cy = canvas.height / 2, color; if (particle.p.x <= cx) { color = "#ffffff"; if (particle.p.y > cy) { color = "#ff0000"; } } else { color = "#00ff00"; if (particle.p.y > cy) { color = "#0000ff"; } } particle.color = color; } } }

Thanks for your help!

drawcall commented 9 years ago

your method is very nice! Some of my advice, if you want to change a color, I think it should be so done;

var color = "#ff0000"; 
var colorBehaviour = new Proton.Color (color); 
emitter.addBehaviour (colorBehaviour); 

color = "#000000"; 
colorBehaviour.reset (color);
greynor commented 9 years ago

Okay so it's only possible to change the color of the emitter, not of a single particle that already exists?