代码之家 › 专栏 › 技术社区 › Maciej Wojcik

HtmlCanvaElement上未解析的方法captureStream

html5-canvas typescript html javascript

Maciej Wojcik · 技术社区 · 8 年前

我在画布元素和方法上遇到了奇怪的情况 captureStream .根据文档,HtmlCanvaElement有一个方法 捕获流 .然而,我的Angular6应用程序声称没有这种方法。

所以这个代码不起作用:

let canvas: HTMLCanvasElement;
canvas = document.createElement('canvas');
let stream = canvas.captureStream(20);

它在第三行失败了。

此代码运行时没有任何错误:

   let canvas: any;
   canvas = document.createElement('canvas');
   let stream = canvas.captureStream(20);

这怎么可能?我百分之百确定HtmlCanvaElement有这个方法和文档。createElement('canvas')返回HTMLCanvasElement。

3 回复 | 直到 8 年前

Nino Filiu 5 年前

根据 MDN ,看起来像 captureStream 方法仍然是一个工作草案(截至2021年6月),尽管它并没有被所有主要浏览器实现。这可能就是为什么它还不是 HTMLCanvasElement .

hthetiot 4 年前

可以在TypeScript中扩展现有接口,并将元素强制转换为自定义接口。

例子:

interface CanvasElement extends HTMLCanvasElement {
  captureStream(frameRate?: number): MediaStream;
}

const myCanvas = <CanvasElement> document.createElement('canvas');
const myStream = myCanvas.captureStream();

Dachstein 5 年前

在整个项目中可用,无需创建新界面:

declare global {
   interface HTMLCanvasElement {
     captureStream(frameRate?: number): MediaStream;
  }
}

推荐文章

YotiPoti · 我的照片太大了,无法容纳我的HTML画布。我该怎么办?

3 年前

Mykyta_GloryToUkraine · JS drawImage作为类中的方法

4 年前

TheTechy · 从多维数组为HTML5平铺图生成冲突对象

8 年前

Joni dep · JavaScript画布drawImage工作不正常[重复]

8 年前

DaFudgeWizzad · 如果形状超出了javascript画布的范围,如何剪切形状?

8 年前

Bestlogo56 · 我随机生成的平铺集未按预期工作。我怎样才能解决这个问题?

8 年前

John Ackerman · 绘制点的路径html画布

8 年前

Jaan · Fabricjs对象在完成时移动火

8 年前

Tareq Jami · 使用鼠标(坐标系)放大我的canva

8 年前

PiggMiner · 为什么我的代码不能将所有内容都绘制到画布上?

8 年前