Depth sorting and alpha blending "go"

Translation: Li Hunmin

Last modified: 2012-07-03

Original: Depth sorting Alpha blended objects

First off, I wanted to answer a common question on the Creators Club forum, but I didn't get a satisfying answer on the Internet.

The problem itself is simple, but the answer is somewhat complex:

"Why are my transparent objects drawn in the wrong order, or why are some of their parts missing?" ”

When drawing a 3D scene, it is important to sort the graphics in depth, so that objects close to the camera can be drawn on top of objects farther away (from the camera). We don't want the distant mountains to be drawn on top of the buildings that are in sight!

There are three types of deep sorting techniques that are currently widely used:

1. Depth buffer (also known as z-buffering)

2. Painter algorithm

3. Back Reject

Unfortunately, each of these technologies has its limitations. To get good results, most games need to rely on a combination of the three technologies above.

1 Depth Buffer

Deep buffering is a simple and effective method, and when you draw only opaque objects, the results are perfect, but the approach cannot handle transparent objects!

This is because the depth buffer algorithm tracks only the closest pixels drawn so far, which is sufficient for opaque objects. For example, if we need to draw two triangles, A and B:

If we draw in the order of first b followed by a, the depth buffer will find that the new pixel from a is closer than the pixels drawn earlier from B, so it is possible to overwrite the drawing directly. If we draw in reverse order (a after B), the depth buffer will find that the pixels from B are far from the pixels that have been drawn from a, so they will be discarded directly. In either case we will get the right result: A is above, and B is hidden behind.

But what if the object (geometry) is transparent? That is, when part B is visible (through the translucent triangular patches of object a). If we draw according to the order of a before B, we will still get the correct result, but the reverse will be wrong. In the second case, the depth buffer first gets a pixel from B, and then discovers that a closer pixel from a is already drawn, but does not know how to handle the situation. It has only two options: Draw the pixels on B (the result will be wrong, because this will mix the farther of B to a closer a, but the order of alpha blending is non-exchangeable) or the entire B is discarded directly. This is not good!

Conclusion: The depth buffer is perfect for opaque objects, but it is useless for transparent objects.

2 painter algorithm

Since the depth buffer algorithm cannot correctly draw transparent objects in the wrong order, there must be a simple fix, right? As long as we are always guaranteed to draw in the right order! We first sort all the objects in the scene so that we can draw a distant object first and then draw something closer on it, so that the B object in the previous example is always drawn before the A object.

Unfortunately, this is easier said than done. In many cases it is not enough to sort the objects. For example, what happens if A and b intersect each other?

This is likely to happen: for example A is a glass and B is a glass bead that is placed inside. It is not possible to sort them in the right way at all, because part A is closer to B, but the other part is farther away.

We don't even need to use two separate objects to reproduce the problem. What about the triangular patches that make up the glass? To make the result look right, we need to draw the back of the glass before drawing the front of it. So it's not enough just to sort the objects: what we really need is to sort each triangular patch.

The difficulty is that the cost of sorting each triangular patch is extremely expensive! And even if we can afford it, it's not enough to ensure that the right results can be drawn in all cases. For example, how do two transparent triangles intersect each other?

There is no way to sort these triangles, because we need to draw the upper part of B to the front of a, and draw the lower half of it behind a. The only solution is to split the triangles where they intersect at the time of detection, but the cost of doing so is too high.

Conclusion: The painter algorithm requires you to weigh the granularity of the order. If you sort only a small number of large objects, the algorithm will be very fast but not very accurate; Conversely, if you sort a large number of small objects (the limit is to sort the triangular patches), the algorithm will be slow but more precise.

3 Back Reject

It is not generally considered that back culling is a sort technique, but in fact it is indeed an important (sort) method. Its limitation is that it only applies to convex bodies.

Consider a simple convex body, such as a sphere or a cube. No matter what angle you look at it, each screen pixel will be precisely covered two times: one at a time by the front of the object, and the other is covered by its back. If you discard the triangular patches on the back of the object using the back, then only the front is left. Ha ha! If each screen pixel is only overwritten once, you will automatically get the perfect alpha blending result without any sorting.

