Closed daviestar closed 4 years ago
Hey,
I have a project based on this demo where you render an Image to Canvas then run Proton.ImageZone() to get particle zones.
Proton.ImageZone()
Problem is, no matter what I try, I can't get the particles to respond to a window resize, and recenter in the canvas. What I'm trying is:
On window resize, I set an origin object with x and y values of half the window width and height.
origin
x
y
function customToZoneBehaviour() { return { initialize : function(particle) { particle.old.origin = { x: origin.x, y: origin.y }; particle.R = Math.random() * 10; particle.Angle = Math.random() * Math.PI * 2; particle.speed = Math.random() * (-2) + 1; particle.zones = zones.map(function(o) { return o.getPosition().clone(); }); }, applyBehaviour : function(particle) { particle.v.clear(); particle.Angle += particle.speed; zoneX = particle.zones[curZone % totalZones].x + particle.R * Math.cos(particle.Angle); zoneY = particle.zones[curZone % totalZones].y + particle.R * Math.sin(particle.Angle); particle.p.x += (zoneX - particle.p.x) * 0.15; particle.p.y += (zoneY - particle.p.y) * 0.15; //TODO: responsive to center particle.p.x = particle.p.x + ((origin.x - particle.old.origin.x) / 2); } }; }
This always moves too far in the correct direction. I suspect because it is transitioning and not simply moving to the desired coordinates.
So is there a way to move a particle to new coordinates without a transition?
Thanks
Hey,
I have a project based on this demo where you render an Image to Canvas then run
Proton.ImageZone()
to get particle zones.Problem is, no matter what I try, I can't get the particles to respond to a window resize, and recenter in the canvas. What I'm trying is:
On window resize, I set an
origin
object withx
andy
values of half the window width and height.This always moves too far in the correct direction. I suspect because it is transitioning and not simply moving to the desired coordinates.
So is there a way to move a particle to new coordinates without a transition?
Thanks