BrowserCaptureMediaStreamTrack: cropTo() 方法
BrowserCaptureMediaStreamTrack 介面的 cropTo() 方法將自捕獲流裁剪到指定 DOM 元素渲染的區域。
語法
js
cropTo(cropTarget)
引數
cropTarget-
一個
CropTarget例項，代表流應被裁剪到的元素渲染區域，或者null/undefined，在這種情況下，將從軌道中移除先前設定的任何裁剪。
返回值
Promise 會在以下情況下被拒絕：
- 軌道
kind不是"video"，或者其readyState不是"live"。 - 裁剪目標元素不再存在。
- 正在裁剪的軌道不是從使用者螢幕捕獲的軌道。
cropTarget不是CropTarget例項、null或undefined。cropTarget是在與當前捕獲的標籤頁不同的標籤頁中建立的。
注意： 在 Chromium 中，如果一個軌道有副本，cropTo() 將被拒絕（請參閱 Chrome issue 41482026）。
示例
基本裁剪示例
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。
停止裁剪
您可以透過在一個先前已裁剪的軌道上呼叫 cropTo() 方法，並將其引數設定為 null 來停止裁剪。
js
// Stop cropping
await track.cropTo(null);
規範
| 規範 |
|---|
| 區域捕獲 # dom-browsercapturemediastreamtrack-cropto |
瀏覽器相容性
載入中…