Grass rendering

Posted on:February 21 2014

There are several ways for rendering grass in 3D graphics, in real time. The method shown below is one of these, a particular simple one:

As you can see, we simply create a few randomly distributed polygon 'crosses' with a grass texture on it, and that's it already. In the image above, I made about half of them solid instead of transparent - that's why they are black - so that you can see easier how they look like.
It looks quite convincing in action, especially if you are using a view from the perspective of a standing person, for example:

You will be probably using a lot of grass and plant patches, probably even a few thousands of them. So making each grass patch an invidual object isn't very efficient, it would be nicer to be able to draw the whole grass with a single drawing call. Which would be a 1000 times faster in this case, which would be nice, right?
In the example above, the grass patches are all one single object, and all grass patches are drawn in one call. Unfortunately, this has a slight disadvantage:

As you can see as marked in the red circles, the order of the individual patches isn't correct anymore, since all grass patches are now one single object and drawn carelessly without special treatment with one drawing call. On the screenshots, this might not look that bad, but in movement, this looks really horrible. Basically, grass patches from the back randomly are drawn in front of other ones which are nearer to the viewer.

Fortunately, there is a very simple workaround possible for this: Simply disable alpha blending, and in the fragment shader discard the pixel drawn based on the alpha value of the input texture. In GLSL, the following simple lines do this for you, added to the back of your shader program:
if(gl_FragColor.a < 0.5)

I've now implemented a feature like this also in CopperCube, for all rendering targets (D3D, OpenGL, WebGL, Flash/AGAL, Android). You will be able to find it in the advanced material settings, in the upcoming free update:

I'm not sure how to name this feature, "No alpha blending, render order independent" is probably a bit too technical?

Anyway, with this, it is easily possible to add grass patches, plants and other alpha channel based fake geometry like for example grating and similar. This is a small, but very useful addition in my opinion. This is also exactly how I did the grass in Endtime at Home:

... which still could need a bit of improvement, I think. It still looks a bit too uniform, but - ok - that not the fault of the technique used. :)


About the name thing, this technique is called "alpha testing":
Really good and easy solution.
2014-02-21 12:50:00

Yes, maybe, would be simple that way.
2014-02-21 18:03:00

find ich super das zur Wiederentdeckung der Erde ein Spiel kommt!
2014-02-22 18:32:00

Add comment:

Posted by:

Enter the missing letter in: "In?ernational"




Possible Codes

Feature Code
Link [url] [/url]
Bold [b]bold text[/b]
Quote [quote]quoted text[/quote]
Code [code]source code[/code]