Wireframe hidden line shader?

Does anyone here know of (or know how to write) a shader for Babylonjs that renders objects like this? image
So, render edges and hide those covered by objects in front.

Alternatively, do you know of a simple wireframe shader? The edge render function in Babylon is way too slow for my complex meshes unfortunately.

Thanks!

1 Like

Hey
by default all material can render using wireframe: material.wireframe = true but this will render all triangles.

To answer your questions, I think it is more a geometry work and less a shader work. You need to create a LinesMesh for your meshes that will only contains the ā€œfacesā€ you want and then rendering can be done by the LinesMesh itself

1 Like

Thanks, Iā€™ve already used the wireframe = true, but thereā€™s very little control over how the lines are displayed unfortunately (at least I couldnā€™t fine e.g. a width attribute to pass through to the material?). In a dense mesh it really doesnā€™t work too well.
I also tried enableEdgesRendering but that is crazy slow. I mean crazy slow. I remember reading that it somehow computes the rounding of edges and creates the lines based on that or something?

This is right and this is the only way we (because we have no idea of your geometry) can find the edges.

This is why I told you to use LinesMesh and build your own lines as you know your geometry

2 Likes

Makes sense. Guess Iā€™ll have to sit down and write something that builds the linemeshesā€¦

1 Like

As an alternative, you can also try using a Sobel/Canny edge detector, and draw just where your edges are detected (and everything else transparent). That way you donā€™t get the occluded lines of your mesh.

Hereā€™s a simple GLSL script that may get you around 33% there:

1 Like

@Drigax thanks that actually works really well!

So I guess Iā€™ll eventually write some line-geometry function as above but until then, the sobel post process is a very fast standin!

1 Like

Hi

Your illustration show cubes but you say your meshes are complex.

I think you supplied a simple example to illustrate your need but actually you are thinking more complex?

I am also interested in this area, I would like it for my Babylon project.

I used to work as a developer on a major CADCAM software engine used under the hood in the majority of high end solid modellers and we had a hidden line removal algorithm. I am interested in hidden line removal in my project.

You might think ā€œGreat someone who knows about thisā€ but hold your enthusiasm :grin: its been 15 years since I worked in this area and I am dusty and rusty and in addition we were working with stuff like bspline surfaces not triangular meshes, we had a topology structure way in advance of the topology ā€˜structureā€™ found in meshes, the module was a huge chunk of code developed over decades by a team of full time developers.

I am not sure that knowledge (or rather what I can actually remember of it :woozy_face:) will actually be that much help on mesh hidden line removal and in addition we were not dealing with planar mesh geometries - I am kind of tempted to play around, look at research papers and dabble, see what turns up.

In general the issues tend to be.

  1. Near coincidence - resolution issues - maths that breaks down due to precision issues.
  2. Brute force methods are the most reliable but slow.
  3. Optimisations often involve applying results calculated in one place to make inferences in another - downside tends to be error propagation which is why brute force methods have their fans.
  4. You do not need horrible triangles to encounter horrible problems - a large set of connected triangles that are nearly but not quite co-planar when seen ā€˜end onā€™ will generate resolution issues.

I do not mean this as a gloom and doom - its really just my two cents worth seeing your simple cube example and your statement that your meshes are complex.

Hi flipswitchingmonkey.

If you are still interested.
I started an experiment coding for hidden line removal.
The code changes like inside the BablyonJS code - first time I have tried altering BabylonJS itself.
I am unsure myself about the results but I suspect your cube example would render very well.

Anyway the thread is hereā€¦its very long - just scroll down to the pictures first to see if its of any interest.

=====================================================

======================================================

I am not sure myself where this is going - it may be the case that very few people want this, the limitations are too severe and that on balance people feel its not worth the upheaval of adding new functionality and options and doc etc.

Right now I am kind of resting on the first step and kind of waiting for my own opinions to catch up.

1 Like