电子签名？玩具罢了！(web前端)_办公生活

电子签名？玩具罢了！(web前端)

创始人

2024-06-02 15:59:40

需要的前置知识：简单的canvas绘制线路过程

let canvas = document.getElementById(id);
//id为canvas标签元素的id，或通过其它方法获取标签
let ctx = canvas.getContext('2d');
//规定为2d绘制图片，即确定为2d画笔
ctx.strokeStyle = "white"
//画笔的颜色为白色
ctx.beginPath();
//开始绘制
ctx.moveTo(lastX, lastY); //画笔落笔的点数，即开始绘制的位置
ctx.lineTo(lineX, lineY); //画笔结束的位置，即结束绘制的位置
ctx.stroke();             //位置填充完毕，绘制线路，即将两个点连在一起

了解以上的内容便可以进行电子签名了。

原理：监听鼠标的点击、按下、松开、以及移动事件，根据这些事件绘制路线形成签名，最后将canvas转为图片，然后发给后端就行啦

实现：





下载图片

最终效果图
在这里插入图片描述

词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。

上一篇：k8s--Kubernetes存储--Volumes配置管理

下一篇：外匹配功率管设计

电子签名？玩具罢了！(web前端)

相关内容

热门资讯