How can I render a model and its wireframe at the same time?

[zzzen]

When wireframe is enabled, the model becomes transparent. https://www.babylonjs-playground.com/#IUKB9V

I want the model to be solid in wireframe mode, like this demo with "See Through" disabled.

[SvenFrankson]

Hi,

It can work if you use "edgeRenderer" on the mesh, instead of wireframe on the material.

https://www.babylonjs-playground.com/#IUKB9V#2

(also, there's a call to "convertToFlatShaded()", otherwise some non-seam edges might be invisible)

[zzzen]

Thanks for your suggestion, but "EdgeRender" is really slow when the model has millions of vertices, it takes about one minute to calculate edges. @SvenFrankson

[Guest]

Or you can clone the mesh and render one in wireframe on top of the solid one

[zzzen]

I've tried

wireframeMesh.scaling = new BABYLON.Vector3(1.01, 1.01, 1.01)

But it doesn't work well because these two meshes will collide everywhere. @Deltakosh

[Wingnut]

Hiya zzzen.  You might need to set the wireframe "overlay" mesh... .checkCollisions = false;  Or, if physics-colliding, make sure it has no physics impostor.

You might also want to set the wireframe mesh.parent = actual mesh.

[dbawel]

@zzzen

Why not utilize line2d to draw lines using an array of your mesh's vertices'? This will give you variables to customize as well, and it can be dynamic in many other ways.

DB

[Guest]

@zzzen: You just need to set this: wireframeMesh.material.zOffset = 1. This will avoid the depth fight

[zzzen]

wireframeMesh.material.zOffset = 1

It works like a charm. You guys are really awesome. Thanks!

[Eranda]

In the Inspector Pane, under the Properties Tab and then in Debug, there is the option to "Render wireframe over mesh". Is it possible to access this feature programmatically?

[Guest]

We have a new forum: forum.babylonjs.com