Three.js: shaderMaterial for Line object

[jpweeks]

My goal is to be able to control a lines vertices and possibly segment colors with custom attributes and shaders. I've seen examples ( http://www.ro.me/tech/demos/8/index.html ) of this done with ParticleSystems, but haven't been able to render lines with similar techniques. This is the basic look I'd like to get, but via shader rather than explicit vertex positions : http://dl.dropbox.com/u/18230908/three_exp/vis_exp_001.html

[alteredq]

Custom attributes are implemented just for meshes and particles so far. I can give a try for lines once we get dev branch to working state.

ShaderMaterial should work I think. Just for line width you would need to manually add linewidth property.

[nosy-b]

I can't manage to make a linewidth larger than 1.
I tried:
var lineBasicMaterial = new THREE.LineBasicMaterial( { color: 0xaaff0f, opacity:1, linewidth:5 } ) // a
var meshBasicMaterial = new THREE.MeshBasicMaterial({wireframe: true, wireframeLinewidth : 5}) // b
var shader_material = new THREE.ShaderMaterial({wireframe: true, wireframeLinewidth : 5}) // c

var lineMesure = new THREE.Line(geometryLinesMesure,/_a or b or c_/,THREE.LinePieces);

Any clue?
thanks!

[alteredq]

@nosy-b https://github.com/mrdoob/three.js/issues/309

[nosy-b]

Thanks!
ok so it's an Angle aspect as I get ALIASED_LINE_WIDTH_RANGE that says "1-1" (http://alteredqualia.com/tmp/webgl-maxparams-test/)
Too bad, maybe I can tell my firefox to use my OpenGL last drivers and don't use Angle rendering backend...

[nosy-b]

In fact yes it's possible :)
in the about:config of firefox I set true to
webgl.prefer-nativ-gl

and now I got wide lines on my windows comp!

[alteredq]

Ok, lines can use custom attributes now:

http://alteredqualia.com/three/examples/webgl_custom_attributes_lines.html

https://github.com/alteredq/three.js/commit/046f4bfeb6753e4a80ab0015b95ba9beeb56f358

[nosy-b]

Huge!
nice example

[jpweeks]

cool, just what I was trying for