ラファエルアイコンサイズ

Question

は、私はこのように私のウェブサイトにカップルラファエルアイコンがあります。

var emailIcon = Raphael("js-email-icon"); 
    emailIcon.path('M28.516,7.167H3.482l12.517,7.108L28.516,7.167zM16.74,17.303C16.51,17.434,16.255,17.5,16,17.5s-0.51-0.066-0.741-0.197L2.5,10.06v14.773h27V10.06L16.74,17.303z').attr({fill: '#ff00ff', stroke: "none"}); 

にはどうすればいいのアイコンを大きくすることができますか？

ありがとうございます！

メガバイト

Answer 1

EDIT：[OK]を、あなたはおそらくの.css（）はどこから来るかであるjQueryのを使用していないことに気づきました。

私はjqueryのを使用することをお勧めし、しようとするだろう：

$(emailIcon.path('M28.516,7.167H3.482l12.517,7.108L28.516,7.167zM16.74,17.303C16.51,17.434,16.255,17.5,16,17.5s-0.51-0.066-0.741-0.197L2.5,10.06v14.773h27V10.06L16.74,17.303z').attr({fill: '#ff00ff', stroke: "none"})).css({width: "500px", height: "500px"}); 

あなたがしたくない場合は、私はちょうどそう$(...).css({width:'500px',height:'500px'})

または

$(emailIcon.path(...).attr({fill...stroke...})).css({width:'500px',height:'500px'}); 

ようattrにすべてを包みましたjQueryを使用し、Rapheal .attr（）関数を使用してDOM要素を返すことができます。

例えば、通常のサイズの150％にするために：

var tmp = emailIcon.path(...).attr({fill...stroke...}); 
tmp.style.width= '500px'; 
tmp.style.height= '500px'; 

Answer 2

使用方法は、変換

var emailIcon = Raphael("js-email-icon"); 
var iconPath = emailIcon.path('M28.516,7.167H3.482l12.517,7.108L28.516,7.167zM16.74,17.303C16.51,17.434,16.255,17.5,16,17.5s-0.51-0.066-0.741-0.197L2.5,10.06v14.773h27V10.06L16.74,17.303z').attr({fill: '#ff00ff', stroke: "none"}); 
iconPath.transform("s1.5"); 

Answer 3

あなたは、最も簡単な方法で動作するように、実際のSVGファイルがある場合はIアイコンのサイズを変更するには、Adobe IllustratorやInkscapeなどのプログラムを使用することをお勧めします。これが完了すると、パス情報を抽出して大きなアイコンが表示されます。

これらのプログラムは、すべての乱雑な経路計算を行い、コードを適用する前にどのように見えるかを見ることができます。ただし、Inkscapeを使用する場合は注意が必要です。パスを変更しないで、Raphaelユーザーのために何もしないオブジェクトに変換を追加することがあるためです。