html5已经出来好长一段时间了，只是最近才开始接触到它，html5提供了很多内置的函数可以实现很多功能，比如 画线段、画矩形、画圆、画弧等。但是html5没有提供画虚线的功能，如果想实现在canvas上画曲线就要发费一点功夫了。
下面提供两种方式实现画虚线的功能：
方法一就是就是单独写一个函数，当想画曲线的时候就调用这个曲线就行了。
function drawDashLine(context , x, y, x2, y2, dashLength){dashLength=dashLength === undefiend?5:dashLength;var deltaX = x2-x;var deltaY = y2-y;var numDashs = Math.floor(Math.sqrt(deltaX*deltaX+detalY*deltaY)/dashLenght);for(var i =0 ;i<numDashs;i++){context[i%2===0?'moveTo':'lineTo'](x+deltaX/numDashs,y+deltaY/numDashs);}context.stroke();}当需要画虚线的时候直接调用这个方法就行了。但是有的人可能会需要将这个函数直接植入到html5，，以方便任何时候调用，这也是可行的，但是只是针对你自己使用。
方法二，上面已经提示到了，可以将这个方法直接植入到html5，当做canvas的一个函数，
CanvasRenderingContext2D.prototype.dashedLine = function(x,y,x2,y2,dashArray){var temp = 0.1;if (!dashArray)dashArray = [ 10, 5 ];var dashCount = dashArray.length;this.moveTo(x + temp, y + temp);var dx = (x2 – x), dy = (y2 – y);var slope = dx ? dy / dx : 1e15;var distRemaining = Math.sqrt(dx * dx + dy * dy);var dashIndex = 0, draw = true;while (distRemaining >= 0.1 && dashIndex < 10000){var dashLength = dashArray[dashIndex++ % dashCount];if (dashLength == 0)dashLength = 0.001; // Hack for Safariif (dashLength > distRemaining)dashLength = distRemaining;var xStep = Math.sqrt(dashLength * dashLength / (1 + slope * slope));x += xStep;y += slope * xStep;this[draw ? 'lineTo' : 'moveTo'](x + temp, y + temp);distRemaining -= dashLength;draw = !draw;}// Ensure that the last segment is closed for proper strokingthis.moveTo(0, 0);}实际上方法二不仅可以画虚线，虚线只是其中之一的功能，主要的区别在于最后一个参数的设置，设置的不同，所绘制的虚线类型也不相同。至于为什么，大家如果愿意的话，可以自己去研究一下。
从此便踏上征途，也许会孤独一程。
