miterLimit

斜接线长度与一半线宽的比值,如果其长度超过了此值,那么以bevel方式来绘制连接点

  ctx.miterLimit = 10;// 非零正数,默认值10

测验

该属性用于lineJoin=miter时.下图有四个连接点,属性值设置的2,细看第四个连接点,是尖的,而其它是平的(bevel方式)

这说明斜接线长度与两线段连接时的角度有关系,前三个连接点的斜接线长度与一半线宽的比值都大于2,所以采用了bevel方式.第四点则没有超过

斜接线是两线外尖角和内夹角之间的距离.该线与线宽和两线夹角关系如下:

miterLength / stroke-width = 1 / sin ( 夹角 / 2 )

miterLimit默认值为10,是斜接线长度与一半线宽的比值

<<H5核心技术图形动画与游戏开发(David Geary)>> 83页

miterLimit斜接线长度示意图