webgl - 深入考虑 Stencil

Question

我正在使用正交投影来绘制我的对象。每个对象项都被添加到不同的缓冲区并在几个周期中被绘制。假设每个对象都有一个轮廓正方形并填充正方形（以不同的颜色）。所以我先画所有的填充物，然后画轮廓。

我正在使用深度缓冲区来确保轮廓不会超过所有填充，如图所示

现在我面临一个问题，即每个对象上都包含另一个绘图项目（例如文本 - 点），它可能比这个正方形更长。所以我使用模板缓冲区在正方形上切割这个额外的绘图。虽然，这样做时没有考虑深度缓冲区。这意味着可以在另一个正方形上绘制一个文本项。如下图所示。

有没有办法让它发生？

Answer 1

您应该能够为每个正方形将模板缓冲区设置为不同的值（假设有 <= 255 个正方形，因为您将无法获得超过 8 位的模板缓冲区）。将模板值配置KEEP为未通过深度测试的像素，从而保留由更靠前但较早绘制的四边形写入的任何模板值。

这将允许单独剪切每个文本。

另一种方法是仅使用深度缓冲区并将当前四边形的像素范围传递到文本像素着色器中，您可以在其中丢弃任何额外的像素。这需要较少的状态更改。