是否可以从另一个画布的 getImageData 数组（在同一个 html 页面中）创建纹理（用于画布中的元素）？也许没有three.js？非常感谢，
珍妮弗
问问题
2864 次
3 回答
2
WebGLtexImage2D方法最酷的地方在于它的最后一个参数可以是 DOM 元素而不是 ArrayBuffer，在这种情况下，它会将渲染的内容复制到您的纹理对象中。
例如：
var canvas2d = document.getElementById('canvas2d');
gl.bindTexture(gl.TEXTURE_2D, myTexture);
gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas2d);
这里有一个关于这个功能的小教程。
于 2013-03-12T22:46:59.803 回答
1
这就是 getImageData 的重点，获取图像来操作它，然后在任何画布上绘制。
imageData = someContext.getImageData(0, 0, canvasWidth, canvasHeight);
anotherContext.putImageData(imageData, 0, 0);
做这样的事情：http: //jsfiddle.net/jaibuu/myRGr/
如果你不打算进行像素操作，你应该只使用 drawImage()，而不使用 getImageData/putImageData，虽然速度较慢。
于 2013-03-12T21:38:18.083 回答
0
是的，texImage2D 可以采用 ImageData。
var imageData = some2DCanvasContext.getImageData(...);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, imageData);
这是测试此功能的 WebGL 一致性测试之一
于 2013-03-14T19:08:52.560 回答