WebGLRenderingContext.compressedTexImage[23]D()

下面这两个 function：

WebGLRenderingContext.compressedTexImage2D() and WebGL2RenderingContext.compressedTexImage3D() 在WebGL API 中特指压缩二维或三维纹理图像的格式。

在使用这些方法之前，必须通过 WebGL extensions，也就是 WebGL 扩展启用压缩图像格式。

Syntax

// WebGL 1:
void gl.compressedTexImage2D(target, level, internalformat, width, height, border, ArrayBufferView? pixels);

// Additionally available in WebGL 2:
// read from buffer bound to gl.PIXEL_UNPACK_BUFFER
void gl.compressedTexImage2D(target, level, internalformat, width, height, border, GLsizei imageSize, GLintptr offset);
void gl.compressedTexImage2D(target, level, internalformat, width, height, border,
                             ArrayBufferView srcData, optional srcOffset, optional srcLengthOverride);

 // read from buffer bound to gl.PIXEL_UNPACK_BUFFER
void gl.compressedTexImage3D(target, level, internalformat, width, height, depth, border, GLsizei imageSize, GLintptr offset);
void gl.compressedTexImage3D(target, level, internalformat, width, height, depth, border,
                             ArrayBufferView srcData, optional srcOffset, optional srcLengthOverride);

Parameters

target

A GLenum (en-US) specifying the binding point (target) of the active texture. Possible values for compressedTexImage2D:

  • gl.TEXTURE_2D: A two-dimensional texture.
  • gl.TEXTURE_CUBE_MAP_POSITIVE_X: Positive X face for a cube-mapped texture.
  • gl.TEXTURE_CUBE_MAP_NEGATIVE_X: Negative X face for a cube-mapped texture.
  • gl.TEXTURE_CUBE_MAP_POSITIVE_Y: Positive Y face for a cube-mapped texture.
  • gl.TEXTURE_CUBE_MAP_NEGATIVE_Y: Negative Y face for a cube-mapped texture.
  • gl.TEXTURE_CUBE_MAP_POSITIVE_Z: Positive Z face for a cube-mapped texture.
  • gl.TEXTURE_CUBE_MAP_NEGATIVE_Z: Negative Z face for a cube-mapped texture.

Possible values for compressedTexImage3D:

  • gl.TEXTURE_2D_ARRAY
  • gl.TEXTURE_3D
level

A GLint (en-US) specifying the level of detail. Level 0 is the base image level and level n is the nth mipmap reduction level.

internalformat

