js+画布实现在线签名

css

#myCanvas{
display: block;
margin: 100px auto;
border: 5px solid #00eed2;
border-radius: 10px;
}
#but{
text-align: center;
position: relative;
bottom: 72px;
}
.but1,.but2{
width: 100px;
height: 30px;
background-color: #00eed2;
border: none;
border-radius: 8px;
}
.but2{
margin-left: 200px;
}

html

<canvas id="myCanvas" width="700" height="400"></canvas>
<div id="but" >
        <button class="but1" οnclick="fa()">确认</button>
        <button class="but2" οnclick=" fn()">重置</button>
</div>

js

var myCanvas = document.getElementById("myCanvas");
var ctx = myCanvas.getContext("2d");
var cz &#