如何在 webgl 中获取纹理？没有 Canvas.toDataUrl()

Question

我想从 webgl 获取纹理，就像我可以在 canvas 上下文为 2d 时使用 getImageData()。
我怎样才能从 webgl 上下文中获取纹理？

Answer 1

我知道三种可能。重要的！ For all these methods you must set preserveDrawingBuffer = true with webgl。

到数据url

First one is high level method toDataURL and its origin is javascript

canvas.toDataURL(type, encoderOptions);

例如，如果你想让你的客户做一些应用程序，你可以使用这个"screenshot"

Following two methods are low level and its origin is webgl. 如果您想修改纹理或计算新纹理（阴影），您可以使用它们。

5.14.12 回读像素

可以将当前帧缓冲区中的像素读回 ArrayBufferView 对象。

void readPixels(GLint x, GLint y, GLsizei width, GLsizei height, GLenum format, GLenum type, ArrayBufferView? pixels)

5.14.8 纹理对象

纹理对象为纹理操作提供存储和状态...

void texImage2D(GLenum target, GLint level, GLenum internalformat, GLint border, GLenum format, GLenum type, HTMLCanvasElement element)