self.createImageBitmap()
========================

El método **`createImageBitmap()`** crea un *bitmap* a partir de un recurso especificado, opcionalmente recortado para mostrar únicamente una porción de este. El método existe a nivel global como parte, tanto de las ventanas (*window*), como de los *workers*. Este admite una variedad de tipos de entrada, y devuelve una `Promise` (en-US) que es resuelta con un `ImageBitmap`.

Sintaxis
--------
```

createImageBitmap(image[, options]).then(function(response) { ... });
createImageBitmap(image, sx, sy, sw, sh[, options]).then(function(response) { ... });
```

### Parámetros

`image`

Un recurso/imagen origen, que puede uno de los siguientes elementos: `<img>`, SVG `<image>` (en-US), `<video>`, `<canvas>`, `HTMLImageElement`, `SVGImageElement` (en-US), `HTMLVideoElement`, `HTMLCanvasElement`, `Blob`, `ImageData` (en-US), `ImageBitmap`, o `OffscreenCanvas` (en-US).

`sx`

La coordenada x del rectángulo que será usado para la extracción del `ImageBitmap`.

`sy`

La coordenada y del rectángulo que será usado para la extracción del `ImageBitmap`.

`sw`

La anchura del rectángulo que será usado para extraer el `ImageBitmap`. El valor podría ser negativo.

`sh`

La altura del rectángulo que será usado para extraer el `ImageBitmap`. El valor podría ser negativo.

`options` Opcional

Un objeto que proporciona opciones para la extracción de la imagen. Las opciones posibles son:

* `imageOrientation`: Especifica si la imagen debe ser extraida tal y como se muestra, o debe ser volteada verticalmente. Las valores posibles: `none` (por defecto) o `flipY`.
* `premultiplyAlpha`: Especifica si los canales de color del mapa de bits generado deben premultiplicarse por el canal alpha. Uno de: `none`, `premultiply`, o `default` (por defecto).
* `colorSpaceConversion`: Especifica si la imagen debe ser decodificada usando conversión del espacio de color. Uno de: `none` o `default` (por defecto). El valor `default` indica que se usará la implementación que haya disponible.
* `resizeWidth`: Un entero largo que especifica la anchura final.
* `resizeHeight`: Un entero largo que especifica la altura final.
* `resizeQuality`: Especifica que algorítmo debe ser usado en el redimensionado para alcanzar las dimensiones deseadas. Uno de estos valores: `pixelated`, `low` (por defecto), `medium`, o `high`.

### Valor devuelto

Una `Promise` (en-US) que es resuelta con un objeto `ImageBitmap`, el cual contiene los datos del mapa de bits generado para el rectángulo dado.

Ejemplo
-------

### Creando sprites desde un sprite sheet

El siguiente ejemplo carga un *sprite sheet*, extrae los *sprites*, y muestra cada uno de ellos en el *canvas*. Un *sprite sheet* es una imagen que contiene multiples imágenes más pequeñas, que finalmente son utilizadas de manera individual.


```js
var canvas = document.getElementById("myCanvas"),
  ctx = canvas.getContext("2d"),
  image = new Image();

// Esperar que el sprite sheet se cargue
image.onload = function () {
  Promise.all([
    // Recortar dos sprites del conjunto
    createImageBitmap(image, 0, 0, 32, 32),
    createImageBitmap(image, 32, 0, 32, 32),
  ]).then(function (sprites) {
    // Pintar cada uno de los sprites en el canvas
    ctx.drawImage(sprites[0], 0, 0);
    ctx.drawImage(sprites[1], 32, 32);
  });
};

// Cargar el sprite sheet desde un archivo de imagen
image.src = "sprites.png";
```

Especificaciones
----------------

| Specification |
| --- |
| HTML Standard # dom-createimagebitmap-dev |

Compatibilidad con navegadores
------------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Ver también
-----------

* `CanvasRenderingContext2D.drawImage()`
* `ImageData` (en-US)