custom vertex color with threejs LineSegments() - opengl-es

Question

I am struggling with threejs to use a shaderMaterial on a THREE.LineSegments
my goal is to have per vertex color, on a bunch of line segments:
I have a vertex and a fragment shader :
<script type="x-shader/x-vertex" id="vertexshader">
varying vec3 vColor;
attribute vec3 customColor;
void main() {
vColor = customColor;
}
</script>
<script type="x-shader/x-fragment" id="fragmentshader">
varying vec3 vColor;
void main() {
gl_FragColor = vec4(vColor, 1.0 );
}
</script>
then in the threejs scene , I create all the relevant stuff for the shader, and apply it to the object:
var customColors = new Float32Array(_count*2*3); // 2 vertex by segment *length(RGB)
for (var i = 0; i < customColors.length/3; i++) {
var ratio = i / (customColors.length/3.0);
customColors[(i*3)] = ratio;
customColors[(i*3)+1] = ratio;
customColors[(i*3)+2] = ratio;
};
geo.addAttribute('customColor' , new THREE.BufferAttribute(customColors,3));
var drawCount = _count * 2;
geo.setDrawRange( 0, drawCount );
var uniforms = {
opacity : 0.5
};
var customMaterial = new THREE.ShaderMaterial( {
uniforms : uniforms,
vertexShader : document.getElementById( 'vertexshader' ).textContent,
fragmentShader : document.getElementById( 'fragmentshader' ).textContent,
}
);
var lines = new THREE.LineSegments(geo, customMaterial);
I can't find where the problem is.
The line segments don't appear at all,not even in black.
All I have managed to do is to 'hard code' the color in the fragment shader ( which defeats the purpose evidently).
No error message whatsoever in the console.
please help, what am i doing wrong here ?

Answer 1

After struggling again , I finally can see some line segments with a custom vertex color.
It looks I needed to give a value to the gl_Position variable ( I thought it would automatic, since I don't wan't to change vertex position).
I added this line into main() of the vertexShader:
gl_Position = projectionMatrix * modelViewMatrix * vec4(position,1.0);