createRadialGradient

源自：2-4 画棋子

createRadialGradient

这个怎么设置API的，在w3c上也看不明白为什么，求大神详解

提问者：宝慕林2917688 2017-04-12 10:58

个回答

宝慕林2917688

2017-04-14 10:58:41

这个我知道，但渐变过程怎么演示，还有渐变部分怎么截取

0

qq_振宇_03649113: 2017-04-13 15:18:27

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>来自菜鸟教程的代码</title>
</head>
<body>

<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">
您的浏览器不支持 HTML5 canvas 标签。
</canvas>
<div>
x0 :   渐变的开始圆的 x 坐标    </br>
y0 :   渐变的开始圆的 y 坐标    </br>
r0 :   开始圆的半径    </br>
x1 :   渐变的结束圆的 x 坐标    </br>
y1 :   渐变的结束圆的 y 坐标    </br>
r1 :   结束圆的半径    
</div>
<script>
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var grd=ctx.createRadialGradient(75,50,5,90,60,100);
grd.addColorStop(0,"red");
grd.addColorStop(1,"white");
ctx.fillStyle=grd;
ctx.fillRect(10,10,150,100);
</script>

</body>
</html>