GLSL 着色器 - 2D 边缘光照效果

GLSL Shader - 2D Rim Lighting Effect

如何使用 GLSL 创建如下图所示的渐变?

实现从绘制的多边形边缘不透明到中心透明的平滑过渡的最佳方法是什么?

你提到的图像是通过所谓的distance transform实现的。它是一种非常有用和常见的操作,广泛应用于图像处理、计算机视觉和机器人路径计算等。它所做的是对图像的每个像素,计算从该像素到多边形最近边的二维欧氏距离。输出是一个图像,其像素值表示最小距离。为了可视化结果,我们将距离映射到灰度。特别是,在您的参考图像中,亮白色的脊与边界的距离最大,而深色区域包含的值要小得多,因为它们非常靠近多边形边界。

在实现上,比较粗暴的做法是画一张你要变换的二维图片,在fragment shader中,计算当前fragment位置到多边形每条边的距离,输出最小值给帧缓冲区。多边形的几何信息可以存储在另一个纹理中。最终,您会得到一个 2D 纹理,其像素值编码到多边形边缘的最短距离。 您还可以在 OpenCV library.

中找到这种常见的转换实现