HTML Canvas 渐变 gradation

 http://www.w3school.com.cn/html5/html_5_canvas.asp

 

 

实例 - 渐变

使用您指定的颜色来绘制渐变背景：


JavaScript 代码：
<script type="text/javascript">

var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var grd=cxt.createLinearGradient(0,0,175,50);
grd.addColorStop(0,"#FF0000");
grd.addColorStop(1,"#00FF00");
cxt.fillStyle=grd;

 

 

cxt.fillRect(0,0,175,50);

</script>

canvas 元素：
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>