Of course, most games will not just draw a sphere or cube:), so the back culling itself is not a complete solution.

Conclusion: The back culling is perfect for the convex body, but there is nothing else to do about it.

4 How do I make the game look better?

The most common methods are:

1. Set depthbufferenable and depthbufferwriteenable to True

2. Draw all opaque objects (geometry)

3. Keep Depthbufferenable=true, but modify Depthbufferwriteenable=false

4. Sorts the object by its distance from the camera, and then draws it from the backward forward order

This approach relies on the combination of the three sorting techniques described above:

• Opaque objects using depth buffer sorting

• Transparent objects and opaque objects are still deeply buffered (so you never see a transparent object through an opaque object)

• The painter's algorithm sorts the transparent objects according to their relative relation (if two transparent objects intersect, it causes sort errors)

• Relies on back culling to sort all triangular patches on a single transparent object (if the transparent object is not a convex body it causes a sort error)

The results are not perfect, but they are very effective and easy to implement, and are good enough for most games.

There are many ways to improve the accuracy of sorting:

Avoid Alpha Blending ! The more opaque objects you have, the easier and more accurate it is to sort. Do you really need to use alpha blending in every place? If your level design needs to add another layer to the window, can you consider modifying the design to make it easier to implement? If you are using alpha blending to implement cropping (cut-out) graphics such as trees, can you consider using an alpha test instead? is simply to consider accepting/rejecting both cases so that the accepted pixels are not transparent and can still be sorted using deep buffering.

relax, don't be nervous . Maybe the sort errors are actually not that bad? Maybe you can try adjusting the graphics card (making the alpha channel softer and more translucent) so that the sorting errors don't look so obvious. Using this approach in our 3D particle sampling, we did not attempt to sort the particles in a single smoke, but instead chose a particle texture to make it look OK. If you change the smoke texture to more opaque, then the sorting error becomes more pronounced.

If your Alpha blend model is not convex, perhaps you can try to change them more "convex" ? Even if the convex body is not perfect, the fewer the sort errors will be if the closer they are to the convex body. Consider splitting a complex model into multiple parts that can be sorted independently. A mannequin, for example, is not a convex body at all, but if you split it into a torso, head, arm, and so on, each part can be approximated as a convex body.

If your texture matte (texture masks) is basically used for on/off cropping (cut-outs), but the edge part has some transparent pixels for anti-aliasing, you can use the dual pass rendering technique:

• Pass 1: Draw Opaque part: Turn off alpha blending, and alpha test only accepts 100% opaque areas, depth buffer on (supplemental: Deep Write on)

• Pass 2: Draw Edge section: Turn on alpha blending, and alpha test only accepts alpha < 1 pixels, depth buffer on, deep write off

At the cost of drawing objects two times, this method provides 100% correct depth buffer ordering for the middle opaque portion of the texture, as well as a relatively accurate semi-transparent edge partial ordering. This is a good way to do some anti-aliasing on the edges of the texture clipping, and also take advantage of the advantages of deep buffering to avoid additional sorting of individual trees or grass blades. We used this technique in Billboard sampling: Refer to the comments and effect passes sections in billboard.fx.

Use Z prepass. This is a very good technique when you need to fade out of an opaque object in a normal state and don't want to see its far end through its own proximal part. If you look at a human body from the right. If it is made of glass, then you will expect to see the torso and left arm through its right arm. But if it is a physical person throughout the fade-out (opaque, perhaps ghostly, or is being transmitted, or being reborn after death), you will expect to see only the transparent right arm part, and the background behind it, without seeing both the torso and the left arm. To achieve this effect, you need:

• Set Colorwritechannels=none, and enable depth buffering

• Draw object to depth buffer (without affecting color buffering)

• Set Colorwritechannels=all, depthbufferfunction=equal, and enable alpha blending

• Redraw the object, when only the nearest end of the object is blended into the color buffer

Depth sorting and alpha blending "go"