电子签名生成器
在线手写电子签名,支持鼠标和触摸屏,导出透明背景PNG
签名区域
请在此区域签名
请在此区域签名
电子签名生成器说明
电子签名生成器是一个在线手写签名工具,使用 HTML5 Canvas 实现平滑的签名绘制效果。支持鼠标和触摸屏输入,适用于电子合同签署、表单确认等场景。
绘制功能:在签名区域内按住鼠标左键拖动即可绘制签名。支持触摸屏设备,可直接用手指或触控笔签名。
笔触设置:可自定义笔触颜色(支持任意颜色)和笔触粗细(1-20像素)。平滑度设置控制曲线的圆滑程度,高平滑度模式使用二次贝塞尔曲线连接路径点,使签名更加流畅自然。
背景设置:可选择纯色背景或透明背景。透明背景模式下,导出的 PNG 图片仅包含签名笔迹,可直接叠加到文档上。选择纯色背景时,可自定义背景颜色。
撤销功能:每完成一笔(一次完整的鼠标按下到释放)保存为一个独立的笔触对象。点击撤销可移除最后一笔,重新绘制画布。
清空功能:一键清除所有签名内容,清空所有笔触记录。
下载功能:将签名导出为 PNG 格式图片。透明背景模式下导出的图片背景完全透明,可直接用于电子文档签名。
实现原理:使用 Canvas 2D Context 的 moveTo、lineTo 和 quadraticCurveTo 方法绘制路径。每笔保存为路径点数组,撤销时重新渲染所有保留的笔触。触摸事件通过转换坐标统一处理。