Opengl es 根据距离最近边的函数对矩形着色会在对角线上产生奇怪的结果

我尝试在ShaderToy/GLSL中根据每个像素到最近矩形边的距离为矩形着色。然而，在其对角线上可以看到一个奇怪的（较暗的）结果：

我使用的是矩形UV坐标，代码如下：

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    // Normalized pixel coordinates (from 0 to 1)
    vec2 uv = fragCoord/iResolution.xy;

    vec2 uvn=abs(uv-0.5)*2.0;
    float maxc=max(uvn.y,uvn.x);

    vec3 mate=vec3(maxc);

    fragColor = vec4(mate.xyz,1);
}

如您所见，错误似乎来自

max（uvn.y，uvn.x）代码行，因为它不会像人们期望的那样平滑地插值颜色值。为了进行比较，这些是通过对uvn.y和uvn.x进行采样而获得的图像，而不是这两者之间的最大值：



您可以在以下URL处使用着色器：
你能看到的效果是视错觉。可以通过对颜色进行分级使其可见。请参阅问题的答案

为了获得更好的结果，可以使用一个着色器，它平滑地改变梯度，从视图中间的圆形（或椭圆形）梯度到视图边界的平方梯度：
void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    // Normalized pixel coordinates (from 0 to 1)
    vec2 uv = fragCoord/iResolution.xy;

    vec2 uvn=abs(uv-0.5)*2.0;

    vec2 distV     = uvn;
    float maxDist  = max(abs(distV.x), abs(distV.y));
    float circular = length(distV);
    float square   = maxDist;

    vec3 color1 = vec3(0.0);
    vec3 color2 = vec3(1.0);
    vec3 mate=mix(color1, color2, mix(circular,square,maxDist));

    fragColor = vec4(mate.xyz,1);
}

预览：

请澄清测量距离的方法。垂直于边缘？dx的最小值，dy？垂直于边，归一化。看看右下角的图像，你可以看到例如UVN.X的值：1，在右边，左边，0，在中间的图像，同样发生在UVN。Y是1在顶部和底部。奇怪的是，当混合这两个变量进行max（uvn.x，uvn.y）时，这些奇怪的黑色边距会出现在最终图像上，而我应该期待平滑的过渡，这就是它的外观。如果你不相信，试着用一个颜色选择器来处理。结果是正确的：看到所有这些时间都在试图纠正代码中的错误，结果发现错误就在我们的眼睛里。看来我们需要一个补丁：）谢谢！