Hello guys, I will appreciate any ideas on how to implement the blue line component you can see on the image below. [image] The problem is with the arrows which are animated, and are moving from one point to the other to show the direction of the path. For now I have implemented only a blue line …

you could do this with a texture and now you animate the map.offset.x, like so Cards with border radius - CodeSandbox i don’t think three line2 (which is what drei/line uses) can have textures though, it would probably have to be meshline. here’s an example using meshline + texture https://codesand…

Help with implementing an animated line component

Questions

hofk August 1, 2024, 9:17am 2

So similar ? AnimatedConveyorBelt

(from the Collection of examples from discourse.threejs.org )

1 Like

Topic		Replies	Views
How to implement drawing line animation Questions react-three-fiber , react-threedrei	11	3231	June 9, 2023
Connecting Two Points in 3D Space Using a Shader-Generated Line in Three.js Questions textures , geometry , animation	0	60	November 3, 2024
Update Edges from react-three/drei when shape changes Questions line , react-three-fiber , edgesgeometry , r3f	0	30	March 10, 2025
The canvas is empty! Questions shaders , animation	2	872	March 18, 2022
Just Created my personal Webpage! Showcase materials , shaders , threejs , gsap , react-three-fiber	1	759	October 12, 2022

Help with implementing an animated line component

Related topics