javascript - 是否有 `WebGLRenderingContext` 的任何方法，如 `CanvasRenderingContext2D.getImageData()` ？

Question

假设我们可以从 CanvasRenderingContext2D 获取 ImageData。

var element = document.getElementById('someCanvas');
var context = element.getContext('2d');
var imageData = context.getImageData(0, 0, width, height);

我想知道是否也可以使用 WebGLRenderingContext 来完成？

var element = document.getElementById('someCanvas');
var context = element.getContext('webgl');
/* Get image data ... */

非常感谢!

Answer 1

它的工作方式并不完全相同，但您可以使用 WebGLRenderingContext.readPixels 获取绘图缓冲区中的所有像素。 .确保在退出实际呈现像素的事件之前调用它。

var context = element.getContext('webgl');
var pixels = new Uint8Array(context.drawingBufferWidth * context.drawingBufferHeight * 4);
context.readPixels(
  0, 
  0, 
  context.drawingBufferWidth, 
  context.drawingBufferHeight, 
  context.RGBA, 
  context.UNSIGNED_BYTE, 
  pixels);