WebGLRenderingContext.compressedTexImage2D() and WebGL2RenderingContext.compressedTexImage3D() methods of the WebGL API specify a two- or three-dimensional texture image in a compressed format.

Compressed image formats must be enabled by WebGL extensions before using these methods.

句法

// 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);
			

参数

target
A GLenum 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.
可能的值对于 compressedTexImage3D :
  • gl.TEXTURE_2D_ARRAY
  • gl.TEXTURE_3D
level
A GLint specifying the level of detail. Level 0 is the base image level and level n n th mipmap reduction level.
internalformat
A GLenum specifying the compressed image format. Compressed image formats must be enabled by WebGL extensions before using this method. All values are possible for compressedTexImage2D 。见 compressed texture formats for which are valid for compressedTexImage3D . Possible values:
  • 当使用 WEBGL_compressed_texture_s3tc 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
  • 当使用 WEBGL_compressed_texture_s3tc_srgb 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
  • 当使用 WEBGL_compressed_texture_etc 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
  • 当使用 WEBGL_compressed_texture_pvrtc 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
  • 当使用 WEBGL_compressed_texture_etc1 extension:
    • ext.COMPRESSED_RGB_ETC1_WEBGL
  • 当使用 WEBGL_compressed_texture_atc extension:
    • ext.COMPRESSED_RGB_ATC_WEBGL
    • ext.COMPRESSED_RGBA_ATC_EXPLICIT_ALPHA_WEBGL
    • ext.COMPRESSED_RGBA_ATC_INTERPOLATED_ALPHA_WEBGL
  • 当使用 WEBGL_compressed_texture_astc 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
  • 当使用 EXT_texture_compression_bptc 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
  • 当使用 EXT_texture_compression_rgtc 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 specifying the width of the texture.
height
A GLsizei specifying the height of the texture.
depth
A GLsizei specifying the depth of the texture/the number of textures in a TEXTURE_2D_ARRAY .
border
A GLint specifying the width of the border. Must be 0.
imageSize
A GLsizei specifying the number of bytes to read from the buffer bound to gl.PIXEL_UNPACK_BUFFER .
offset
A GLintptr specifying the offset in bytes from which to read from the buffer bound to gl.PIXEL_UNPACK_BUFFER .
pixels
ArrayBufferView that be used as a data store for the compressed image data in memory.

返回值

None.

范例

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);
				

规范

规范 状态 注释
WebGL 1.0
The definition of 'compressedTexImage2D' in that specification.
推荐 Initial definition for WebGL.
OpenGL ES 2.0
The definition of 'glCompressedTexImage2D' in that specification.
标准 Man page of the (similar) OpenGL ES 2.0 API.
OpenGL ES 3.0
The definition of 'glCompressedTexImage2D' in that specification.
标准 Man page of the (similar) OpenGL ES 3.0 API.

浏览器兼容性

compressedTexImage2D

更新 GitHub 上的兼容性数据
桌面 移动
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
compressedTexImage2D Chrome 9 Edge 12 Firefox 4 IE 11 Opera 12 Safari 5.1 WebView Android Yes Chrome Android 25 Firefox Android Yes Opera Android 12 Safari iOS 8 Samsung Internet Android 1.5
SharedArrayBuffer as a parameter Chrome 60 Edge ≤79 Firefox 79 IE ? Opera 47 Safari ? WebView Android 60 Chrome Android 60 Firefox Android ? Opera Android 44 Safari iOS ? Samsung Internet Android 8.0
WebGL2 Chrome 56 Edge 79 Firefox 51 IE 不支持 No Opera 43 Safari 不支持 No WebView Android 58 Chrome Android 58 Firefox Android 51 Opera Android 43 Safari iOS 不支持 No Samsung Internet Android 7.0

图例

完整支持

不支持

不支持

兼容性未知 ?

兼容性未知

compressedTexImage3D

更新 GitHub 上的兼容性数据
桌面 移动
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
compressedTexImage3D Chrome 56 Edge 79 Firefox 51 IE 不支持 No Opera 43 Safari 不支持 No WebView Android 58 Chrome Android 58 Firefox Android 51 Opera Android 43 Safari iOS 不支持 No Samsung Internet Android 7.0
SharedArrayBuffer as a parameter Chrome 60 Edge 79 Firefox 79 IE 不支持 No Opera 47 Safari 不支持 No WebView Android 60 Chrome Android 60 Firefox Android ? Opera Android 44 Safari iOS 不支持 No Samsung Internet Android 8.0

图例

完整支持

不支持

不支持

兼容性未知 ?

兼容性未知

另请参阅

