gl_FragCoord与three.js中的屏幕大小不匹配

Question

我一直有这个问题，使用gl_FragCoord显示屏幕左下角上一次传递的渲染纹理的纹理，尺寸较小。

就好像窗口的大小与渲染目标的大小不匹配，但我已经仔细检查了它们。

Answer 1

我终于明白了，问题是画布与相机和渲染目标的大小不同。

你想确保这些匹配：

var winW = window.innerWidth;
var winH = window.innerHeight;
// Render target matches in size to the window
var rtTexture1 = new THREE.WebGLRenderTarget( winW, winH, { minFilter: THREE.NearestFilter, magFilter: THREE.NearestFilter, format: THREE.RGBFormat, depthBuffer: true } );
// Canvas matches in size to the window too!
var canvas = document.querySelector('canvas');
var gl;
try {
    gl = canvas.getContext('webgl2');
    canvas.width = winW;
    canvas.height = winH;
} catch (err) {
    console.error(err);
}