Etro

Etro 是一个用于以编程方式编辑视频的 TypeScript 框架。它允许你合成图层并添加滤镜（效果）。Etro 自带文本、视频、音频和图像图层，以及一系列 GLSL 效果。你还可以使用 JavaScript 和 GLSL 定义自己的图层和效果。

特性

合成视频和音频图层
使用内置的硬件加速效果
用 JavaScript 和 GLSL 编写自己的效果
使用 Web Audio API 操作音频（音频效果即将推出）
将图层和效果参数定义为关键帧或自定义函数
实时渲染为 blob（离线渲染即将推出）

安装

npm i etro

系统依赖

node-canvas

如果在安装 etro 时遇到问题，可能需要手动安装额外的依赖。请参阅：编译 node-canvas

基本用法

让我们看一个例子：

import etro from 'etro'

var movie = new etro.Movie({ canvas: outputCanvas })
var layer = new etro.layer.Video({ startTime: 0, source: videoElement })  // 图层从 0 秒开始
movie.addLayer(layer)

movie.record({ frameRate: 24 })  // 如果不需要保存，只需使用 `play`
    .then(blob => ...)

然后可以将 blob 下载为视频文件或使用 <video> 元素显示。

查看文档获取所有内置图层的列表。

效果

效果可以转换图层或影片的输出：

var layer = new etro.layer.Video({ startTime: 0, source: videoElement })
    .addEffect(new etro.effect.Brightness({ brightness: +100) }))

查看文档获取所有内置效果的列表。

动态属性

大多数属性也支持关键帧和函数：

// 关键帧
layer.effects[0].brightness = new etro.KeyFrame(
  [0, -75],  // 0 秒时亮度为 -75
  [2, +75]  // 2 秒时亮度为 +75
)

// 函数
layer.effects[0].brightness = () => 100 * Math.random() - 50