CanvasRenderingContext2D.createImageData()
CanvasRenderingContext2D.createImageData()
是 Canvas 2D API 创建一个新的、空白的、指定大小的 ImageData
对象。所有的像素在新对象中都是透明的。
语法
ImageData ctx.createImageData(width, height); ImageData ctx.createImageData(imagedata);
参数
返回值
指定了宽度和高度的,新的 ImageData
对象。新对象使用透明的像素进行填充。
抛出错误
IndexSizeError
-
如果宽度或者高度变量值为零,会抛出此异常。
示例
使用 createImageData
方法
这是一段简单地使用 createImageData
方法的代码片段。获取更多信息,请看 canvas 像素控制 和 ImageData
对象。
HTML
<canvas id="canvas"></canvas>
JavaScript
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] }
规范
Specification |
---|
HTML Standard # dom-context-2d-createimagedata-dev |
浏览器兼容
BCD tables only load in the browser
兼容性注解
- 从 Gecko 5.0 开始:
- 如果矩形小于指定的 1 个像素,
createImageData()
会返回图像数据至少 1 个像素值。 - 当调用
createImageData()
指定非限制值时,会抛出NOT_SUPPORTED_ERR
exception 异常。 createImageData()
根据规定处理负数变量,会围绕对称轴翻转矩形区域。
- 如果矩形小于指定的 1 个像素,