sm annotate

视频和图像注释工具

该项目为HTML视频和图像元素提供了注释工具。该工具允许用户使用各种绘图工具（包括曲线，矩形，椭圆机和文本）在视频和图像上绘制和注释。用户还可以自定义注释的颜色和中风大小。

演示：lifeart.github.io/sm-annotate

特征

• 绘制和注释视频和图像元素。
• 多个绘图工具（曲线，矩形，椭圆和文本）。
• 注释的可自定义颜色和中风大小。
• ↩撤消功能。
• 绘制形状的序列化和避难所化。
• 将形状缩放到当前的画布大小。
• ⌨撤消的键盘快捷键（CTRL/CMD + Z）。
• 用于指针事件的事件处理（鼠标和触摸）。
• 带注释的帧作为视频的播放。
• 保存当前的帧或所有框架。
• 视频叠加量

其他好处

• 零依赖性。
• 支持移动设备。
• 功能强大的插件系统。
• 用打字稿编写。

入门

使用纱线将包裹添加到您的项目中：

yarn add https://github.com/lifeart/sm-annotate.git

用法

 import { SmAnnotate } from '@lifeart/sm-annotate' ;
const video = document . getElementById ( 'video' ) ;
const annotationTool = new AnnotationTool ( video ) ;

用户可以使用可用的工具（曲线，矩形，椭圆和文本）绘制和注释，并自定义注释的颜色和笔触大小。该工具还支持用于指针事件（鼠标和触摸）的撤消功能和事件处理。

要保存当前的帧或所有带有注释的帧，请分别使用saveCurrentFrame或saveAllFrames方法。

热键

曲线工具

键代码	结果
Shift	放大镜X2
r	红色
g	绿色
b	蓝色
y	黄色
1 9	工具尺寸

贡献

我们欢迎捐款改善项目。请随时提交问题或提取请求以进行考虑。

执照

此代码可用于非商业用途。对于商业用途，用户必须与作者联系。