用火狐的话要先定义gradient,不然没反应
context.gradient=context.createRadialGradient(200,200,50,200,200,20);
var gradient=context.gradient;
gradient.addColorStop(0,"#0A0A0A");
gradient.addColorStop(1,"#636766");
context.gradient=context.createRadialGradient(200,200,50,200,200,20);
var gradient=context.gradient;
gradient.addColorStop(0,"#0A0A0A");
gradient.addColorStop(1,"#636766");
这里棋盘线宽度颜色不对的原因:没有设lineWidth所以默认宽度为1px,canvas绘制线条,线条的宽度是以线条的中线向两边延伸确定的。拿moveTo(15,435),lineTo(435,435)这条线来说,实际上绘制时y轴的区域是(434.5,435.5),但浏览器不允许小于1px的图形,所以浏览器处理时虚化,最终绘制的y轴区域是(434,436),线的宽度就成了2px,颜色变浅。这里左上部分比右下部分颜色深应该是浏览器自行处理的结果。要保证正确的宽度和颜色,可以使用0.5大法,xy同时左移或右移0.5.参考网址:http://www.jb51.net/html5/70312.html