Как вы извлекаете данные растрового изображения WebGL?

Question

Можно получить данные растрового изображения HTML Canvas 2D, возможно ли также получить доступ к визуализированному содержимому элемента Canvas 3D/WebGL в виде растровых данных?

Answer 1

Подпись в формате readPixels WebGL была изменена в более позднем варианте.

Вместо того, чтобы возвращать новый массив с каждый раз пиксельных данных, вы передаете массив для заполнения, как последний аргумент:

недействительные readPixels (отблеск х, отблеск у, GLsizei ширина, GLsizei высота, формат GLenum, тип GLenum , ArrayBufferView)

Это позволяет повторно использовать один и тот же массив для нескольких операций readPixels.

Answer 2

Из рабочего проекта WebGL Specification:

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

Вернуть ArrayBufferView с пикселями в пределах переданного прямоугольника. Данные , возвращенные с readPixels, должны быть обновлены с последней последней отправленной командой рисования. Любые необработанные команды рисования должны быть заполнены и , их результаты представлены текущим буферам рисования перед readPixels обращается к буфере рисования.

Конкретный подкласс Возвращаемый ArrayBufferView зависит от пройденного типа. Если это UNSIGNED_BYTE, возвращается Uint8Array , в противном случае возвращается Uint16Array .

Answer 3

Не так прямо, как использование readPixels, но это также может работать. Вы также можете визуализировать холст элемента изображения, например, так:

var img = document.getElementById("game-canvas").toDataURL("image/jpeg"); 
$("#shots").append("<img src=\"" + img + "\" width=\"320\" height=\"480\"/>"); 

Вы должны получить контекст WebGL с специальной опцией preserveDrawingContext для этой работы, хотя:

var gl = canvas.getContext("experimental-webgl", {preserveDrawingBuffer: true}); 

С этого момента, если вы хотите легко манипулировать изображением, вы можете сделать это на 2-мерном холсте и прочитать пиксели там, если хотите.

Я регулярно использую это, чтобы делать «скриншоты» того, с чем я играю.