Three JS non-display pieces

Question

I am trying to create lines with a dashed pattern, but somehow the material does not reflect on the line I am creating, and I just don’t see what I am doing wrong here ...

I use the code from this example, which should produce this:

When I take the following code:

var geometry = new THREE.Geometry();
geometry.vertices.push(new THREE.Vector3(0,0,0));
geometry.vertices.push(new THREE.Vector3(100,0,0));

var material = new THREE.LineDashedMaterial({ color: 0xffaa00, dashSize: 3, gapSize: 1, linewidth: 2 });

var mesh = new THREE.Line(geometry, material);
scene.add(mesh);

This is what I get:

Any hint would be appreciated!

Answer 1

geometry.computeLineDistances();

http://threejs.org/docs/#api/core/Geometry

.lineDistances

An array containing the distances between the vertices for the Line geometry. This is necessary for rendering LinePieces / LineDashedMaterial. Line distance can also be generated using computeLineDistances.

Answer 2

Three.js , Derte Trdelnik .

Geomerty.Line.computeLineDistances()

https://threejs.org/docs/index.html#api/objects/Line.computeLineDistances