JointJS/Backbone内の複数の同じタグ要素に属性を設定する方法

Question

JointJSには要素にSVGテンプレートマークアップがあり、要素の属性を設定することで出力内容を動的に変更できます。同じタグが複数存在する場合、マークアップ内の特定のタグを選択する方法を見つけることはできません。

JointJSドキュメントが含ま：

別の重要な特性は、サブ要素に設定されるSVG 属性であるサブ要素と値が一致セレクタを表すキー 持つオブジェクトであるattrsあります。

と

[プロパティ]をアクセスまたは定期 バックボーンset()/get()方法

を使用して直接設定することができますので、私は私の質問の懸念のJointJSかどうかわかりませんか、より一般的には、バックボーンやその他のテクノロジに適用されます。

私の問題：

私はマークアップしている場合：

<g class="rotatable"><g class="scalable"><rect/></g><image/><text/></g> 

を私は経由image要素に対応することができます。

element.attr('image', { style: "display: none;" }); 

しかし、私は2つの画像要素をしたいです：

<g class="rotatable"><g class="scalable"><rect/></g><image/><image/><text/></g> 

今すぐ.attr('image')が最初のものにアクセスします。私は2番目のものにアクセスするための構文を見つけることができません。私はのようなものを試してみました：

<g class="rotatable"><g class="scalable"><rect/></g><image id="img1"/><image id="img2"/><text/></g> 

が、仕事にelement.attr('#img2')いないようです。同様に：

<g class="rotatable"><g class="scalable"><rect/></g><image class="img1"/><image class="img2"/><text/></g> 

しかし、element.attr('.img2')は動作していないようです。

アイデア？

Answer 1

私はこの動作が完全にBackboneではなくJointJSコードであると信じています。ドキュメントでは、要素を参照するためにCSSセレクタを使用する方法について説明していますが、使用する必要がある内部的な細分化された構文だと思います。

CSSのように、image .classのようなものをセレクタとして使用することはできないようです。タグ名またはクラス名のいずれかを受け入れますが、両方を受け付けることはできません。だから私は2つのそれぞれの独自のクラス名を<image>に与えて、.class1 & .class2を使って各要素を扱うことができます。