首页 > 代码库 > 【Canvas】树冠

【Canvas】树冠

<!DOCTYPE html><html><head>  <meta charset="utf-8">  <title>JS Bin</title></head><body>  <canvas id=‘drawRect‘ width=‘300‘ height=‘300‘></canvas></body></html>
function darwTrails(){  var canvas = document.getElementById(‘drawRect‘);  var context = canvas.getContext(‘2d‘);  context.save();  context.translate(130,250);  createTree(context);  context.restore();}function createTree(context){  context.beginPath();  context.moveTo(-25,-50);  context.lineTo(-10,-80);  context.lineTo(-20,-80);  context.lineTo(-5,-110);  context.lineTo(-15,-110);  context.lineTo(0,-140);  context.lineTo(15,-110);  context.lineTo(5,-110);  context.lineTo(20,-80);  context.lineTo(10,-80);  context.lineTo(25,-50);  context.lineWidth=4;  context.lineJoin =‘round‘;  context.strokeStyle=‘#663300‘;  context.lineCap=‘butt‘;  context.fillStyle=‘#339900‘;  context.fill();  context.closePath();  context.stroke();
//树干

   context.fillStyle=‘#663300‘;
   context.fillRect(-5,-50,10,50);

}window.addEventListener(‘load‘,darwTrails,true);