Web/API/WebGL2RenderingContext/texImage3D

This is an experimental technologyCheck the Browser compatibility table carefully before using this in production.

The WebGLRenderingContext.texImage3D() method of the WebGL API specifies a three-dimensional texture image.

Syntax

void gl.texImage3D(target, level, internalformat, width, height, depth, border, format, type, GLintptr offset); 

void gl.texImage3D(target, level, internalformat, width, height, depth, border, format, type, HTMLCanvasElement source);
void gl.texImage3D(target, level, internalformat, width, height, depth, border, format, type, HTMLImageElement source); 
void gl.texImage3D(target, level, internalformat, width, height, depth, border, format, type, HTMLVideoElement source); 
void gl.texImage3D(target, level, internalformat, width, height, depth, border, format, type, ImageBitmap source); 
void gl.texImage3D(target, level, internalformat, width, height, depth, border, format, type, ImageData source); 
void gl.texImage3D(target, level, internalformat, width, height, depth, border, format, type, ArrayBufferView? srcData);
void gl.texImage3D(target, level, internalformat, width, height, depth, border, format, type, ArrayBufferView srcData, srcOffset);

Parameters

target: A GLenum specifying the binding point (target) of the active texture. Possible values:

gl.TEXTURE_3D

A three-dimensional texture.
gl.TEXTURE_2D_ARRAY: A two-dimensional array texture.

level: A GLint specifying the level of detail. Level 0 is the base image level and level n is the nth mipmap reduction level.
internalformat: A GLint specifying the color components in the texture. Possible values:

gl.ALPHA

Discards the red, green and blue components and reads the alpha component.
gl.RGB: Discards the alpha components and reads the red, green and blue components.
gl.RGBA: Red, green, blue and alpha components are read from the color buffer.
gl.LUMINANCE: Each color component is a luminance component, alpha is 1.0.
gl.LUMINANCE_ALPHA: Each component is a luminance/alpha component.
gl.R8
gl.R16F
gl.R32F
gl.R8UI
gl.RG8
gl.RG16F
gl.RG32F
gl.RGUI
gl.RGB8
gl.SRGB8
gl.RGB565
gl.R11F_G11F_B10F
gl.RGB9_E5
gl.RGB16F
gl.RGB32F
gl.RGB8UI
gl.RGBA8
gl.SRGB_APLHA8
gl.RGB5_A1
gl.RGBA4444
gl.RGBA16F
gl.RGBA32F
gl.RGBA8UI

width: A GLsizei specifying the width of the texture.
height: A GLsizei specifying the height of the texture.
depth: A GLsizei specifying the depth of the texture.
border: A GLint specifying the width of the border. Must be 0.
format: A GLenum specifying the format of the texel data. The correct combinations with internalformat are listed in this table.
type: A GLenum specifying the data type of the texel data. Possible values:

gl.UNSIGNED_BYTE

8 bits per channel for gl.RGBA
gl.UNSIGNED_SHORT_5_6_5: 5 red bits, 6 green bits, 5 blue bits.
gl.UNSIGNED_SHORT_4_4_4_4: 4 red bits, 4 green bits, 4 blue bits, 4 alpha bits.
gl.UNSIGNED_SHORT_5_5_5_1: 5 red bits, 5 green bits, 5 blue bits, 1 alpha bit.
gl.BYTE
gl.UNSIGNED_SHORT
gl.SHORT
gl.UNSIGNED_INT
gl.INT
gl.HALF_FLOAT
gl.FLOAT
gl.UNSIGNED_INT_2_10_10_10_REV
gl.UNSIGNED_INT_10F_11F_11F_REV
gl.UNSIGNED_INT_5_9_9_9_REV
gl.UNSIGNED_INT_24_8
gl.FLOAT_32_UNSIGNED_INT_24_8_REV (pixels must be null)

source: One of the following objects can be used as a pixel source for the texture:

ArrayBufferView, ImageBitmap, ImageData, HTMLImageElement, HTMLCanvasElement, HTMLVideoElement.

offset: A GLintptr byte offset into the WebGLBuffer's data store. Used to upload data to the currently bound WebGLTexture from the WebGLBuffer bound to the PIXEL_UNPACK_BUFFER target.

Return value

None.

Examples

gl.texImage3D(gl.TEXTURE_3D,
              0,                                          // level
              gl.RGBA,                                    // internalFormat
              1,                                          // width
              1,                                          // height
              1,                                          // depth
              0,                                          // border
              gl.RGBA,                                    // format
              gl.UNSIGNED_BYTE,                           // type
              new Uint8Array([0xff, 0x00, 0x00, 0x00]));  // data

Specifications

Specification	Status	Comment
WebGL 2.0The definition of 'texImage3D' in that specification.	Editor's Draft	Updated definition for WebGL.
OpenGL ES 3.0The definition of 'glTexImage3D' in that specification.	Standard	Man page of the (similar) OpenGL ES 3.0 API.

Browser compatibility

The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`texImage3D`	Chrome Full support 56	Edge Full support 79	Firefox Full support 51	IE No support No	Opera Full support 43	Safari No support No	WebView Android Full support 58	Chrome Android Full support 58	Firefox Android Full support 51	Opera Android Full support 43	Safari iOS No support No	Samsung Internet Android Full support 7.0
`SharedArrayBuffer` as a parameter	Chrome Full support 60	Edge Full support 79	Firefox Full support 79	IE No support No	Opera Full support 47	Safari No support No	WebView Android Full support 60	Chrome Android Full support 60	Firefox Android ?	Opera Android Full support 44	Safari iOS No support No	Samsung Internet Android Full support 8.0

Legend

Full support: Full support
No support: No support
Compatibility unknown: Compatibility unknown