HTML5内向外渐变,HTML5画布：渐变和strokeStyle让我感到困惑

var ctx = document.getElementById('Test').getContext('2d');

ctx.lineWidth = 8;

function addColorStops(gradient) {

gradient.addColorStop(0.5, 'rgba(151, 165, 193, 0.5)');

gradient.addColorStop(1, 'rgba(151, 165, 193, 1)');

}

function drawLine(x1, x2, y) {

var g = ctx.createLinearGradient(x1, y, x2, y);

addColorStops(g);

ctx.strokeStyle = g;

ctx.moveTo(x1, y);

ctx.lineTo(x2, y);

ctx.stroke();

}

drawLine(10, 100, 10);

drawLine(10, 100, 30);

drawLine(10, 100, 50);

代替第一线得到一个非常非常轻微的坡度，第二行得到了相当不错的梯度，最后得到了大幅度的梯度。

我想从任如何参数createLinearGradient都应该工作，或者误解strokeStyle分配如何影响未来招...

2010-11-15

Domenic