javascript - Babylon.js 重复纹理接缝/工件

标签 javascript webgl babylonjs

我最近开始涉足使用babylon.js 进行着色器编程。我正在尝试编写一个支持重复纹理的片段着色器。我使用了一种非常简单的方法来做到这一点,正如您可以通过链接看出的。

http://www.babylonjs.com/cyos/#CARU2#1

vec2 xy = vUV;
vec2 phase = fract(xy / vec2(1.0/vScale,1.0/vScale));
vec3 color = texture2D(textureSampler, phase).rgb;

问题在于,这会在重复纹理的接缝处产生奇怪的像素化效果,如下图所示。

My problem

我该如何解决这个问题?我的片段着色器一定有问题,因为使用标准 Material 不会产生这个问题。

如果有人能提供帮助,我将永远感激不已。

最佳答案

哇,好吧,我是个白痴,我以一种非常愚蠢且低效的方式缩放图像。我认为我实际上并不理解这句话的含义:

vec2 phase = fract(xy / vec2(1.0/vScale,1.0/vScale));

正在做。我还没有 100% 明白,但逻辑方法就是将 uv 向量乘以重复因子。

vec2 phase = vec2(xy.x*vScale,xy.y*vScale);

您可以在此处查看结果:

http://www.babylonjs.com/cyos/#CARU2#2

关于javascript - Babylon.js 重复纹理接缝/工件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37115133/

相关文章:

javascript - 使用 jQuery 遍历 DOM,从节点返回 HTML 属性

javascript - JavaScript 中的 "Variable"变量

javascript - 给定一组点,如何在 Javascript 中生成多面体

json - 创建 3d 模型并将它们转换为 WebGL 可用的形式 - 初学者指南?

javascript - 如何刷新BabylonJs Canvas ?

javascript - BabylonJS 从外部文件执行脚本

android - Cordova 网络应用程序

javascript - 突出显示由输入文本生成的列表中的项目

javascript - 如何使用 Javascript 获取已删除的 DOM 元素?

javascript - webgl 阴影映射 gl.DEPTH_COMPONENT