CropTarget：fromElement() 靜態方法
CropTarget 介面的 fromElement() 靜態方法返回一個 CropTarget 例項，該例項可用於將捕獲的影片軌道裁剪到指定元素渲染的區域。
由於 Region Capture API 是裁剪到當前瀏覽器標籤頁的區域，而不是捕獲特定元素，因此在裁剪區域上方繪製的任何內容都會在捕獲中顯示。
語法
js
CropTarget.fromElement(element)
引數
element-
對您想用作裁剪目標的
Element的引用。元素要用作裁剪目標，必須滿足以下條件：- 在螢幕上
- 可見，即，例如，未透過
display: none隱藏。
此外，如果正在限制的軌道有克隆（即，由
BrowserCaptureMediaStreamTrack.clone()建立）或者是從與使用者當前標籤頁不同的標籤頁捕獲的（例如，透過Window.postMessage()傳遞），則不會捕獲該元素。
返回值
一個 Promise，它解析為一個 CropTarget 物件例項，然後可以將該例項傳遞給 BrowserMediaStreamTrack.cropTo()，以便將軌道中捕獲的影片裁剪到僅指定 DOM 元素渲染的區域。
CropTarget 物件是可序列化的。它們可以使用 Window.postMessage() 等機制傳遞到另一個文件。
示例
js
// 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;
有關上下文中的示例程式碼，請參閱 使用元素捕獲和區域捕獲 API。
規範
| 規範 |
|---|
| 區域捕獲 # dom-croptarget-fromelement |
瀏覽器相容性
載入中…