js 签字

// 初始化Canvas
const canvas = document.getElementById('signatureCanvas');
const ctx = canvas.getContext('2d');

// 设置Canvas样式
ctx.lineWidth = 2;
ctx.lineJoin = 'round';
ctx.lineCap = 'round';
ctx.strokeStyle = 'black';

let drawing = false;

canvas.addEventListener('mousedown', (e) => {
    drawing = true;
    ctx.beginPath();
    ctx.moveTo(e.clientX - canvas.offsetLeft, e.clientY - canvas.offsetTop);
});

canvas.addEventListener('mousemove', (e) => {
    if (!drawing) return;
    ctx.lineTo(e.clientX - canvas.offsetLeft, e.clientY - canvas.offsetTop);
    ctx.stroke();
});

canvas.addEventListener('mouseup', () => {
    drawing = false;
    // 将签名数据转换为DataURL
    const signatureData = canvas.toDataURL();
    console.log(signatureData); // 可以将此数据发送到服务器进行存储
});

#signatureCanvas {
    width: 100%;
    height: auto;
    max-width: 600px;
}

const signatureData = canvas.toDataURL('image/jpeg', 0.8); // 使用JPEG格式并设置质量为80%