1 files changed, 107 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/canvasrenderingcontext2d/createimagedata/index.html b/files/zh-cn/web/api/canvasrenderingcontext2d/createimagedata/index.html
new file mode 100644
index 0000000000..a02adf6183
--- /dev/null
+++ b/files/zh-cn/web/api/canvasrenderingcontext2d/createimagedata/index.html
@@ -0,0 +1,107 @@
+---
+title: CanvasRenderingContext2D.createImageData()
+slug: Web/API/CanvasRenderingContext2D/createImageData
+tags:
+  - API
+  - Canvas
+  - CanvasRenderingContext2D
+translation_of: Web/API/CanvasRenderingContext2D/createImageData
+---
+<div>{{APIRef}}</div>
+
+<p><code><strong>CanvasRenderingContext2D</strong></code><strong><code>.createImageData()</code></strong> 是 Canvas 2D API 创建一个新的、空白的、指定大小的 {{domxref("ImageData")}} 对象。 所有的像素在新对象中都是透明的。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">ImageData <var><em>ctx</em>.createImageData(width, height);</var>
+ImageData <var><em>ctx</em>.createImageData(imagedata);</var>
+</pre>
+
+<h3 id="参数">参数</h3>
+
+<dl>
+ <dt><code>width</code></dt>
+ <dd>{{domxref("ImageData")}} 新对象的宽度。</dd>
+ <dt><code>height</code></dt>
+ <dd>{{domxref("ImageData")}} 新对象的高度。</dd>
+ <dt><code>imagedata</code></dt>
+ <dd>从现有的 {{domxref("ImageData")}} 对象中，复制一个和其宽度和高度相同的对象。图像自身不允许被复制。</dd>
+</dl>
+
+<h3 id="返回值">返回值</h3>
+
+<p>指定了宽度和高度的，新的 {{domxref("ImageData")}} 对象。 新对象使用透明的像素进行填充。</p>
+
+<h3 id="抛出错误">抛出错误</h3>
+
+<dl>
+ <dt><code>IndexSizeError</code></dt>
+ <dd>如果宽度或者高度变量值为零，会抛出此异常。</dd>
+</dl>
+
+<h2 id="示例">示例</h2>
+
+<h3 id="使用_createImageData_方法">使用 <code>createImageData</code> 方法</h3>
+
+<p>这是一段简单地使用 <code>createImageData</code> 方法的代码片段。 获取更多信息，请看 <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas">canvas像素控制</a> 和 {{domxref("ImageData")}} 对象。</p>
+
+<h4 id="HTML">HTML</h4>
+
+<pre class="brush: html">&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
+</pre>
+
+<h4 id="JavaScript">JavaScript</h4>
+
+<pre class="brush: js; highlight:[6]">var canvas = document.getElementById("canvas");
+var ctx = canvas.getContext("2d");
+ctx.rect(10, 10, 100, 100);
+ctx.fill();
+
+console.log(ctx.createImageData(100, 100));
+// ImageData { width: 100, height: 100, data: Uint8ClampedArray[40000] }
+</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('HTML WHATWG', "scripting.html#dom-context-2d-createimagedata", "CanvasRenderingContext2D.createImageData")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容">浏览器兼容</h2>
+
+<div class="hidden">
+<p>The compatibility table on 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>
+</div>
+
+<p>{{Compat("api.CanvasRenderingContext2D.createImageData")}}</p>
+
+<h3 id="兼容性注解">兼容性注解</h3>
+
+<ul>
+ <li>从 {{geckoRelease("5.0")}}开始：
+  <ul>
+   <li>如果矩形小于指定的1个像素，<code style="font-style: normal;">createImageData()</code> 会返回图像数据至少1个像素值。</li>
+   <li>当调用 <code style="font-style: normal;">createImageData()</code> 指定非限制值时，会抛出<code style="font-style: normal;">NOT_SUPPORTED_ERR</code> exception异常。</li>
+   <li><code>createImageData()</code> 根据规定处理负数变量，会围绕对称轴翻转矩形区域。</li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="参见">参见</h2>
+
+<ul>
+ <li>接口定义，{{domxref("CanvasRenderingContext2D")}}.</li>
+ <li>{{domxref("ImageData")}}</li>
+ <li><a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas">canvas像素控制</a></li>
+</ul>