Javascript 如何使用HTML5画布绘制带中心淡出渐变的圆?
如何绘制渐变淡出的圆 我的意思是这样的:Javascript 如何使用HTML5画布绘制带中心淡出渐变的圆?,javascript,html,canvas,draw,gradient,Javascript,Html,Canvas,Draw,Gradient,如何绘制渐变淡出的圆 我的意思是这样的: 越来越暗…您想使用ctx.createRadialGradient()方法 var canvas = document.getElementById('canvas'); var ctx = canvas.getContext('2d'); var x = 100, y = 75, // Radii of the white glow. innerRadius = 5, outerRadius = 70, //
越来越暗…您想使用
ctx.createRadialGradient()
方法
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var x = 100,
y = 75,
// Radii of the white glow.
innerRadius = 5,
outerRadius = 70,
// Radius of the entire circle.
radius = 60;
var gradient = ctx.createRadialGradient(x, y, innerRadius, x, y, outerRadius);
gradient.addColorStop(0, 'white');
gradient.addColorStop(1, 'blue');
ctx.arc(x, y, radius, 0, 2 * Math.PI);
ctx.fillStyle = gradient;
ctx.fill();
示例:我的意思是像一个径向梯度……根据公认的答案,这里有一个不错的粒子: