画出你的风格：HTML5创意画板的设计教程(5)

那如果我们要实现蜡笔的效果。要怎么处理呢,如果我们将蜡笔画放大后看就会知道那是一些很小的分散颗粒状大小的粒子，这样我们就有了思路了。我们还是沿用DEMO3的例子，在其基础上进行开发，需要注意的一点是粒子的分布问题，如何才能将粒子均匀的分布呢，不知道大伙们这么久没学数学是不是都将知识还给老师了。这里我们会用到一些基本的数学知识， 具体思路请看下图，

请参照源代码

　　draw: function(ctx) {
            var v = this.subtract(this._latest);//当前点与下一个点的距离的横纵坐标
            var s = Math.ceil(this.size / 2);		//算出粒子的单位长度
            var stepNum = Math.floor(v.length() / s) + 1;	//算出步长  v.length()为斜线长度
            v.normalize(s);//当前点与下一个点的

            var sep = 1.5; // 分割数  控制画笔的浓密程度  关键所在
			//粒子的大小 根据画笔描绘的速度（画笔的停留时间）进行调整
            var dotSize = sep * Math.min(this.inkAmount / this._latestStrokeLength * 3, 1);
            var dotNum = Math.ceil(this.size * sep);
            var range = this.size / 2;
            var i, j, p, r, c, x, y;
			$whitemode_display.innerHTML="绘制的画笔颜色是"+brush_color;
            ctx.save();
            ctx.fillStyle = currentColor;
			$pos_display.innerHTML='你上一点鼠标的位置为('+this.x+','+this.y+').
你当前鼠标的位置为('+this._latest.x