您正在阅读此内容的英文版本,因为该语系尚未翻译。 帮助我们翻译此文章吧!
createImageBitmap
方法存在 windows 和 workers 中. 它接受各种不同的图像来源, 并返回一个Promise
, resolve为ImageBitmap
. 可选地参数,图像被剪裁成自(sx,sy)且宽度为sw,高度为sh的像素的矩形。
Syntax
createImageBitmap(image[, options]).then(function(response) { ... }); createImageBitmap(image, sx, sy, sw, sh[, options]).then(function(response) { ... });
Parameters
image
- 一个图像源, 可以是一个
<img>
, SVG<image>
,<video>
,<canvas>
,HTMLImageElement
,SVGImageElement
,HTMLVideoElement
,HTMLCanvasElement
,Blob
,ImageData
,ImageBitmap
, 或OffscreenCanvas
对象. sx
- 裁剪点x坐标.
sy
- 裁剪点y坐标.
sw
- 裁剪宽度,值可为负数.
sh
- 裁剪高度,值可为负数.
- options 可选
- 为其设置选项的对象。可用的选项是:
imageOrientation
: 指示图像是按原样呈现还是垂直翻转.none
(默认不翻转) 或flipY
.premultiplyAlpha
: 指示位图颜色通道由alpha通道预乘. 选择其一:none
,premultiply
, 或default
(默认).colorSpaceConversion
: 指示图像是否使用色彩空间转换进行解码.none
或default
(默认). The valuedefault
indicates that implementation-specific behavior is used.resizeWidth
: 指示新宽度的长整数。resizeHeight
: 指示新高度的长整数。resizeQuality
: 指定图像缩放算法. 选择其一pixelated
,low
(默认),medium
, 或high
.
Return value
返回一个解决ImageBitmap的Promise
,当Promise成功时resolves接收一个包含所得到的矩形的位图数据ImageBitmap
。
Example
var canvas = document.getElementById('myCanvas'), ctx = canvas.getContext('2d'), image = new Image(); image.onload = function() { Promise.all([ createImageBitmap(this, 0, 0, 32, 32), createImageBitmap(this, 32, 0, 32, 32) ]).then(function(sprites) { ctx.drawImage(sprites[0], 0, 0); ctx.drawImage(sprites[1], 32, 32); }); } image.src = 'sprites.png';
Specifications
Specification | Status | Comment |
---|---|---|
HTML Living Standard createImageBitmap |
Living Standard |
Browser compatibility
We're converting our compatibility data into a machine-readable JSON format.
This compatibility table still uses the old format,
because we haven't yet converted the data it contains.
Find out how you can help!
Feature | Chrome | Firefox (Gecko) | Edge | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | 50 | 未实现 | 未实现 | (Yes) | 未实现 | |
options parameter |
52 | ? | 未实现 | 未实现 | 39 | 未实现 |
resizeWidth , resizeHeight , and resizeQuality |
54 | ? | 未实现 | 未实现 | ? | 未实现 |
SVGImageElement as source image |
59 | ? | 未实现 | 未实现 | ? | 未实现 |
Feature | Android Webview | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | 50 | 50 |
42.0 (42) |
? | (Yes) | ? |
options parameter |
52 | 52 | ? | ? | 39 | ? |
resizeWidth , resizeHeight , and resizeQuality |
54 | ? | ? | ? | ? | |
SVGImageElement as source image |
59 | 59 | ? | ? | ? | ? |
[1] createImageBitmap()
now defined on WindowOrWorkerGlobalScope
mixin.
See also