CatmullRomCurve3 question regarding having different color lines between each point

Questions
,
1

Hi Team,

Is there way to change the color of each line segment drawn between each point.
For example in the example below i want to draw a blue line between the first and second vectors and a yellow line between the second and the third vector.
const curve = new THREE.CatmullRomCurve3( [
new THREE.Vector3( -10, 0, 10 ),
new THREE.Vector3( -5, 5, 5 ),
new THREE.Vector3( 0, 0, 0 ),
new THREE.Vector3( 5, -5, 5 ),
new THREE.Vector3( 10, 0, 10 )
] );

I already know how to have a single color for all the connections in the above CatmullRomCurve3. But dont know if it is possible to have multi col;or lines between the points.

Thanks in advance
Siamak

2

Yes, it is possible. Three.js curves have no colors, but after you create the geometry, you can add a color buffer attribute to the geometry and turn on the vertexColors property in the material. Thus you may have individual color of each vertex. Then color the vertices of each fragment with the desired color:

image
image914×410 10.6 KB

Also: this might help

2 Likes
3

Thanks @PavelBoytchev for the answer. I will give it a try.