Deep sorting and Alpha Mixing

Translation: Li Xianmin

Last modified: 2012-07-03

Original article: Depth sorting Alpha blended objects

I wanted to answer a frequently asked question on the creators club forum, but I couldn't find a satisfactory answer on the Internet.

The answer is simple, but the answer is complicated:

"Why is the order of drawing transparent objects wrong, or why are some of them missing ?"

When drawing a 3D scene, it is very important to sort the images in depth. Only objects close to the camera can be drawn on objects farther away from the camera. We do not want the distant mountains to be drawn on the building close to our eyes!

Currently, there are three deep sorting technologies widely used:

1. Deep buffer (also called Z-buffering)

2. Painter Algorithm

3. Remove back

Unfortunately, each technology has its limitations. Most games rely on the combination of the above three technologies to achieve good rendering results.

1. Deep Buffer

Deep buffering is a simple and effective method. When you draw only opaque objects, the rendering results are perfect, but this method cannot process transparent objects!

This is because of deep buffering.AlgorithmTracking only records the recent 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 from B first and then a, the depth buffer will find that the new Pixel from a is closer than the previously drawn pixel from B, so we can directly overwrite the painting. If we draw the image in the reverse order (First A and then B), the depth buffer will find that the pixels from B are much farther than those from, therefore, they will be discarded directly. In either case, we will get the correct result: A is on top, and B is hidden behind.

But what if the object () is transparent? That is, when Part B of an object is visible (through the translucent Triangle Surface of object ). If we plot it in the sequence of B and A, we will still get the correct result, but vice versa, we will get an error. In the second case, the depth buffer first obtains a pixel from B, and then finds that a recent pixel from a has been drawn, but does not know how to deal with this situation. There are only two options: Draw the pixel on B (the result will be wrong, because it will mix the farther B to the closer, but the order of alpha blending is not interchangeable) or B is directly discarded. This is not good!

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

2 painter Algorithm

Since the deep buffer algorithm cannot correctly draw transparent objects in the wrong order, there must be a simple correction method, right? As long as we always make sure to draw in the correct order! We first sort all objects in the scenario, so that we can first draw objects in the distance and then draw closer objects on them, this ensures that the B object in the preceding example is always drawn before the object.

Unfortunately, this is easy to say. In many cases, sorting objects is not enough. For example, what should I do when a and B cross each other?

This situation is likely to happen: for example, a is a glass and B is a glass bead placed in it. At present, they cannot be sorted in the correct way, because part of A is closer than B, but the other is farther away.

We don't even need to use two separate objects to reproduce this problem. How to deal with the triangle surface that makes up the glass? To make the results look correct, we need to draw the back of the glass before drawing the front of the glass. Therefore, sorting objects is not enough: what we really need is to sort every triangle.

The difficulty is that sorting each triangle is extremely expensive! And even if we can afford this price, this is not enough to ensure that we can get the correct rendering results in all circumstances. For example, how can we deal with the intersection of two transparent triangles?

There is no way to sort these triangles, because we need to draw the upper half of B before a and the lower half of B behind. The only solution is to split these triangles at their intersection when detecting this situation, but this is too costly.

Conclusion: The Painter algorithm requires you to weigh the granularity of sorting. If you only sort a small number of large objects, the algorithm will be very fast, but the accuracy is not high; otherwise, if you sort a large number of small objects (the limit is to sort the triangle surface ), the algorithm is slow but more accurate.

3 Remove the back

People usually do not think that backend removal is a sorting technique, but in fact it is indeed an important (sorting) method. It is only applicable to convex surfaces.

Consider a simple convex body, such as a sphere orCubeBody. No matter which angle you look at it, each screen pixel is precisely overwritten twice: one is overwritten by the front of the object, and the other is overwritten by the back of the object. If you use the backend to remove the triangle surface on the backend of the discarded object, only the front is left. Haha! If each screen pixel is overwritten only once, you will automatically get the perfect alpha blending result without any sorting.

Of course, most games won't just draw a sphere or cube :), so removing the back is not a complete solution.

Conclusion: the removal of the back is perfect for Convex Bodies, but it is powerless for others.

4. How can I make the game look better?

The most common method is:

1. Set depthbufferenable and depthbufferwriteenable to true.

2. Draw all opaque objects ()

3. Keep depthbufferenable = true, but modify depthbufferwriteenable = false

4. Sort the object by its distance from the camera and draw the object in the order of forward and backward.

This method relies on the combination of the preceding three sorting technologies:

• Non-transparent objects are sorted using depth Buffering

• Transparent objects and opaque objects will still be processed in depth buffering (so you will never see a transparent object through an opaque object)

• The painter algorithm sorts transparent objects based on the relative relationship of objects (if two transparent objects intersect, the sorting will be incorrect)

• Sort all triangles on a single transparent object by removing the back (if the transparent object is not a convex body, it will cause a sorting 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 sorting accuracy:

AvoidAlpha blending!The more opaque objects you have, the easier and more accurate the sorting. Do you really need to use alpha blending everywhere? If your level design requires an additional layer of glass windows, can you consider modifying the design to make it easier to implement it? If you are using alpha blending to implement cut-out images such as trees, can you consider replacing them with Alpha test? Simply consider accepting/rejecting two situations. In this way, the received pixels can still be sorted using deep buffering because they are not transparent.

Relax, don't be nervous. Maybe the sorting error is actually not that bad? Maybe you can try to adjust the video card (to make the alpha channel softer and more translucent) so that the sorting error does not look so obvious. We used this method in our 3D particle sampling. Instead of trying to sort the particles in a single smog, we chose a particle texture to make it look OK. If you change the smoke texture to a more opaque one, the sorting error will become more obvious.

If your Alpha hybrid model is not convex, you may tryThe change is more "convex"What about it? Even if they are not perfect Convex Bodies, as long as they are closer to the Convex Bodies, there will be fewer sorting errors. Consider splitting a complex model into multiple parts that can be sorted independently. For example, a human body model is not a convex body in any case, but if you split it into a trunk, Head, arm, etc., then each part can be considered as a convex body.

If your texture mask (texture masks) is basically used for cut-out (cut-outs), but some transparent pixels in the edge are used for anti-spam, you can use the Double Pass rendering technology:

• Pass 1: draws the opaque part: disables alpha blending, and Alpha test only accepts the 100% opaque area, enabling the depth buffer (Supplement: Enabling deep write)

• Pass 2: Draw edge part: Enable alpha blending, and Alpha test only accepts pixels of Alpha <1, depth buffer is enabled, and deep write is disabled

At the cost of drawing an object twice, This method provides 100% correct depth buffer sorting for the opacity in the middle of the texture, and relatively accurate sorting of translucent edge parts. This is a good method. It not only reverse the edges of texture cropping, but also avoids the extra sorting of individual trees or grass leaves. We used this technique in billboard Sampling: See comments and effect passes in billboard. FX.

Use Z Prepass. This is a good technique when you need to fade out an opaque object in a normal state and do not want to see its remote part through its own near-end part. Let's look at a person from the right side. If it is made of glass, you will expect to see the trunk and left arm through its right arm. But if it is a real person throughout the fade-out process (not transparent, maybe a ghost, or being transmitted, or being reborn after being killed ), you will expect to see only the transparent right arm and the background behind it, rather than the trunk and left arm at the same time. To achieve this effect, you need:

• Set colorwritechannels = none and enable deep buffering.

• Draw an object to the depth buffer (but it does not affect the color buffer)

• Set colorwritechannels = All, depthbufferfunction = equal, and enable alpha blending

• Re-paint the object. Only the nearest side of the object will be mixed into the color buffer.