A GLenum (en-US) specifying the compressed image format. Compressed image formats must be enabled by WebGL extensions before using this method. All values are possible for compressedTexImage2D. See compressed texture formats (en-US) for which are valid for compressedTexImage3D. Possible values:

  • When using the WEBGL_compressed_texture_s3tc (en-US) extension:
    • ext.COMPRESSED_RGB_S3TC_DXT1_EXT
    • ext.COMPRESSED_RGBA_S3TC_DXT1_EXT
    • ext.COMPRESSED_RGBA_S3TC_DXT3_EXT
    • ext.COMPRESSED_RGBA_S3TC_DXT5_EXT
  • When using the WEBGL_compressed_texture_s3tc_srgb (en-US) extension:
    • ext.COMPRESSED_SRGB_S3TC_DXT1_EXT
    • ext.COMPRESSED_SRGB_ALPHA_S3TC_DXT1_EXT
    • ext.COMPRESSED_SRGB_ALPHA_S3TC_DXT3_EXT
    • ext.COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT
  • When using the WEBGL_compressed_texture_etc (en-US) extension:
    • ext.COMPRESSED_R11_EAC
    • ext.COMPRESSED_SIGNED_R11_EAC
    • ext.COMPRESSED_RG11_EAC
    • ext.COMPRESSED_SIGNED_RG11_EAC
    • ext.COMPRESSED_RGB8_ETC2
    • ext.COMPRESSED_RGBA8_ETC2_EAC
    • ext.COMPRESSED_SRGB8_ETC2
    • ext.COMPRESSED_SRGB8_ALPHA8_ETC2_EAC
    • ext.COMPRESSED_RGB8_PUNCHTHROUGH_ALPHA1_ETC2
    • ext.COMPRESSED_SRGB8_PUNCHTHROUGH_ALPHA1_ETC2
  • When using the WEBGL_compressed_texture_pvrtc (en-US) extension:
    • ext.COMPRESSED_RGB_PVRTC_4BPPV1_IMG
    • ext.COMPRESSED_RGBA_PVRTC_4BPPV1_IMG
    • ext.COMPRESSED_RGB_PVRTC_2BPPV1_IMG
    • ext.COMPRESSED_RGBA_PVRTC_2BPPV1_IMG
  • When using the WEBGL_compressed_texture_etc1 (en-US) extension:
    • ext.COMPRESSED_RGB_ETC1_WEBGL
  • When using the WEBGL_compressed_texture_atc extension:
    • ext.COMPRESSED_RGB_ATC_WEBGL
    • ext.COMPRESSED_RGBA_ATC_EXPLICIT_ALPHA_WEBGL
    • ext.COMPRESSED_RGBA_ATC_INTERPOLATED_ALPHA_WEBGL
  • When using the WEBGL_compressed_texture_astc (en-US) extension:
    • ext.COMPRESSED_RGBA_ASTC_4x4_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_4x4_KHR
    • ext.COMPRESSED_RGBA_ASTC_5x4_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_5x4_KHR
    • ext.COMPRESSED_RGBA_ASTC_5x5_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_5x5_KHR
    • ext.COMPRESSED_RGBA_ASTC_6x5_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_6x5_KHR
    • ext.COMPRESSED_RGBA_ASTC_6x6_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_6x6_KHR
    • ext.COMPRESSED_RGBA_ASTC_8x5_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_8x5_KHR
    • ext.COMPRESSED_RGBA_ASTC_8x6_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_8x6_KHR
    • ext.COMPRESSED_RGBA_ASTC_8x8_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_8x8_KHR
    • ext.COMPRESSED_RGBA_ASTC_10x5_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_10x5_KHR
    • ext.COMPRESSED_RGBA_ASTC_10x6_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_10x6_KHR
    • ext.COMPRESSED_RGBA_ASTC_10x10_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_10x10_KHR
    • ext.COMPRESSED_RGBA_ASTC_12x10_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_12x10_KHR
    • ext.COMPRESSED_RGBA_ASTC_12x12_KHR ext.COMPRESSED_SRGB8_ALPHA8_ASTC_12x12_KHR
  • When using the EXT_texture_compression_bptc (en-US) extension:
    • ext.COMPRESSED_RGBA_BPTC_UNORM_EXT
    • ext.COMPRESSED_SRGB_ALPHA_BPTC_UNORM_EXT
    • ext.COMPRESSED_RGB_BPTC_SIGNED_FLOAT_EXT
    • ext.COMPRESSED_RGB_BPTC_UNSIGNED_FLOAT_EXT
  • When using the EXT_texture_compression_rgtc (en-US) extension:
    • ext.COMPRESSED_RED_RGTC1_EXT
    • ext.COMPRESSED_SIGNED_RED_RGTC1_EXT
    • ext.COMPRESSED_RED_GREEN_RGTC2_EXT
    • ext.COMPRESSED_SIGNED_RED_GREEN_RGTC2_EXT
width

A GLsizei (en-US) specifying the width of the texture.

height

A GLsizei (en-US) specifying the height of the texture.

depth

A GLsizei (en-US) specifying the depth of the texture/the number of textures in a TEXTURE_2D_ARRAY.

border

A GLint (en-US) specifying the width of the border. Must be 0.

imageSize

A GLsizei (en-US) specifying the number of bytes to read from the buffer bound to gl.PIXEL_UNPACK_BUFFER.

offset

A GLintptr (en-US) specifying the offset in bytes from which to read from the buffer bound to gl.PIXEL_UNPACK_BUFFER.

pixels

An ArrayBufferView that be used as a data store for the compressed image data in memory.

Return value

None.

Examples

js

var ext = (
  gl.getExtension('WEBGL_compressed_texture_s3tc') ||
  gl.getExtension('MOZ_WEBGL_compressed_texture_s3tc') ||
  gl.getExtension('WEBKIT_WEBGL_compressed_texture_s3tc')
);

var texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, texture);
gl.compressedTexImage2D(gl.TEXTURE_2D, 0, ext.COMPRESSED_RGBA_S3TC_DXT5_EXT, 512, 512, 0, textureData);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);

规范

Specification
WebGL Specification
# COMPRESSEDTEXIMAGE2D
WebGL 2.0 Specification
# 3.7.6

浏览器兼容性

api.WebGLRenderingContext.compressedTexImage2D

BCD tables only load in the browser

api.WebGL2RenderingContext.compressedTexImage3D

BCD tables only load in the browser

参见