Fix for GridMaterial's bright line intersections

For the GridMaterial, the places where grid lines intersect was too bright and it was really annoying me LOL, like below.

GridMaterial with default settings: https://playground.babylonjs.com/#2KKVBH#113

Currently the contribution of each axis is added together. If instead we use the max axis contribution then the issue of overlapping lines being too bright is resolved. :slight_smile:

Below is from the same playground using the updated GridMaterial.

Here’s a PR to update GridMaterial’s fragment shader with this fix.

Also here’s the NME grid material updated with this fix as well. :beers:

2 Likes

cc @sebavan

I kinda liked the dots :slight_smile:

joking aside I think this is a breaking change and I wonder if you could add it under a special #define ?

1 Like

Okay I’ll model it after fogEnabled with a define and property then. Hmm what to call the flag thou, maxAxisEnabled?

1 Like

I am super dumb with names… :slight_smile:

could be as simple as

#ifdef MAXLINES
    // Create the grid value from the max axis.
    float grid = clamp(max(max(x, y), z), 0., 1.);
#else
    float grid = clamp(x + y + z, 0., 1.);
#endif

and MAXLINES would map to a property named as you see best fit :slight_smile:

2 Likes

Yep that’s what I was thinking too, then model the property mapping after fogEnabled. :slightly_smiling_face: Maybe just maxLinesEnabled for the name then unless inspiration strikes. :wink:

2 Likes

Okay all done (I think). I went with calling the property useMaxLine and distinguished it from using the sum of the lines for the documentation. :slight_smile:

1 Like

Nailed it, thanks a lot !!!

1 Like

Oops I realized that I forgot to add anything for this property, useMaxLine, to the documentation guide, so I just added a little section and PG to the list of notes for the GridMaterial properties, to hopefully make it more clear when it might be useful. :slight_smile:

3 Likes