路径样式

---

• lineCap
• lineJoin

---

lineCap

• 在绘制长度为 100px ，宽度为 10px 的线条；butt 是 100px 长，round 和 square 是 110px 长

        ctx.lineWidth = 10;
        
        ctx.lineCap = 'butt';
        ctx.beginPath();
        ctx.moveTo(100, 100);
        ctx.lineTo(200,100);
        ctx.stroke()

        ctx.lineCap = 'round';
        ctx.beginPath();
        ctx.moveTo(100, 50);
        ctx.lineTo(200,50);
        ctx.stroke()

        ctx.lineCap = 'square';
        ctx.beginPath();
        ctx.moveTo(100, 75);
        ctx.lineTo(200,75);
        ctx.stroke()

lineJoin

// 绘制转角
        ctx.lineWidth = 10;
        ctx.lineJoin = 'miter'
        ctx.beginPath();
        ctx.moveTo(10,10);
        ctx.lineTo(50,50);
        ctx.lineTo(90,10);
        ctx.stroke();