javascript - raphael jsで棒状の円柱を描く

Question

Raphael js を使用して棒状の構造を描画し、グラデーション効果を与えて 3D 効果を表示したいと考えています。しかし、私は初心者なので、これを達成することはできません。誰かが私にそれを行う方法を提案できますか? 助けてくれてありがとう

Answer 1

私が知っていることをお話しします。オブジェクトをグラデーションで塗りつぶします。私はあなたが見るためにいくつかの長方形を作りました. それらをいじって、グラデーションの塗りつぶしがどのように機能するかを理解してください。それが私がしたことです。:)

var paper = Raphael("holder");
paper.setSize(400, 400);
rect = paper.rect(25, 50, 25, 300).attr({fill: "180-#FFF:10-#f00:80-#000:95"});
rect = paper.rect(100, 50, 25, 300).attr({fill: "0-#FFF:10-#f00:80-#000:95"});
rect = paper.rect(175, 50, 25, 300).attr({fill: "90-#FFF:5-#f00:80-#000:95"});

塗りつぶしの最初の数値は、塗りつぶしの回転です。色に続く数字 (例: #FFF:5) はオフセットです。

これは、いくつかの良い回答/情報を含む同様の質問です: ラファエルでグラデーションオブジェクトを作成する方法