htm5 用canvas递归画树

今天看了一篇用canvas画树的文章，代码简单，于是便按照作者的讲述去实现了这个例子，演示网址如下点击打开链接。

代码如下：

// 在文档中创建canvas对象
var canvas = document.createElement("canvas");
ctx = canvas.getContext("2d");
canvas.width = 640;
canvas.height =480;
document.body.appendChild(canvas);

// 定义画树的递归方法
var drawTree = function(ctx, startX, startY, length, angle, depth, branchWidth){
//定义全局变量
var rand = Math.random;
var newLength, newAngle, newDepth,endX, endY, maxBranch=3, maxAngle = 2*Math.PI/4, subBranches;
//开始绘制路径
ctx.beginPath();
ctx.moveTo(startX, startY);  //路径的起点
endX = startX + Math.cos(angle)*length;
endY = startY + Math.sin(angle)*length; // 计算路径的终点


ctx.lineCap = "round"; // 路径的样式
ctx.lineWidth = branchWid