使用webgl中的线性过滤器在着色器中重复纹理

Question

我试图在我的着色器中重复我的简单纹理并获得恼人的结果

纹理包装属性设置为CLAMP_TO_EDGE，因为我不能确定图像的大小 - 并且对于使用REPEAT，图像必须是2大小的幂。

我的片段使用这个简单的代码

uniform sampler2D tex1;
void main()
{
   gl_FragColor = texture2D(tex1, fract(gl_TexCoord[0].xy * 2));
}

结果是：

问题是关节。重复开始时。 （标记为红色） 当过滤器最近时没有问题 - 边缘不平滑 - 因此没有问题。

我创建了大小为16x16的图片 - 只能用于检查的REPEAT过滤器，结果很好，如图所示。

在我的实际应用中，我让用户选择重复图像，并且不必由2个尺寸供电。

此外，当我在另一个app纹理图集中使用时，REPEAT过滤器无论如何都不好。因为我正在切割部分纹理并重复它。

有人可以帮我解决这个问题吗？

谢谢，

Answer 1

如果您没有要插入的数据，则无法进行插值。这是当您使用gl.CLAMP_TO_EDGE在边缘处执行此操作时，仅使用边数据进行插值，而不是使用＆＃39; next＆＃39;质地。

想到三个选项

1. 将纹理渲染（部分）到另一个纹理，该纹理是2纹理的力量，但是你有双AA
2. 在着色器中实现自己的重复和插值算法。我打赌这是一个较慢的选择。
3. 绘制纹理后模糊边缘或稍微缩放纹理并混合。我不认为这总是看起来像预期的那样。我不会自己去找它