D3.jsのselection.styleとselection.attrの違いは何ですか？

Question

私はそれらの両方が、私のテストで動作しますが見つかりました：

.on("mouseover", 
     function() { 
      d3.select(this) 
       .select("text") 
       .style("fill","red"); 
     }) 

または

.on("mouseover", 
     function() { 
      d3.select(this) 
       .select("text") 
       .attr("fill","red"); 
     }) 

Answer 1

あなたが得るHTMLを見れば、あなたが何かわかります

<text style="fill: red">... 

をおよび

<text fill="red">... 

..どちらもSVGでは合法ですが、スタイルが必要なときにattrを使用すると、別のものに使用するとあなたのことが飛び出すことがあります。

Answer 2

これは、d3で作成したsvgオブジェクトによって若干異なります。

円要素を作成する場合は、円要素の形状と位置を定義する 'x'、 'y'、 'r'属性（attr）があります。

通常、属性はsvgオブジェクトのサイズと形状を表しますが、スタイルは通常、ビジュアライゼーションで使用するsvgオブジェクトのより面的な側面を示します。