I posted a ground grid shader as an answer to a forum member in another thread. Since that thread has a totally unrelated title, I'm posting a polished version of the shader here to make it easier to find. There are several grid shaders on godotshaders.com but I couldn't find one that actually does it properly.

It's an infinite projective grid with uniform line width, similar to what we have in most 3D apps, easily customizable, can render a grid and/or a checkerboard. I've also attached a demo project below.

Hope you find it helpful.

https://godotshaders.com/shader/infinite-ground-grid/


ground-grid.zip
3kB
17 days later

Why is this not working with a quad mesh? Can you please help me?

Sorry... Its sorted. Thanks for this amazing shader.

  • xyz replied to this.
    a month later

    posted this on godot shaders, reposting here in case it's missed.

    experiencing a weird issue where the projection on the y axis is wrong if the camera is far from the origin. you can test by setting the camera’s z position in the demo project to something like 50 and you’ll see the grid appears much below y 0.

    the camera's fade distance also seems to shorten the further the camera gets from the world origin. when far away, the grid will start fading out much sooner.

    • xyz replied to this.

      joshbromberg Fixed the shader code. Please test it. The fade distance was wrongly calculated from camera instead from origin. Thanks for spotting it.

        xyz it works! thanks for fixing.

        not sure if this is the intended use of it or not, but do you know how i could keep the fade consistent in screen space? when the camera is far away the perceived size of the grid shrinks. i think it would make sense to work this way out of the box since it's supposed to be an infinite grid.

          joshbromberg i've done this myself just by updating the fadeEnd parameter based on the camera position's length (distance to origin)

          • xyz replied to this.

            joshbromberg Yeah, you can update shader parameters based on what the camera is doing.

            2 months later

            Excuse me for being a beginner, but how do I pull this into my project?

            I see it says: "Usage: Assign a shader to a 3D sprite or a quad and put it directly in front of camera so that it covers the entire view." Still, I have no idea how.

            Thank you, great stuff.

            • xyz replied to this.

              vfung Download the attached demo project. It shows a basic setup.

              Yes I did, but I still don´t know how to bring this stuff into my existing project. For example, how do you assign a shader to a node? And where do you put in the code, as it is not a regular attached .gd script? I have not dealt with shaders before. Thx.

              • xyz replied to this.

                Thanks, I managed to create the shader material and pasted the code into the shader editor. However I still don´t see the shader "screen" to place in front of the camera.

                BTW, the shader code was saved into a .gdshader file, but in your project there is no such file, it looks I´m doing something different.

                • xyz replied to this.

                  vfung Try to replicate the node setup from the demo scene. The geometry that has a shader must always be in front of the camera, obscuring the whole camera view. This may seem unintuitive at first but that's how the shader works. It needs full screen "coverage" to draw on.

                  In the demo project the shader resource is embedded in the scene file but this doesn't really matter. It can be saved in a separate file as well.

                  Thank you, I got it work.

                  16 days later

                  Hello again. I would like to turn on/off grid depending on the zoom factor (camera distance). Is there a way to do it? Thx.

                  • xyz replied to this.

                    vfung I would like to turn on/off grid depending on the zoom factor (camera distance). Is there a way to do it? Thx.

                    You can just toggle the visibility of the quad the grid is rendered on, depending on your criteria. Or alternatively, set the alpha component of gridColor parameter to zero. With the latter approach you can even gradually fade it.

                    Thanks xyz, but can you please explain in more basic terms. How do I toggle visibility of the quad?

                    • xyz replied to this.

                      vfung but can you please explain in more basic terms. How do I toggle visibility of the quad?

                      Set node's visible property to true or false from a script.