aboutsummaryrefslogtreecommitdiff
path: root/files/zh-cn/web/api/webglrenderingcontext/teximage2d
diff options
context:
space:
mode:
Diffstat (limited to 'files/zh-cn/web/api/webglrenderingcontext/teximage2d')
-rw-r--r--files/zh-cn/web/api/webglrenderingcontext/teximage2d/index.html872
1 files changed, 872 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/webglrenderingcontext/teximage2d/index.html b/files/zh-cn/web/api/webglrenderingcontext/teximage2d/index.html
new file mode 100644
index 0000000000..fb578ac252
--- /dev/null
+++ b/files/zh-cn/web/api/webglrenderingcontext/teximage2d/index.html
@@ -0,0 +1,872 @@
+---
+title: WebGLRenderingContext.texImage2D()
+slug: Web/API/WebGLRenderingContext/texImage2D
+translation_of: Web/API/WebGLRenderingContext/texImage2D
+---
+<div>{{APIRef("WebGL")}}</div>
+
+<p><a href="/en-US/docs/Web/API/WebGL_API">WebGL API </a>的<strong><code>WebGLRenderingContext.texImage2D()</code></strong> 方法指定了二维纹理图像。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">// WebGL1:
+void <var>gl</var>.texImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>width</var>, <var>height</var>, <var>border</var>, <var>format</var>, <var>type</var>, ArrayBufferView? <var>pixels</var>);
+void <var>gl</var>.texImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>format</var>, <var>type</var>, ImageData? <var>pixels</var>);
+void <var>gl</var>.texImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>format</var>, <var>type</var>, HTMLImageElement? <var>pixels</var>);
+void <var>gl</var>.texImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>format</var>, <var>type</var>, HTMLCanvasElement? <var>pixels</var>);
+void <var>gl</var>.texImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>format</var>, <var>type</var>, HTMLVideoElement? <var>pixels</var>);
+void <var>gl</var>.texImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>format</var>, <var>type</var>, ImageBitmap? <var>pixels</var>);
+
+// WebGL2:
+void gl.texImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, width, <var>height</var>, <var>border</var>, <var>format</var>, <var>type</var>, GLintptr <var>offset</var>);
+void gl.texImage2D(target, level, internalformat, width, height, border, format, type, HTMLCanvasElement source);
+void gl.texImage2D(target, level, internalformat, width, height, border, format, type, HTMLImageElement source);
+void gl.texImage2D(target, level, internalformat, width, height, border, format, type, HTMLVideoElement source);
+void gl.texImage2D(target, level, internalformat, width, height, border, format, type, ImageBitmap source);
+void gl.texImage2D(target, level, internalformat, width, height, border, format, type, ImageData source);
+void gl.texImage2D(target, level, internalformat, width, height, border, format, type, ArrayBufferView srcData, srcOffset);
+</pre>
+
+<h3 id="参数">参数</h3>
+
+<dl>
+ <dt><code>target</code></dt>
+ <dd> {{domxref("GLenum")}} 指定纹理的绑定对象.可能的值:
+ <ul>
+ <li><code>gl.TEXTURE_2D</code>: 二维纹理贴图.</li>
+ <li><code>gl.TEXTURE_CUBE_MAP_POSITIVE_X</code>:立方体映射纹理的正X面。</li>
+ <li><code>gl.TEXTURE_CUBE_MAP_NEGATIVE_X</code>: 立方体映射纹理的负X面。</li>
+ <li><code>gl.TEXTURE_CUBE_MAP_POSITIVE_Y</code>: 立方体映射纹理的正Y面。</li>
+ <li><code>gl.TEXTURE_CUBE_MAP_NEGATIVE_Y</code>: 立方体映射纹理的负Y面。</li>
+ <li><code>gl.TEXTURE_CUBE_MAP_POSITIVE_Z</code>: 立方体映射纹理的正Z面。</li>
+ <li><code>gl.TEXTURE_CUBE_MAP_NEGATIVE_Z</code>: 立方体映射纹理的负Z面。</li>
+ </ul>
+ </dd>
+ <dt><code>level</code></dt>
+ <dd> {{domxref("GLint")}} 指定详细级别. 0级是基本图像等级,n级是第n个金字塔简化级.</dd>
+ <dt><code>internalformat</code></dt>
+ <dd> {{domxref("GLenum")}} 指定纹理中的颜色组件.</dd>
+ <dd>在 WebGL1 和 WebGL2 中可能的值:</dd>
+ <dt>
+ <table>
+ <thead>
+ <tr>
+ <td>Format</td>
+ <td>Type</td>
+ <td>Channels</td>
+ <td>Bytes per pixel</td>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>RGBA</td>
+ <td>UNSIGNED_BYTE</td>
+ <td>4</td>
+ <td>4</td>
+ </tr>
+ <tr>
+ <td>RGB</td>
+ <td>UNSIGNED_BYTE</td>
+ <td>3</td>
+ <td>3</td>
+ </tr>
+ <tr>
+ <td>RGBA</td>
+ <td>UNSIGNED_SHORT_4_4_4_4</td>
+ <td>4</td>
+ <td>2</td>
+ </tr>
+ <tr>
+ <td>RGBA</td>
+ <td>UNSIGNED_SHORT_5_5_5_1</td>
+ <td>4</td>
+ <td>2</td>
+ </tr>
+ <tr>
+ <td>RGB</td>
+ <td>UNSIGNED_SHORT_5_6_5</td>
+ <td>3</td>
+ <td>2</td>
+ </tr>
+ <tr>
+ <td>LUMINANCE_ALPHA</td>
+ <td>UNSIGNED_BYTE</td>
+ <td>2</td>
+ <td>2</td>
+ </tr>
+ <tr>
+ <td>LUMINANCE</td>
+ <td>UNSIGNED_BYTE</td>
+ <td>1</td>
+ <td>1</td>
+ </tr>
+ <tr>
+ <td>ALPHA</td>
+ <td>UNSIGNED_BYTE</td>
+ <td>1</td>
+ <td>1</td>
+ </tr>
+ </tbody>
+ </table>
+ </dt>
+ <dd>在WebGL2 中,对带有 <code>ArrayBufferView</code> 或 <code>GLintptr offset</code>的  <code>texImage2D</code> 版本,其它可能的值</dd>
+</dl>
+
+<table>
+ <thead>
+ <tr>
+ <td><strong>Sized<br>
+ Format</strong></td>
+ <td><strong>Base<br>
+ Format</strong></td>
+ <td><strong>R<br>
+ bits</strong></td>
+ <td><strong>G<br>
+ bits</strong></td>
+ <td><strong>B<br>
+ bits</strong></td>
+ <td><strong>A<br>
+ bits</strong></td>
+ <td><strong>Shared<br>
+ bits</strong></td>
+ <td><strong>Color<br>
+ renderable</strong></td>
+ <td><strong>Texture<br>
+ filterable</strong></td>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>R8</td>
+ <td>RED</td>
+ <td>8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>R8_SNORM</td>
+ <td>RED</td>
+ <td>s8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RG8</td>
+ <td>RG</td>
+ <td>8</td>
+ <td>8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RG8_SNORM</td>
+ <td>RG</td>
+ <td>s8</td>
+ <td>s8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGB8</td>
+ <td>RGB</td>
+ <td>8</td>
+ <td>8</td>
+ <td>8</td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGB8_SNORM</td>
+ <td>RGB</td>
+ <td>s8</td>
+ <td>s8</td>
+ <td>s8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGB565</td>
+ <td>RGB</td>
+ <td>5</td>
+ <td>6</td>
+ <td>5</td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGBA4</td>
+ <td>RGBA</td>
+ <td>4</td>
+ <td>4</td>
+ <td>4</td>
+ <td>4</td>
+ <td></td>
+ <td>●</td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGB5_A1</td>
+ <td>RGBA</td>
+ <td>5</td>
+ <td>5</td>
+ <td>5</td>
+ <td>1</td>
+ <td></td>
+ <td>●</td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGBA8</td>
+ <td>RGBA</td>
+ <td>8</td>
+ <td>8</td>
+ <td>8</td>
+ <td>8</td>
+ <td></td>
+ <td>●</td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGBA8_SNORM</td>
+ <td>RGBA</td>
+ <td>s8</td>
+ <td>s8</td>
+ <td>s8</td>
+ <td>s8</td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGB10_A2</td>
+ <td>RGBA</td>
+ <td>10</td>
+ <td>10</td>
+ <td>10</td>
+ <td>2</td>
+ <td></td>
+ <td>●</td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGB10_A2UI</td>
+ <td>RGBA</td>
+ <td>ui10</td>
+ <td>ui10</td>
+ <td>ui10</td>
+ <td>ui2</td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>SRGB8</td>
+ <td>RGB</td>
+ <td>8</td>
+ <td>8</td>
+ <td>8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>SRGB8_ALPHA8</td>
+ <td>RGBA</td>
+ <td>8</td>
+ <td>8</td>
+ <td>8</td>
+ <td>8</td>
+ <td></td>
+ <td>●</td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>R16F</td>
+ <td>RED</td>
+ <td>f16</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RG16F</td>
+ <td>RG</td>
+ <td>f16</td>
+ <td>f16</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGB16F</td>
+ <td>RGB</td>
+ <td>f16</td>
+ <td>f16</td>
+ <td>f16</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGBA16F</td>
+ <td>RGBA</td>
+ <td>f16</td>
+ <td>f16</td>
+ <td>f16</td>
+ <td>f16</td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>R32F</td>
+ <td>RED</td>
+ <td>f32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RG32F</td>
+ <td>RG</td>
+ <td>f32</td>
+ <td>f32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGB32F</td>
+ <td>RGB</td>
+ <td>f32</td>
+ <td>f32</td>
+ <td>f32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGBA32F</td>
+ <td>RGBA</td>
+ <td>f32</td>
+ <td>f32</td>
+ <td>f32</td>
+ <td>f32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>R11F_G11F_B10F</td>
+ <td>RGB</td>
+ <td>f11</td>
+ <td>f11</td>
+ <td>f10</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>RGB9_E5</td>
+ <td>RGB</td>
+ <td>9</td>
+ <td>9</td>
+ <td>9</td>
+ <td></td>
+ <td>5</td>
+ <td></td>
+ <td>●</td>
+ </tr>
+ <tr>
+ <td>R8I</td>
+ <td>RED</td>
+ <td>i8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>R8UI</td>
+ <td>RED</td>
+ <td>ui8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>R16I</td>
+ <td>RED</td>
+ <td>i16</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>R16UI</td>
+ <td>RED</td>
+ <td>ui16</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>R32I</td>
+ <td>RED</td>
+ <td>i32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>R32UI</td>
+ <td>RED</td>
+ <td>ui32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RG8I</td>
+ <td>RG</td>
+ <td>i8</td>
+ <td>i8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RG8UI</td>
+ <td>RG</td>
+ <td>ui8</td>
+ <td>ui8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RG16I</td>
+ <td>RG</td>
+ <td>i16</td>
+ <td>i16</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RG16UI</td>
+ <td>RG</td>
+ <td>ui16</td>
+ <td>ui16</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RG32I</td>
+ <td>RG</td>
+ <td>i32</td>
+ <td>i32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RG32UI</td>
+ <td>RG</td>
+ <td>ui32</td>
+ <td>ui32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGB8I</td>
+ <td>RGB</td>
+ <td>i8</td>
+ <td>i8</td>
+ <td>i8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGB8UI</td>
+ <td>RGB</td>
+ <td>ui8</td>
+ <td>ui8</td>
+ <td>ui8</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGB16I</td>
+ <td>RGB</td>
+ <td>i16</td>
+ <td>i16</td>
+ <td>i16</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGB16UI</td>
+ <td>RGB</td>
+ <td>ui16</td>
+ <td>ui16</td>
+ <td>ui16</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGB32I</td>
+ <td>RGB</td>
+ <td>i32</td>
+ <td>i32</td>
+ <td>i32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGB32UI</td>
+ <td>RGB</td>
+ <td>ui32</td>
+ <td>ui32</td>
+ <td>ui32</td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGBA8I</td>
+ <td>RGBA</td>
+ <td>i8</td>
+ <td>i8</td>
+ <td>i8</td>
+ <td>i8</td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGBA8UI</td>
+ <td>RGBA</td>
+ <td>ui8</td>
+ <td>ui8</td>
+ <td>ui8</td>
+ <td>ui8</td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGBA16I</td>
+ <td>RGBA</td>
+ <td>i16</td>
+ <td>i16</td>
+ <td>i16</td>
+ <td>i16</td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGBA16UI</td>
+ <td>RGBA</td>
+ <td>ui16</td>
+ <td>ui16</td>
+ <td>ui16</td>
+ <td>ui16</td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGBA32I</td>
+ <td>RGBA</td>
+ <td>i32</td>
+ <td>i32</td>
+ <td>i32</td>
+ <td>i32</td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>RGBA32UI</td>
+ <td>RGBA</td>
+ <td>ui32</td>
+ <td>ui32</td>
+ <td>ui32</td>
+ <td>ui32</td>
+ <td></td>
+ <td>●</td>
+ <td></td>
+ </tr>
+ </tbody>
+</table>
+
+<dl>
+ <dd>
+ <p><br>
+  在WebGL2 中,使用<code>HTMLImageElement</code>, <code>HTMLCanvasElement</code>, <code>HTMLVideoElement</code>, <code>ImageBitmap</code>, 或 <code>ImageData</code>作为<code>texImage2D</code> 纹理的版本中,可能的值有:</p>
+
+ <ul>
+ <li><code>gl.ALPHA</code>: 抛弃红色、绿色和蓝色组件并读取alpha组件。</li>
+ <li><code>gl.RGB</code>:抛弃alpha组件,读取红色、绿色和蓝色组件。</li>
+ <li><code>gl.RGBA</code>: 从颜色缓冲区读取红色、绿色、蓝色和alpha组件。</li>
+ <li><code>gl.LUMINANCE</code>: E每个颜色组件是一个亮度组件,alpha值为1.0。</li>
+ <li><code>gl.LUMINANCE_ALPHA</code>: 每个组件都是亮度/alpha组件。</li>
+ <li>当时用 {{domxref("WEBGL_depth_texture")}} 扩展:
+ <ul>
+ <li><code>gl.DEPTH_COMPONENT</code></li>
+ <li><code>gl.DEPTH_STENCIL</code></li>
+ </ul>
+ </li>
+ <li>当时用 {{domxref("EXT_sRGB")}} 扩展:
+ <ul>
+ <li><code>ext.SRGB_EXT</code></li>
+ <li><code>ext.SRGB_ALPHA_EXT</code></li>
+ </ul>
+ </li>
+ <li>当时用 {{domxref("WebGL2RenderingContext", "WebGL 2 context", "", 1)}}, 另外还提供以下值:
+ <ul>
+ <li><code>gl.R8</code></li>
+ <li><code>gl.R16F</code></li>
+ <li><code>gl.R32F</code></li>
+ <li><code>gl.R8UI</code></li>
+ <li><code>gl.RG8</code></li>
+ <li><code>gl.RG16F</code></li>
+ <li><code>gl.RG32F</code></li>
+ <li><code>gl.RG8UI</code></li>
+ <li><code>gl.RG16UI</code></li>
+ <li><code>gl.RG32UI</code></li>
+ <li><code>gl.RGB8</code></li>
+ <li><code>gl.SRGB8</code></li>
+ <li><code>gl.RGB565</code></li>
+ <li><code>gl.R11F_G11F_B10F</code></li>
+ <li><code>gl.RGB9_E5</code></li>
+ <li><code>gl.RGB16F</code></li>
+ <li><code>gl.RGB32F</code></li>
+ <li><code>gl.RGB8UI</code></li>
+ <li><code>gl.RGBA8</code></li>
+ <li><code>gl.SRGB8_ALPHA8</code></li>
+ <li><code>gl.RGB5_A1</code></li>
+ <li><code>gl.RGB10_A2</code></li>
+ <li><code>gl.RGBA4</code></li>
+ <li><code>gl.RGBA16F</code></li>
+ <li><code>gl.RGBA32F</code></li>
+ <li><code>gl.RGBA8UI</code></li>
+ </ul>
+ </li>
+ </ul>
+ </dd>
+ <dt><code>width</code></dt>
+ <dd> {{domxref("GLsizei")}} 指定纹理的宽度。</dd>
+ <dt><code>height</code></dt>
+ <dd>{{domxref("GLsizei")}} 指定纹理的高度</dd>
+ <dt><code>border</code></dt>
+ <dd>{{domxref("GLint")}} 指定纹理的边框宽度。必须为 0。</dd>
+ <dt><code>format</code></dt>
+ <dd> {{domxref("GLenum")}} 指定texel数据格式。在 WebGL 1中,它必须与 <code>internalformat</code> 相同(查看上面). 在WebGL 2中, <a href="https://www.khronos.org/registry/webgl/specs/latest/2.0/#TEXTURE_TYPES_FORMATS_FROM_DOM_ELEMENTS_TABLE">这张表</a>中列出了这些组合。</dd>
+ <dt><code>type</code></dt>
+ <dd> {{domxref("GLenum")}} 指定texel数据的数据类型。可能的值:
+ <ul>
+ <li><code>gl.UNSIGNED_BYTE</code>:  <code>gl.RGBA</code>每个通道8位</li>
+ <li><code>gl.UNSIGNED_SHORT_5_6_5</code>: 5 bits红, 6 bits绿, 5 bits蓝</li>
+ <li><code>gl.UNSIGNED_SHORT_4_4_4_4</code>: 4 bits红, 4 bits绿, 4 bits蓝, 4 alpha bits.</li>
+ <li><code>gl.UNSIGNED_SHORT_5_5_5_1</code>: 5 bits红, 5 bits绿, 5 bits蓝, 1 alpha bit.</li>
+ <li>当使用 {{domxref("WEBGL_depth_texture")}} 扩展:
+ <ul>
+ <li><code>gl.UNSIGNED_SHORT</code></li>
+ <li><code>gl.UNSIGNED_INT</code></li>
+ <li><code>ext.UNSIGNED_INT_24_8_WEBGL</code> (constant provided by the extension)</li>
+ </ul>
+ </li>
+ <li>当使用 {{domxref("OES_texture_float")}}扩展 :
+ <ul>
+ <li><code>gl.FLOAT</code></li>
+ </ul>
+ </li>
+ <li>当使用 {{domxref("OES_texture_half_float")}} 扩展:
+ <ul>
+ <li><code>ext.HALF_FLOAT_OES</code> (constant provided by the extension)</li>
+ </ul>
+ </li>
+ <li>当使用 {{domxref("WebGL2RenderingContext", "WebGL 2 context", "", 1)}},下面的值也是可用的:
+ <ul>
+ <li><code>gl.BYTE</code></li>
+ <li><code>gl.UNSIGNED_SHORT</code></li>
+ <li><code>gl.SHORT</code></li>
+ <li><code>gl.UNSIGNED_INT</code></li>
+ <li><code>gl.INT</code></li>
+ <li><code>gl.HALF_FLOAT</code></li>
+ <li><code>gl.FLOAT</code></li>
+ <li><code>gl.UNSIGNED_INT_2_10_10_10_REV</code></li>
+ <li><code>gl.UNSIGNED_INT_10F_11F_11F_REV</code></li>
+ <li><code>gl.UNSIGNED_INT_5_9_9_9_REV</code></li>
+ <li><code>gl.UNSIGNED_INT_24_8</code></li>
+ <li><code>gl.FLOAT_32_UNSIGNED_INT_24_8_REV</code> (pixels must be {{jsxref("null")}})</li>
+ </ul>
+ </li>
+ </ul>
+ </dd>
+ <dt><code>pixels</code></dt>
+ <dd>下列对象之一可以用作纹理的像素源:
+ <ul>
+ <li>{{domxref("ArrayBufferView")}},
+ <ul>
+ <li>{{jsxref("Uint8Array")}}  如果 <code>type</code> 是 <code>gl.UNSIGNED_BYTE</code>则必须使用</li>
+ <li>{{jsxref("Uint16Array")}} 如果 <code>type</code> 是 <code>gl.UNSIGNED_SHORT_5_6_5</code>, <code>gl.UNSIGNED_SHORT_4_4_4_4</code>, <code>gl.UNSIGNED_SHORT_5_5_5_1</code>, <code>gl.UNSIGNED_SHORT</code> 或<code>ext.HALF_FLOAT_OES</code>则必须使用</li>
+ <li> {{jsxref("Uint32Array")}} 如果<code>type</code> 是 <code>gl.UNSIGNED_INT</code> 或<code>ext.UNSIGNED_INT_24_8_WEBGL</code>则必须使用</li>
+ <li> {{jsxref("Float32Array")}} 如果<code>type</code> 是 <code>gl.FLOAT</code>则必须使用</li>
+ </ul>
+ </li>
+ <li>{{domxref("ImageData")}},</li>
+ <li>{{domxref("HTMLImageElement")}},</li>
+ <li>{{domxref("HTMLCanvasElement")}},</li>
+ <li>{{domxref("HTMLVideoElement")}},</li>
+ <li>{{domxref("ImageBitmap")}}.</li>
+ </ul>
+ </dd>
+ <dt>offset</dt>
+ <dd> {{domxref("GLintptr")}} 类型偏移到 {{domxref("WebGLBuffer")}}的数据存储中。 用于上传数据到当前范围 {{domxref("WebGLTexture")}} 从<code>WebGLBuffer</code> 范围到<code>PIXEL_UNPACK_BUFFER</code> 目标。(仅在WebGL 2中 )</dd>
+ <dd>
+ <ul>
+ </ul>
+ </dd>
+</dl>
+
+<h3 id="返回值">返回值</h3>
+
+<p>None.</p>
+
+<h2 id="示例">示例</h2>
+
+<pre class="brush: js">gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
+</pre>
+
+<h2 id="说明">说明</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Specification</th>
+ <th scope="col">Status</th>
+ <th scope="col">Comment</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('WebGL', "#5.14.8", "texImage2D")}}</td>
+ <td>{{Spec2('WebGL')}}</td>
+ <td>WebGL.初始定义</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('OpenGL ES 2.0', "glTexImage2D.xml", "glTexImage2D")}}</td>
+ <td>{{Spec2('OpenGL ES 2.0')}}</td>
+ <td>OpenGL ES 2.0 API手册(类似).</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('WebGL2', "#3.7.6", "texImage2D")}}</td>
+ <td>{{Spec2('WebGL2')}}</td>
+ <td>WebGL更新定义.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('OpenGL ES 3.0', "glTexImage2D.xhtml", "glTexImage2D")}}</td>
+ <td>{{Spec2('OpenGL ES 3.0')}}</td>
+ <td>OpenGL ES 3.0 API手册(类似).</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("api.WebGLRenderingContext.texImage2D")}}</p>
+
+<h2 id="另见">另见</h2>
+
+<ul>
+ <li>{{domxref("WebGLRenderingContext.createTexture()")}}</li>
+ <li>{{domxref("WebGLRenderingContext.bindTexture()")}}</li>
+ <li>{{domxref("WebGLRenderingContext.texSubImage2D()")}}</li>
+ <li>{{domxref("WebGLRenderingContext.compressedTexImage2D()")}}</li>
+ <li>{{domxref("WebGLRenderingContext.copyTexImage2D()")}}</li>
+ <li>{{domxref("WebGLRenderingContext.getTexParameter()")}}</li>
+ <li>{{domxref("WEBGL_depth_texture")}}</li>
+ <li>{{domxref("OES_texture_float")}}</li>
+ <li>{{domxref("OES_texture_half_float")}}</li>
+ <li>{{domxref("EXT_sRGB")}}</li>
+</ul>