筆畫中的Raphael.js漸變

Question

我製作了一個customAttribute，用於繪製一條線連接圓圈中的2個點（請參閱http://dl.dropbox.com/u/3319121/problem.png上的圖像）。

r.customAttributes.line = function (xloc, yloc, start, end, total, R) { 
var alphas = 360/total * start, 
    alphae = 360/total * end, 
    as = (90 - alphas) * Math.PI/180, 
    ae = (90 - alphae) * Math.PI/180, 
    xs = xloc + R * Math.cos(as), 
    ys = yloc - R * Math.sin(as), 
    xe = xloc + R * Math.cos(ae), 
    ye = yloc - R * Math.sin(ae),      
    path; 
path = [["M", xs, ys], ["Q", xloc, yloc, xe, ye]]; 
return {path: path}; 
}; 

現在我想添加一個漸變。所以你將在點2的點1上有一個從藍色漸變的漸變，以使視覺更加平滑。這對於Raphael.js中的對象是可能的，例如參見http://raphaeljs.com/ichart.html，並且在stackoverflow上已經有答案，可以解答（http://jsfiddle.net/L92Ch/538/），但要在筆畫中添加漸變（不填充）在raphael.js中似乎是不可能的。

有沒有人有解決這個問題的辦法？

Answer 1

格特，

顯而易見的選擇，拉斐爾不能做漸變描邊（據我所知），是假的。我會創建正確尺寸的矩形並進行旋轉，並將其轉化爲位置。

下面是你上面提到的小提琴的example。

很顯然，你被限制在直線上，而不是曲線。

Answer 2

如果我對你的問題的理解是正確的 - 你正試圖在封閉的路徑中創建一個漸變填充。

我已經採取了一些隨機路徑，並填充漸變（從紅色到藍色），它類似於圖像中的內拱。

代碼：http://jsfiddle.net/qp3xf/

感謝

Answer 3

作爲更新rajkamal的回答，您可以應用梯度行程，而不是填充它。 http://jsfiddle.net/yVfhy/