canvas-05 描边样式

影响描边样式的因素：

strokeStyle:描边的颜色

    ctx.strokeStyle='maroon';

lineWidth:描边宽

    ctx.lineWidth=40;

lineCap:描边端点样式

    ctx.lineCap='butt'; //butt  没有端点，默认

    ctx.lineCap='round';  // round 圆形端点

    ctx.lineCap='square';  // square 方形端点

lineCap ：  butt    round    square 

lineJoin:描边拐角类型

    ctx.lineJoin='miter'; //miter 尖角 默认

    ctx.lineJoin='round'; // round 圆角

    ctx.lineJoin='bevel';  //  bevel 切角

lineJoin：  miter    round    bevel 

miterLimit:拐角最大厚度（只适用于lineJoin=“miter”的情况） number 类型，如2,1,3

setLineDash(segments):将描边设置为虚线，可以通过getLineDash()方法获取虚线样式

        /* setLineDash(segments) 虚线   一个Array数组*/

        ctx.save();

        ctx.beginPath();

        ctx.moveTo(20, 20);

　　 ctx.lineTo(400, 20);

        ctx.setLineDash([5, 15]);

        ctx.stroke();

        ctx.restore();

setLineDash  虚线

lineDashOffset:虚线的偏移量

        ctx.save();

        ctx.beginPath();

        ctx.moveTo(50,100);

        ctx.lineTo(700,100);

        ctx.setLineDash([60]);

        ctx.stroke();

        ctx.restore();

        ctx.save();

        ctx.beginPath();

        ctx.moveTo(50,150);

        ctx.lineTo(700,150);

        ctx.setLineDash([60]);

        ctx.lineDashOffset=-90;

        ctx.stroke();

        ctx.restore();

lineDashOffset