This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The WebGL2RenderingContext.texSubImage3D() method of the WebGL API specifies a sub-rectangle of the current texture.
Syntax
void gl.texSubImage3D(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, ArrayBufferView? srcData, optional srcOffset); void gl.texSubImage3D(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, ImageBitmap? pixels); void gl.texSubImage3D(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, ImageData? pixels); void gl.texSubImage3D(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, HTMLImageElement? pixels); void gl.texSubImage3D(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, HTMLCanvasElement? pixels); void gl.texSubImage3D(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, HTMLVideoElement? pixels); void gl.texSubImage3D(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, GLintptr offset);
Parameters
target- A
GLenumspecifying 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
GLintspecifying the level of detail. Level 0 is the base image level and level n is the nth mipmap reduction level. xoffset- A
GLintspecifying the x offset within the texture image. yoffset- A
GLintspecifying the y offset within the texture image. zoffset- A
GLintspecifying the z offset within the texture image. width- A
GLsizeispecifying the width of the texture. height- A
GLsizeispecifying the height of the texture. depth- A
GLsizeispecifying the depth of the texture. format- A
GLenumspecifying the format of the texel data. 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.R8gl.R16Fgl.R32Fgl.R8UIgl.RG8gl.RG16Fgl.RG32Fgl.RGUIgl.RGB8gl.SRGB8gl.RGB565gl.R11F_G11F_B10Fgl.RGB9_E5gl.RGB16Fgl.RGB32Fgl.RGB8UIgl.RGBA8gl.SRGB_APLHA8gl.RGB5_A1gl.RGBA4444gl.RGBA16Fgl.RGBA32Fgl.RGBA8UI
type- A
GLenumspecifying the data type of the texel data. Possible values:gl.UNSIGNED_BYTE: 8 bits per channel forgl.RGBAgl.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.BYTEgl.UNSIGNED_SHORTgl.SHORTgl.UNSIGNED_INTgl.INTgl.HALF_FLOATgl.FLOATgl.UNSIGNED_INT_2_10_10_10_REVgl.UNSIGNED_INT_10F_11F_11F_REVgl.UNSIGNED_INT_5_9_9_9_REVgl.UNSIGNED_INT_24_8gl.FLOAT_32_UNSIGNED_INT_24_8_REV(pixels must benull)
pixels- One of the following objects can be used as a pixel source for the texture:
ArrayBufferView,- A
Uint8Arraymust be used iftypeisgl.UNSIGNED_BYTE. - A
Uint16Arraymust be used iftypeis eithergl.UNSIGNED_SHORT_5_6_5,gl.UNSIGNED_SHORT_4_4_4_4,gl.UNSIGNED_SHORT_5_5_5_1, orext.HALF_FLOAT_OES. - A
Float32Arraymust be used iftypeisgl.FLOAT.
- A
ImageBitmap,ImageData,HTMLImageElement,HTMLCanvasElement,HTMLVideoElement.
- offset
- A
GLintptrbyte offset into theWebGLBuffer's data store. Used to upload data to the currently boundWebGLTexturefrom theWebGLBufferbound to thePIXEL_UNPACK_BUFFERtarget. -
Return value
None.
Examples
gl.texSubImage3D(gl.TEXTURE_3D, 0, 0, 0, 0, image.width, image.height, 1, gl.RGBA, gl.UNSIGNED_BYTE, image);
Specifications
| Specification | Status | Comment |
|---|---|---|
| WebGL 2.0 The definition of 'texSubImage3D' in that specification. |
Editor's Draft | Initial definition for WebGL. |
| OpenGL ES 3.0 The definition of 'glTexSubImage2D' 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.
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
texSubImage3D | 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
