How to draw disconnected lines? (Array of lines)

Questions
1

Good morning everyone, I’m new at three, at js and here too. I am not fluent in English, so I apologize for any mistake.
I’m trying to draw disjoint lines in three.js however the only thing I found was on solid lines.
It is necessary to divide a screen recursively in half so that the first division generates 2 new screens, and these new screens are divided and continue to a stop criterion. It turns out that I can only draw lines together that are interconnected.
How would I design an array of rows, where at each iteration I could add a new row?

var material = new THREE.LineBasicMaterial({ color: 0x000000 });

var geometry = new THREE.Geometry();

geometry.vertices.push(new THREE.Vector3(0, -height/2, 0));
geometry.vertices.push(new THREE.Vector3(0, height/2, 0));
geometry.vertices.push(new THREE.Vector3(0, 0, 0));
geometry.vertices.push(new THREE.Vector3(width/2, 0, 0));


var line = new THREE.Line(geometry, material);

scene.add(line);

renderer.render(scene, camera);
2

Use LineSegments for this.

Example: https://jsfiddle.net/q7dyap1y/

2 Likes
3

@Mugen87 updated your fiddle since I think @viniciozz is trying to draw lines to divide up the screen.

https://jsfiddle.net/q7dyap1y/1/

2 Likes
4

Thanks for you help man, i got to do my job :slight_smile:

5

thanks! I succeeded

1 Like