Raphaelはパターンをサポートしていないようですが、fill属性の値として線形グラデーションをサポートしています。
グラデーション
「‹角度›-‹色› [-‹色› [:‹オフセット›]] *-‹色›」、例:「90-#fff-#000」–白から黒への90°グラデーションまたは「0- #fff-#f00:20-#000 "–白から赤(20%)、黒への0°のグラデーション。
したがって、Raphaelのドキュメントで説明されている線形グラデーション形式を使用して、縞模様のグラデーションを作成できます。ストライプのグラデーション文字列を生成する関数を作成することはおそらく理にかなっています。
function gradientString(color1, color2, step) {
var gradient = '0-' + color1,
stripe = false,
i;
for (i = 0; i < 100; i += step) {
if (stripe) {
gradient += '-' + color1 + ':' + i + '-' + color2 + ':' + i;
} else {
gradient += '-' + color2 + ':' + i + '-' + color1 + ':' + i;
}
stripe = !stripe;
}
return gradient;
}
var paper = Raphael(150, 150, 320, 320);
var oval = paper.rect(0, 0, 100, 50, 25);
oval.attr('fill', gradientString('white', 'crimson', 2));
oval.attr('stroke', 'crimson');
参照: http: //jsfiddle.net/p4Qgw/