javascript - ラファエルの複数のSVGにIDを与える

Question

IDを追加したいSVGが複数あります。問題は、それらがRaphaelオブジェクトによって自動的に作成されることです。ラファエル紙にIDを追加する簡単な方法はありますか？（複数の論文があることに注意してください）

Answer 1

Raphael のすべてのオブジェクトは形状要素を返し、nodeプロパティを使用して生の要素にアクセスできます。そこから、要素に ID を付与するのはかなり簡単です。

たとえば、ID を持つ四角形を作成するには、次のようにします。

paper.rect(0, 0, 300, 300, 0).attr({fill: "orange", stroke: "none"}).node.setAttribute('id', 'myElement');

そして、それが実際に動作していることを確認するための実用的なフィドル: http://jsfiddle.net/CwmZr/1/

Raphael が常に SVG を使用するとは限らないことに注意してください。古いバージョンの IE では VML を使用するためnode、SVG 要素ではなく VML 要素を参照する可能性があります。

編集：

paper オブジェクト (<svg />要素) の ID を設定する場合は、次のようにします。

var paper = //get the paper object
paper.canvas.setAttribute('id', 'mySvgElement');