如何将 three.js 纹理作为 "WebGLTexture" 传递给 WEBGL 代码？

Question

我正在尝试将 three.js 纹理传递给 gl.texSubImage WEBGL 函数，但出现以下错误：

在 Chrome:

在 Firefox 上：

代码如下 - 目标纹理 2 被传递到下面的 gl.bindTexture 并且未被识别。源 texture1 是加载了图像的纹理。

我试过：texture2，texture2.image，texture2.image.data，两者都有一个数据纹理和一个普通纹理，加载了一个图像作为 texture2。有什么想法吗？

var gl = renderer.getContext();
var position = new THREE.Vector2(0,0);

renderer.setTexture2D( texture2, 0 ); 

gl.bindTexture(gl.TEXTURE_2D, texture2.image.data); //<<< problem

gl.texSubImage2D( gl.TEXTURE_2D, 
                  0, 
                  position.x, 
                  position.y, 
                  gl.RGB, 
                  gl.UNSIGNED_BYTE, 
                  texture1.image);

Answer 1

我建议你看看WebGLRenderer.copyTextureToTexture()。它在内部使用 texSubImage。还有一个例子显示了该方法的用法：

https://threejs.org/examples/webgl_materials_texture_partialupdate.html

顺便说一句：在 bindTexture 中使用 image.data 不起作用，因为 API 调用需要一个 WebGLTexture 对象作为第二个参数。您可以像这样访问纹理的原始 WebGLTexture 对象。

var textureProperties = renderer.properties.get( texture );
console.log( textureProperties.__webglTexture );

如何将 three.js 纹理作为 "WebGLTexture" 传递给 WEBGL 代码？

How can I pass a three.js texture as "WebGLTexture" to WEBGL code?

javascript

textures

webgl

three.js