Create mesh from edgesRenderer

Questions
1

Hello again again ! :slight_smile:
I’m trying to achieve a snap-to-edges feature.
when approaching an edge of an imported mesh, the pink pointer must jump to the nearest position on the edge.

:point_right: https://www.babylonjs-playground.com/#Q9K825#35

My idea is to take the informations of mesh.edgesRenderer and rebuild the edges with, say meshes ( “cylinderBetweenPoints”) or Rays.

  • When logging mesh.edgesRenderer, I can see the tempting linesIndices and linesPositions properties : How can I (or at least, can I ?) exploit that ?
  • I looked in edgesRenderer.ts and if I got it right, no shape (or line) is created, right ?
2

Hello!

I think the linesPositions is what you need. I guess a pretty naïve solution would be to search that lsit (which is an array of floats (so every 3 floats are x, y,z)) and find the closest one with your pointer

3

Yep, linesPositions stores the corners positions, and that’s great ! https://www.babylonjs-playground.com/#Q9K825#36
But, I don’t know in which order I must connect them to get a correct shape (like the one displayed by .enableEdgesRendering())

Like if I went back from Ikea and the assembly manual is missing …

4

Here is when I try to connect all the points : https://www.babylonjs-playground.com/#Q9K825#37 (click on a mesh)

5

The lines are really triangles, so linesIndices gives you the indices of the 3 vertices of each triangle.

Also, the triangles are degenerated in the linesPositions array:

  • for each line between P1 and P2 you can see on screen you have in fact 4 vertices V0/V1/V2/V3 where V0=V1=P1 and V2=V3=P2
  • the first triangle is V0/V1/V2 and the second one is V0/V2/V3. As V0=V1 and V2=V3, those two triangles are degenerated (so if displayed “as is” you won’t see anything)

It’s the shader used by the edge renderer (Babylon.js/line.vertex.fx at master · BabylonJS/Babylon.js · GitHub) that creates non degenerated triangles at display time by moving the vertices according to the normal so that the triangles have a thickness corresponding to the width parameter you provide to the edge renderer.

In your case, as you only want to draw lines, simply pick the first and third vertex to draw a line between them:

2 Likes
6

Oh finally, it works !

Many thanks for the explanations, @Evgeni_Popov !