WebGL2RenderingContext.texImage3D()

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021.

* Some parts of this feature may have varying levels of support.

实验性: 这是一项实验性技术
在将其用于生产之前,请仔细检查浏览器兼容性表格

WebGL API 的 **WebGLRenderingContext.texImage3D()**方法指定一个 3d(three-dimensional)纹理贴图。

语法

js
texImage3D(target, level, internalformat, width, height, depth, border, format, type, offset)
texImage3D(target, level, internalformat, width, height, depth, border, format, type, source)
texImage3D(target, level, internalformat, width, height, depth, border, format, type, srcData)
texImage3D(target, level, internalformat, width, height, depth, border, format, type, srcData, srcOffset)

参数

target

GLenum指定绑定纹理图像类型。可能值:

  • gl.TEXTURE_3D: 一个 3D 贴图
  • gl.TEXTURE_2D_ARRAY: 一个 2D 数组贴图
level

GLint指定细节等级。level0 是基础图片等级,n 是第 n 个 mipmap 纹理衰减等级。(译者注:原文中衰减应该指像素,并且注意,webgl 的 Mipmapping 技术要求顶层图像的行和列的维数均为 2 的幂)

internalformat

GLint指定贴图的颜色组成,可能值为:

  • gl.ALPHA: 忽略红色,绿色,蓝色分量值只读取 alpha 信息。
  • gl.RGB: 忽略 alpha 信息,读取红绿蓝分量
  • gl.RGBA: 从颜色缓冲(colorBuffer)读取红色,绿色,蓝色和 alpha 分量
  • gl.LUMINANCE:每个颜色组件都是亮度组件,alpha 值为 1.0.
  • gl.LUMINANCE_ALPHA:每个组件都是亮度/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

GLsizei指定纹理的宽度

height

GLsizei 指定纹理的高度

depth

GLsizei 指定纹理的深度信息

border

GLint指定边框宽度,必须为 0

format

GLenum制定纹素的版本。正确的 内部格式 组合被列举在 这个列表

type

A GLenum指定纹素的数据类型,可能值:

  • gl.UNSIGNED_BYTE: 每个gl.RGBA对应 8 个字节
  • gl.UNSIGNED_SHORT_5_6_5: 红色占五个字节,绿色占六个字节,蓝色占五个字节
  • gl.UNSIGNED_SHORT_4_4_4_4: 红色占四个字节,绿色占 四 个字节,蓝色占 四 个字节
  • gl.UNSIGNED_SHORT_5_5_5_1:红色占五个字节,绿色占五个字节,蓝色占五个字节,alpha 占一个字节
  • gl.BYTE(这些属性的信息原文中均未提到,但是在 webgl1 中出现过,可以适当参考 webgl1 文献)
  • 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

其中一个对象可以用作纹理对象的源:

offset

一个针对于WebGLBuffer所储存数据的GLintptr字节的偏移量。用来重新加载已经用WebGLBuffer绑定到PIXEL_UNPACK_BUFFERWebGLTexture

返回值

没有

例子

js
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

规范

Specification
WebGL 2.0 Specification
# 3.7.6

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
texImage3D
srcData parameter accepts SharedArrayBuffer type

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support

参见