createImageBitmap

function

function createImageBitmap(image: ImageBitmapSource, options?: ImageBitmapOptions): Promise<ImageBitmap>

Create a new ImageBitmap object from a given source.

image: ImageBitmapSource

The image to create an ImageBitmap from.

options?: ImageBitmapOptions

The options for creating the ImageBitmap.

Example

try {
  // Fetch an image
  const response = await fetch("https://example.com/image.png");
  const blob = await response.blob();

  // Basic usage
  const basicBitmap = await createImageBitmap(blob);
  console.log("Basic bitmap size:", basicBitmap.width, basicBitmap.height);

  // With options
  const resizedBitmap = await createImageBitmap(blob, {
    resizeWidth: 100,
    resizeHeight: 100,
    resizeQuality: "high",
    imageOrientation: "flipY"
  });

  // Cleanup when done
  basicBitmap.close();
  resizedBitmap.close();
} catch (error) {
  console.error("Failed to create ImageBitmap:", error);
}

See also

function

function createImageBitmap(image: ImageBitmapSource, sx: number, sy: number, sw: number, sh: number, options?: ImageBitmapOptions): Promise<ImageBitmap>

Create a new ImageBitmap object from a given source, cropping to the specified rectangle.

image: ImageBitmapSource

The image to create an ImageBitmap from.

sx: number

The x coordinate of the top-left corner of the sub-rectangle from which the ImageBitmap will be cropped.

sy: number

The y coordinate of the top-left corner of the sub-rectangle from which the ImageBitmap will be cropped.

sw: number

The width of the sub-rectangle from which the ImageBitmap will be cropped.

sh: number

The height of the sub-rectangle from which the ImageBitmap will be cropped.

options?: ImageBitmapOptions

The options for creating the ImageBitmap.

Example

try {
  // Fetch an image
  const response = await fetch("https://example.com/image.png");
  const blob = await response.blob();

  // Cropping parameters
  const croppedBitmap = await createImageBitmap(
    blob,
    0,    // sx: start x
    0,    // sy: start y
    50,   // sw: source width
    50,   // sh: source height
  );

  // Cleanup when done
  croppedBitmap.close();
} catch (error) {
  console.error("Failed to create ImageBitmap:", error);
}

See also