SeanPatrick

Hi OBUBlake, I'm learning about the project (https://codepen.io/sanprieto/pen/XWNjBdb). Only for particle animation, the code should be positioned at line 183 ~ 275. How could we use GSAP to animate the position movement only? The snippet code as follows. Please correct me, if I get wrong about the code. Thanks. const t = Math.atan2( dy, dx ); px += f * Math.cos( t ); py += f * Math.sin( t ); pos.setXYZ( i, px, py, pz ); pos.needsUpdate = true; px += ( initX - px ) * this.data.ease; py += ( initY - py ) * this.data.ease; pz += ( initZ - pz ) * this.data.ease; pos.setXYZ( i, px, py, pz ); pos.needsUpdate = true;

Hi OSUBlake, Thanks for reply. If the flowing effect, like the last one, is impossible to animate with GSAP, how about moving particles randomly, like the attached picture. The function used is quit easy, like Math.random(). Can GSAP animate the moving path, making thousands of particles move smoothly when a mouse event triggered? If possible, is there any example for reference? I just tried this following code. But, it did not respond. TweenMax.to(IntersectionPoint, 3, {x: (original_point_x + Math.random( time ) +100), y: (original_point_y + Math.random( time ) + 100),z: (original_point_z + Math.random( time ) + 100), ease:Ease.easeOut}); Thanks.

Hi there, could you please teach me how to use Gsap to animate the particles movement with a mouse move event, using Three.js? I searched the internet and only found a few complicated projects like the attached file. But, it's hard to find an easier example using GSAP. Is it possible to move such a great number of particles with Gsap? Thanks.