元数据

  • 最后修改:
  1. WebGL API
  2. WebGLRenderingContext
  3. 特性
    1. canvas
    2. drawingBufferHeight
    3. drawingBufferWidth
  4. 方法
    1. activeTexture()
    2. attachShader()
    3. bindAttribLocation()
    4. bindBuffer()
    5. bindFramebuffer()
    6. bindRenderbuffer()
    7. bindTexture()
    8. blendColor()
    9. blendEquation()
    10. blendEquationSeparate()
    11. blendFunc()
    12. blendFuncSeparate()
    13. bufferData()
    14. bufferSubData()
    15. checkFramebufferStatus()
    16. clear()
    17. clearColor()
    18. clearDepth()
    19. clearStencil()
    20. colorMask()
    21. commit()
    22. compileShader()
    23. compressedTexImage[23]D()
    24. compressedTexSubImage2D()
    25. copyTexImage2D()
    26. copyTexSubImage2D()
    27. createBuffer()
    28. createFramebuffer()
    29. createProgram()
    30. createRenderbuffer()
    31. createShader()
    32. createTexture()
    33. cullFace()
    34. deleteBuffer()
    35. deleteFramebuffer()
    36. deleteProgram()
    37. deleteRenderbuffer()
    38. deleteShader()
    39. deleteTexture()
    40. depthFunc()
    41. depthMask()
    42. depthRange()
    43. detachShader()
    44. disable()
    45. disableVertexAttribArray()
    46. drawArrays()
    47. drawElements()
    48. enable()
    49. enableVertexAttribArray()
    50. finish()
    51. flush()
    52. framebufferRenderbuffer()
    53. framebufferTexture2D()
    54. frontFace()
    55. generateMipmap()
    56. getActiveAttrib()
    57. getActiveUniform()
    58. getAttachedShaders()
    59. getAttribLocation()
    60. getBufferParameter()
    61. getContextAttributes()
    62. getError()
    63. getExtension()
    64. getFramebufferAttachmentParameter()
    65. getParameter()
    66. getProgramInfoLog()
    67. getProgramParameter()
    68. getRenderbufferParameter()
    69. getShaderInfoLog()
    70. getShaderParameter()
    71. getShaderPrecisionFormat()
    72. getShaderSource()
    73. getSupportedExtensions()
    74. getTexParameter()
    75. getUniform()
    76. getUniformLocation()
    77. getVertexAttrib()
    78. getVertexAttribOffset()
    79. hint()
    80. isBuffer()
    81. isContextLost()
    82. isEnabled()
    83. isFramebuffer()
    84. isProgram()
    85. isRenderbuffer()
    86. isShader()
    87. isTexture()
    88. lineWidth()
    89. linkProgram()
    90. pixelStorei()
    91. polygonOffset()
    92. readPixels()
    93. renderbufferStorage()
    94. sampleCoverage()
    95. scissor()
    96. shaderSource()
    97. stencilFunc()
    98. stencilFuncSeparate()
    99. stencilMask()
    100. stencilMaskSeparate()
    101. stencilOp()
    102. stencilOpSeparate()
    103. texImage2D()
    104. texParameter[fi]()
    105. texSubImage2D()
    106. uniform[1234][fi][v]()
    107. uniformMatrix[234]fv()
    108. useProgram()
    109. validateProgram()
    110. vertexAttrib[1234]f[v]()
    111. vertexAttribPointer()
    112. viewport()
  5. WebGL 相关页面
    1. ANGLE_instanced_arrays
    2. EXT_blend_minmax
    3. EXT_color_buffer_half_float
    4. EXT_disjoint_timer_query
    5. EXT_frag_depth
    6. EXT_sRGB
    7. EXT_shader_texture_lod
    8. EXT_texture_filter_anisotropic
    9. OES_element_index_uint
    10. OES_standard_derivatives
    11. OES_texture_float
    12. OES_texture_float_linear
    13. OES_texture_half_float
    14. OES_texture_half_float_linear
    15. OES_vertex_array_object
    16. WEBGL_color_buffer_float
    17. WEBGL_compressed_texture_atc
    18. WEBGL_compressed_texture_etc1
    19. WEBGL_compressed_texture_pvrtc
    20. WEBGL_compressed_texture_s3tc
    21. WEBGL_compressed_texture_s3tc_srgb
    22. WEBGL_debug_renderer_info
    23. WEBGL_debug_shaders
    24. WEBGL_depth_texture
    25. WEBGL_draw_buffers
    26. WEBGL_lose_context
    27. WebGL2RenderingContext
    28. WebGLActiveInfo
    29. WebGLBuffer
    30. WebGLContextEvent
    31. WebGLFramebuffer
    32. WebGLObject
    33. WebGLProgram
    34. WebGLQuery
    35. WebGLRenderbuffer
    36. WebGLSampler
    37. WebGLShader
    38. WebGLShaderPrecisionFormat
    39. WebGLSync
    40. WebGLTexture
    41. WebGLTransformFeedback
    42. WebGLUniformLocation
    43. WebGLVertexArrayObject