[SOLVED] Color each point in different color Threejs

Color each point in different color Threejs

I have points and color (r, g, b). I need to use one color for one point. I did this

    const vertices = new Float32Array(data.points);
    const colors = new Float32Array(data.colors)
    geometry.setAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) );
    geometry.setAttribute( 'color', new THREE.BufferAttribute( colors, 3 ) );
    const material = new THREE.PointsMaterial({color: colors});
    const pointCloud = new THREE.Points( geometry, material)
    this.scene.clear();
    this.scene.add( pointCloud );
    this.renderer.render(this.scene, this.camera);

In this way, I get white points. If I use:

const material = new THREE.PointsMaterial( { vertexColors: true } );

I got this error:

[.WebGL-0x2e2bb1a84c00]GL ERROR :GL_INVALID_OPERATION : glDrawArrays: attempt to access out of range vertices in attribute 1

Solution

Thank you:) First of all, I need to use colors from 0 to 1 (not 0 to 255). Then I needed to get arrays with the same length. And I needed to use { vertexColors: true }.