JavaScript/WindowOrWorkerGlobalScope/createImageBitmap

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Die Funktion createImageBitmap() erstellt ein ImageBitmap Objekt aus einer Vielzahl von Quellen. Dieses Objekt kann daraufhin verwendet werden, um die Bitmap mit geringer Latenz auf einen Canvas zu zeichnen. Die Methode ist Teil des WindowOrWorkerGlobalScope Mixins und steht damit für den Window-Thread und für Worker-Threads zur Verfügung.

Syntax 1

var imageBitmapPromise = createImageBitmap(quelle [, options]);

Syntax 2

var imageBitmapPromise = createImageBitmap(quelle, sx, sy, sw, sh [, options]);

Diese Funktion erwartet folgende Parameter:

  • quelle = Das DOM-Objekt zu einem <img>, SVG <image>, <video> oder <canvas> Element. Oder ein Blob-, ImageData-, ImageBitmap- oder OffscreenCanvas-Objekt.
  • sx, sy, sw, sh = obere linke Ecke, Breite und Höhe des gewünschten Bildausschnitts, in Pixeln. Fehlen diese Parameter, wird das vollständige Quellobjekt verarbeitet.
  • options = Ein Objekt mit weiteren Optionen. Dieses Objekt ist optional, es kann die folgenden Schlüssel enthalten. Für fehlende Schlüssel wird der genannte Defaultwert verwendet.
    • imageOrientation: Ein String, entweder "none" (Defaultwert) oder "flipY". Gibt an, ob das Objekt vertikal gespiegelt werden soll.
    • premultiplyAlpha: Ein String, entweder "default" (Defaultwert), "premultiply" oder "none". Vorabmultiplikation der Alphawerte von RGBA-Farben beeinflusst, wie Pixel die Darstellbarkeit auf einem Canvas und wird in der HTML Spezifikation näher beschrieben. "none" besagt, dass die erzeugte ImageBitmap nicht vormultipliziert sein soll (und im Zweifelsfall wird durch den Alphawert dividiert). "premultiply" erzwingt Vormultiplikation, und "default" überlässt die Entscheidung dem Browser.
    • colorSpaceConversion: Ein String, entweder "default" (Defaultwert) oder "none". Nur relevant, wenn die Quelle ein <img> Element oder Blob-Objekt ist. Die Angabe von "none" unterdrückt Farbraumkonvertierungen, die durch Farbprofile in der Quelle oder dem Anzeigegerät vorgenommen werden könnten. Der Default ist, dass der Browser eine Farbraumkonvertierung durchführen darf (wobei das genaue Vorgehen der Browserimplementierung überlassen bleibt).
    • resizeWidth: Ein long integer, mit dem die Breite der Bitmap skaliert werden kann.
    • resizeHeight: Ein long integer, mit dem die Höhe der Bitmap skaliert werden kann
      • Ist weder resizeWidth noch resizeHeight angegeben, wird nicht skaliert.
      • Ist nur einer der beiden Werte angegeben, wird der andere aus dem Breiten/Höhen-Verhältnis der Quelle bestimmt.
      • Sind beide angegeben, wird skaliert und ggf. verzerrt.
    • resizeQuality: Ein String, der den Skalierungsalgorithmus festlegt. Mögliche Werte sind "pixelated", "low" (Defaultwert), "medium" oder "high".

Rückgabewert:

  • imageBitmapPromise: Ein Promise-Objekt, das nach Fertigstellung des ImageBitmap-Objekts erfüllt wird. Die Erzeugung des ImageBitmap Objekts kann Zeit beanspruchen und erfolgt deshalb asynchron. Es ist auch möglich, mehrere createImageBitmap-Aufrufe direkt nacheinander zu setzen und mit Promise.all() auf die Fertigstellung zu warten. Ein leistungsfähiger Computer kann die Arbeit so parallelisieren.

Siehe auch