VideoFrame

Konstruktor

VideoFrame()

Erstellt ein neues VideoFrame-Objekt.

Instanzeigenschaften

VideoFrame.format Schreibgeschützt

Gibt das Pixelformat des VideoFrame zurück.

VideoFrame.codedWidth Schreibgeschützt

Gibt die Breite des VideoFrame in Pixeln zurück, möglicherweise einschließlich nicht sichtbarer Auffüllung und bevor mögliche Anpassungen des Seitenverhältnisses berücksichtigt werden.

VideoFrame.codedHeight Schreibgeschützt

Gibt die Höhe des VideoFrame in Pixeln zurück, möglicherweise einschließlich nicht sichtbarer Auffüllung und bevor mögliche Anpassungen des Seitenverhältnisses berücksichtigt werden.

VideoFrame.codedRect Schreibgeschützt

Gibt ein DOMRectReadOnly zurück, dessen Breite und Höhe codedWidth und codedHeight entsprechen.

VideoFrame.visibleRect Schreibgeschützt

Gibt ein DOMRectReadOnly zurück, das den sichtbaren Pixelbereich dieses VideoFrame beschreibt.

VideoFrame.displayWidth Schreibgeschützt

Gibt die Breite des VideoFrame bei der Anzeige nach Anpassung des Seitenverhältnisses zurück.

VideoFrame.displayHeight Schreibgeschützt

Gibt die Höhe des VideoFrame bei der Anzeige nach Anpassung des Seitenverhältnisses zurück.

VideoFrame.duration Schreibgeschützt

Gibt eine Ganzzahl zurück, die die Dauer des Videos in Mikrosekunden angibt.

VideoFrame.timestamp Schreibgeschützt

Gibt eine Ganzzahl zurück, die den Zeitstempel des Videos in Mikrosekunden angibt.

VideoFrame.colorSpace Schreibgeschützt

Gibt ein VideoColorSpace-Objekt zurück.

VideoFrame.flip Schreibgeschützt

Gibt zurück, ob das VideoFrame horizontal gespiegelt ist.

VideoFrame.rotation Schreibgeschützt

Gibt die auf das VideoFrame angewendete Drehung im Uhrzeigersinn in Grad (0, 90, 180 oder 270) zurück. Beliebige Zahlen (auch negative) werden auf die nächste Vierteldrehung gerundet.

Instanzmethoden

VideoFrame.allocationSize()

Gibt die Anzahl der Bytes zurück, die benötigt werden, um das VideoFrame gemäß den an die Methode übergebenen Optionen zu speichern.

VideoFrame.copyTo()

Kopiert den Inhalt des VideoFrame in einen ArrayBuffer.

VideoFrame.clone()

Erstellt ein neues VideoFrame-Objekt, das auf dieselbe Medienressource wie das Original verweist.

VideoFrame.close()

Löscht alle Zustände und gibt die Referenz auf die Medienressource frei.

VideoFrame.metadata()

Gibt die mit dem VideoFrame verknüpften Metadaten zurück.

Beschreibung

Ein VideoFrame-Objekt kann auf verschiedene Weise erstellt oder abgerufen werden. Der MediaStreamTrackProcessor zerlegt eine Medienspur in einzelne VideoFrame-Objekte.

Ein VideoFrame ist eine Bildquelle und verfügt über einen Konstruktor, der jede andere Canvas-Quelle akzeptiert ( ein SVGImageElement, ein HTMLVideoElement, ein HTMLCanvasElement, ein ImageBitmap, ein OffscreenCanvas oder ein anderes VideoFrame). Das bedeutet, dass ein Einzelbild aus einem Bild- oder Videoelement erstellt werden kann.

Ein zweiter Konstruktor ermöglicht es, ein VideoFrame aus seiner binären Pixeldarstellung in einem ArrayBuffer, einem TypedArray oder einem DataView zu erstellen.

Erstellte Einzelbilder können anschließend in eine Medienspur umgewandelt werden, beispielsweise mit der MediaStreamTrackGenerator-Schnittstelle, die aus einem Strom von Einzelbildern eine Medienspur erstellt.

Beispiele

Im folgenden Beispiel werden Einzelbilder von einem MediaStreamTrackProcessor zurückgegeben und anschließend codiert. Das vollständige Beispiel und weitere Informationen dazu finden Sie im Artikel Videoverarbeitung mit WebCodecs.

let frameCounter = 0;

const track = stream.getVideoTracks()[0];
const mediaProcessor = new MediaStreamTrackProcessor(track);

const reader = mediaProcessor.readable.getReader();
while (true) {
  const result = await reader.read();
  if (result.done) break;

  let frame = result.value;
  if (encoder.encodeQueueSize > 2) {
    // Too many frames in flight, encoder is overwhelmed
    // let's drop this frame.
    frame.close();
  } else {
    frameCounter++;
    const insertKeyframe = frameCounter % 150 === 0;
    encoder.encode(frame, { keyFrame: insertKeyframe });
    frame.close();
  }
}

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Videoverarbeitung mit WebCodecs
• WebCodecs-Beispiele