CropTarget

Eingeschränkt verfügbar

Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Die CropTarget-Schnittstelle der Screen Capture API bietet eine statische Methode, fromElement(), die eine CropTarget-Instanz zurückgibt. Diese kann verwendet werden, um eine erfasste Video-Spur auf den Bereich zuzuschneiden, in dem ein angegebenes Element gerendert wird.

Statische Methoden

fromElement(): Gibt eine CropTarget-Instanz zurück, die verwendet werden kann, um eine erfasste Video-Spur auf den Bereich zuzuschneiden, in dem ein angegebenes Element gerendert wird.

Beispiele

// Options for getDisplayMedia()
const displayMediaOptions = {
  preferCurrentTab: true,
};

// Create crop target from DOM element
const demoElem = document.querySelector("#demo");
const cropTarget = await CropTarget.fromElement(demoElem);

// Capture video stream from user's webcam and isolate video track
const stream =
  await navigator.mediaDevices.getDisplayMedia(displayMediaOptions);
const [track] = stream.getVideoTracks();

// Crop video track
await track.cropTo(cropTarget);

// Broadcast cropped stream in <video> element
videoElem.srcObject = stream;

Siehe Verwendung der Element Capture und Region Capture APIs für ein Beispiel im Kontext.