canvas 画圆弧

我这画彩色过度圆环采用的是画一个圆弧，然后画笔样式是一个渐变色。、

全部代码：

canvas 画圆弧

<canvas id="root" width="600" height="300"></canvas>

var canvas=document.getElementById('root');
var ctx=canvas.getContext('2d');
ctx.fillStyle='#FF0000';	//设置颜色

//声明一个渐变色方法参数为(x1,y1,x2,y2)
var gradient = ctx.createLinearGradient(0,0,400,0);
//可以添加多个颜色过渡
gradient.addColorStop(0,"#29ac8d");
gradient.addColorStop(1,"#e7ad2e");

ctx.strokeStyle = gradient;

ctx.beginPath();
ctx.lineWidth = 10;
//画圆弧，参数(x,y,radius,起始弧度，结束弧度)
ctx.arc(200,150,100,Math.PI/180*180,(Math.PI/180*360),false);
ctx.stroke();