Using Instancing for EdgeGeometry / LineSegments

I want to draw many EdgeGeometries, so I want to use Instancing to get better performance.
For a normal Mesh its pretty straightforward with InstancedMesh.

How can I do the same with LineSegments?
When I use something like new InstancedMesh(edgeGeo, someMaterial)

Here is a clean fiddle with a normal LineSegment:

How do I make multiple EdgeGeometries/LineSegments with instancing?

Hi!
Feel free to search the forum: Use EdgesGeometry in an InstancedMesh

1 Like

Thank you for the link. Is it also possible to achieve this without a shader program?
I want to set the edges on the same position as a normal mesh to get the edges drawn like in this example: https://jsfiddle.net/Browork/pjnsgk0o/16/
I’m searching for a relativly simple solution that has good performance/loadtime with for example 1000 meshes/cylinders

AFAIK, there is no way to achieve it without modifying of shaders, unfortunately. As lines and points have no implemetation of instancing.

1 Like

@Deel96
Just an example:

Though, maybe there is a way to re-use the data from .instanceMatrix property of InstancedMesh, but I didn’t get how to make it.

3 Likes

Thanks for the example ! What I don’t understand is why I can’t set the position directly on the Buffgergeometry in javascript?

I also struggle, when the cylinders have different sizes and rotation:

Just an option: https://codepen.io/prisoner849/pen/XWKYLqW?editors=0010

4 Likes

@prisoner849 Haven’t got a notification. Looks amazing! :slight_smile:

1 Like