1 files changed, 242 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/webglrenderingcontext/compressedteximage2d/index.html b/files/zh-cn/web/api/webglrenderingcontext/compressedteximage2d/index.html
new file mode 100644
index 0000000000..939440ed64
--- /dev/null
+++ b/files/zh-cn/web/api/webglrenderingcontext/compressedteximage2d/index.html
@@ -0,0 +1,242 @@
+---
+title: 'WebGLRenderingContext.compressedTexImage[23]D()'
+slug: Web/API/WebGLRenderingContext/compressedTexImage2D
+translation_of: Web/API/WebGLRenderingContext/compressedTexImage2D
+---
+<div>{{APIRef("WebGL")}}</div>
+
+<p><code style=""><font face="Arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">下面这两个function：</span></font></code></p>
+
+<p><code style=""><font face="Arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;"> </span></font><strong>WebGLRenderingContext.compressedTexImage2D()</strong></code>  and <strong><code>WebGL2RenderingContext.compressedTexImage3D()</code></strong> 在<a href="/en-US/docs/Web/API/WebGL_API">WebGL API </a>中特指压缩二维或三维纹理图像的格式。</p>
+
+<p>在使用这些方法之前，必须通过 <a href="/en-US/docs/Web/API/WebGL_API/Using_Extensions">WebGL extensions</a>， 也就是 WebGL扩展启用压缩图像格式。</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">// WebGL 1:
+void <var>gl</var>.compressedTexImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>width</var>, <var>height</var>, <var>border</var>, ArrayBufferView? <var>pixels</var>);
+
+// Additionally available in WebGL 2:
+// read from buffer bound to gl.PIXEL_UNPACK_BUFFER
+void <var>gl</var>.compressedTexImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>width</var>, <var>height</var>, <var>border</var>, GLsizei <var>imageSize</var>, GLintptr <var>offset</var>);
+void <var>gl</var>.compressedTexImage2D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>width</var>, <var>height</var>, <var>border</var>,
+                             ArrayBufferView <var>srcData</var>, optional <var>srcOffset</var>, optional <var>srcLengthOverride</var>);
+
+ // read from buffer bound to gl.PIXEL_UNPACK_BUFFER
+void <var>gl</var>.compressedTexImage3D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>width</var>, <var>height</var>, <var>depth</var>, <var>border</var>, GLsizei <var>imageSize</var>, GLintptr <var>offset</var>);
+void <var>gl</var>.compressedTexImage3D(<var>target</var>, <var>level</var>, <var>internalformat</var>, <var>width</var>, <var>height</var>, <var>depth</var>, <var>border</var>,
+                             ArrayBufferView <var>srcData</var>, optional <var>srcOffset</var>, optional <var>srcLengthOverride</var>);</pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+ <dt><code>target</code></dt>
+ <dd>A {{domxref("GLenum")}} specifying the binding point (target) of the active texture. Possible values for <code>compressedTexImage2D</code>:
+ <ul>
+  <li><code>gl.TEXTURE_2D</code>: A two-dimensional texture.</li>
+  <li><code>gl.TEXTURE_CUBE_MAP_POSITIVE_X</code>: Positive X face for a cube-mapped texture.</li>
+  <li><code>gl.TEXTURE_CUBE_MAP_NEGATIVE_X</code>: Negative X face for a cube-mapped texture.</li>
+  <li><code>gl.TEXTURE_CUBE_MAP_POSITIVE_Y</code>: Positive Y face for a cube-mapped texture.</li>
+  <li><code>gl.TEXTURE_CUBE_MAP_NEGATIVE_Y</code>: Negative Y face for a cube-mapped texture.</li>
+  <li><code>gl.TEXTURE_CUBE_MAP_POSITIVE_Z</code>: Positive Z face for a cube-mapped texture.</li>
+  <li><code>gl.TEXTURE_CUBE_MAP_NEGATIVE_Z</code>: Negative Z face for a cube-mapped texture.</li>
+ </ul>
+ Possible values for <code>compressedTexImage3D</code>:
+
+ <ul>
+  <li><code>gl.TEXTURE_2D_ARRAY</code></li>
+  <li><code>gl.TEXTURE_3D</code></li>
+ </ul>
+ </dd>
+ <dt><code>level</code></dt>
+ <dd>A {{domxref("GLint")}} specifying the level of detail. Level 0 is the base image level and level <em>n</em> is the <em>n</em>th mipmap reduction level.</dd>
+ <dt><code>internalformat</code></dt>
+ <dd>A {{domxref("GLenum")}} specifying the compressed image format. Compressed image formats must be enabled by <a href="/en-US/docs/Web/API/WebGL_API/Using_Extensions">WebGL extensions</a> before using this method. All values are possible for <code>compressedTexImage2D</code>. See <a href="/en-US/docs/Web/API/WebGL_API/Compressed_texture_formats">compressed texture formats</a> for which are valid for <code>compressedTexImage3D</code>. Possible values:
+ <ul>
+  <li>When using the {{domxref("WEBGL_compressed_texture_s3tc")}} extension:
+   <ul>
+    <li><code>ext.COMPRESSED_RGB_S3TC_DXT1_EXT</code></li>
+    <li><code>ext.COMPRESSED_RGBA_S3TC_DXT1_EXT</code></li>
+    <li><code>ext.COMPRESSED_RGBA_S3TC_DXT3_EXT</code></li>
+    <li><code>ext.COMPRESSED_RGBA_S3TC_DXT5_EXT</code></li>
+   </ul>
+  </li>
+  <li>When using the {{domxref("WEBGL_compressed_texture_s3tc_srgb")}} extension:
+   <ul>
+    <li><code>ext.COMPRESSED_SRGB_S3TC_DXT1_EXT</code></li>
+    <li><code>ext.COMPRESSED_SRGB_ALPHA_S3TC_DXT1_EXT</code></li>
+    <li><code>ext.COMPRESSED_SRGB_ALPHA_S3TC_DXT3_EXT</code></li>
+    <li><code>ext.COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT</code></li>
+   </ul>
+  </li>
+  <li>When using the {{domxref("WEBGL_compressed_texture_etc")}} extension:
+   <ul>
+    <li><code>ext.COMPRESSED_R11_EAC</code></li>
+    <li><code>ext.COMPRESSED_SIGNED_R11_EAC</code></li>
+    <li><code>ext.COMPRESSED_RG11_EAC</code></li>
+    <li><code>ext.COMPRESSED_SIGNED_RG11_EAC</code></li>
+    <li><code>ext.COMPRESSED_RGB8_ETC2</code></li>
+    <li><code>ext.COMPRESSED_RGBA8_ETC2_EAC</code></li>
+    <li><code>ext.COMPRESSED_SRGB8_ETC2</code></li>
+    <li><code>ext.COMPRESSED_SRGB8_ALPHA8_ETC2_EAC</code></li>
+    <li><code>ext.COMPRESSED_RGB8_PUNCHTHROUGH_ALPHA1_ETC2</code></li>
+    <li><code>ext.COMPRESSED_SRGB8_PUNCHTHROUGH_ALPHA1_ETC2</code></li>
+   </ul>
+  </li>
+  <li>When using the {{domxref("WEBGL_compressed_texture_pvrtc")}} extension:
+   <ul>
+    <li><code>ext.COMPRESSED_RGB_PVRTC_4BPPV1_IMG</code></li>
+    <li><code>ext.COMPRESSED_RGBA_PVRTC_4BPPV1_IMG</code></li>
+    <li><code>ext.COMPRESSED_RGB_PVRTC_2BPPV1_IMG</code></li>
+    <li><code>ext.COMPRESSED_RGBA_PVRTC_2BPPV1_IMG</code></li>
+   </ul>
+  </li>
+  <li>When using the {{domxref("WEBGL_compressed_texture_etc1")}} extension:
+   <ul>
+    <li><code>ext.COMPRESSED_RGB_ETC1_WEBGL</code></li>
+   </ul>
+  </li>
+  <li>When using the {{domxref("WEBGL_compressed_texture_atc")}} extension:
+   <ul>
+    <li><code>ext.COMPRESSED_RGB_ATC_WEBGL</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ATC_EXPLICIT_ALPHA_WEBGL</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ATC_INTERPOLATED_ALPHA_WEBGL</code></li>
+   </ul>
+  </li>
+  <li>When using the {{domxref("WEBGL_compressed_texture_astc")}} extension:
+   <ul>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_4x4_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_4x4_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_5x4_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_5x4_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_5x5_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_5x5_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_6x5_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_6x5_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_6x6_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_6x6_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_8x5_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_8x5_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_8x6_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_8x6_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_8x8_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_8x8_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_10x5_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_10x5_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_10x6_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_10x6_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_10x10_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_10x10_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_12x10_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_12x10_KHR</code></li>
+    <li><code>ext.COMPRESSED_RGBA_ASTC_12x12_KHR<br>
+     ext.COMPRESSED_SRGB8_ALPHA8_ASTC_12x12_KHR</code></li>
+   </ul>
+  </li>
+  <li>When using the {{domxref("EXT_texture_compression_bptc")}} extension:
+   <ul>
+    <li><code>ext.COMPRESSED_RGBA_BPTC_UNORM_EXT</code></li>
+    <li><code>ext.COMPRESSED_SRGB_ALPHA_BPTC_UNORM_EXT</code></li>
+    <li><code>ext.COMPRESSED_RGB_BPTC_SIGNED_FLOAT_EXT</code></li>
+    <li><code>ext.COMPRESSED_RGB_BPTC_UNSIGNED_FLOAT_EXT</code></li>
+   </ul>
+  </li>
+  <li>When using the {{domxref("EXT_texture_compression_rgtc")}} extension:
+   <ul>
+    <li><code>ext.COMPRESSED_RED_RGTC1_EXT</code></li>
+    <li><code>ext.COMPRESSED_SIGNED_RED_RGTC1_EXT</code></li>
+    <li><code>ext.COMPRESSED_RED_GREEN_RGTC2_EXT</code></li>
+    <li><code>ext.COMPRESSED_SIGNED_RED_GREEN_RGTC2_EXT</code></li>
+   </ul>
+  </li>
+ </ul>
+ </dd>
+ <dt><code>width</code></dt>
+ <dd>A {{domxref("GLsizei")}} specifying the width of the texture.</dd>
+ <dt><code>height</code></dt>
+ <dd>A {{domxref("GLsizei")}} specifying the height of the texture.</dd>
+ <dt><code>depth</code></dt>
+ <dd>A {{domxref("GLsizei")}} specifying the depth of the texture/the number of textures in a <code>TEXTURE_2D_ARRAY</code>.</dd>
+ <dt><code>border</code></dt>
+ <dd>A {{domxref("GLint")}} specifying the width of the border. Must be 0.</dd>
+ <dt><code>imageSize</code></dt>
+ <dd>A {{domxref("GLsizei")}} specifying the number of bytes to read from the buffer bound to <code>gl.PIXEL_UNPACK_BUFFER</code>.</dd>
+ <dt><code>offset</code></dt>
+ <dd>A {{domxref("GLintptr")}} specifying the offset in bytes from which to read from the buffer bound to <code>gl.PIXEL_UNPACK_BUFFER</code>.</dd>
+ <dt><code>pixels</code></dt>
+ <dd>An {{domxref("ArrayBufferView")}} that be used as a data store for the compressed image data in memory.</dd>
+</dl>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>None.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: 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);
+</pre>
+
+<h2 id="Specifications">Specifications</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', "#COMPRESSEDTEXIMAGE2D", "compressedTexImage2D")}}</td>
+   <td>{{Spec2('WebGL')}}</td>
+   <td>Initial definition for WebGL.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('OpenGL ES 2.0', "glCompressedTexImage2D.xml", "glCompressedTexImage2D")}}</td>
+   <td>{{Spec2('OpenGL ES 2.0')}}</td>
+   <td>Man page of the (similar) OpenGL ES 2.0 API.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('OpenGL ES 3.0', "glCompressedTexImage2D.xhtml", "glCompressedTexImage2D")}}</td>
+   <td>{{Spec2('OpenGL ES 3.0')}}</td>
+   <td>Man page of the (similar) OpenGL ES 3.0 API.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</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>
+
+<h3 id="compressedTexImage2D">compressedTexImage2D</h3>
+
+<p>{{Compat("api.WebGLRenderingContext.compressedTexImage2D")}}</p>
+
+<h3 id="compressedTexImage3D">compressedTexImage3D</h3>
+
+<p>{{Compat("api.WebGL2RenderingContext.compressedTexImage3D")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/WebGL_API/Using_Extensions">Using WebGL extensions</a></li>
+ <li>{{domxref("WebGLRenderingContext.compressedTexSubImage2D()")}}</li>
+ <li>{{domxref("WEBGL_compressed_texture_s3tc")}}</li>
+ <li>{{domxref("WEBGL_compressed_texture_s3tc_srgb")}}</li>
+ <li>{{domxref("WEBGL_compressed_texture_etc")}}</li>
+ <li>{{domxref("WEBGL_compressed_texture_pvrtc")}}</li>
+ <li>{{domxref("WEBGL_compressed_texture_etc1")}}</li>
+ <li>{{domxref("WEBGL_compressed_texture_atc")}}</li>
+ <li>{{domxref("WEBGL_compressed_texture_astc")}}</li>
+ <li>{{domxref("EXT_texture_compression_bptc")}}</li>
+ <li>{{domxref("EXT_texture_compression_rgtc")}}</li>
+</ul>