重複した値と重複しているselectAllはD3にあります

Question

私はd3.js noobですので、すぐに練習を始めました。 異なるパターンのテキストを追加していますので、selectAll("text")ステートメントを使ってさまざまな機能を使用しています。

しかし、これに問題がありました。 3つのラベルを付け加えて4つを追加しようとすると、4番目のラベルのみが適用されます。 selectAllは既に挿入されているものを通過するためです。この問題を調べると、解決策は.data(data, function(d){ return d; })で、新しい要素が正しく追加されていることがわかった。これまで私の問題はすべて解決されました。

"40"と "60"の値を2つの異なるコンテキストに2回追加する必要があるので、重複した値は無視されます。 もう一度私は解決策を見つけて、この投稿に来ました。Complex data object with duplicate 'values' = missing chart bars解決策は、私が前に述べた同じ行を削除したり、別の値を使うことですが、私の場合は数字の単純な配列を扱っています。そして、次の要素が追加されないので、前の要素を含む行を削除することは役に立ちません。

EDIT：これについて議論しているgithubの問題があります。Clarify behavior for selection.data in re. to duplicate keys. #997 - それは決して明確ではありませんでした。にインデックスを追加し、ここで、あなたのデータを無修正で十分に文書化バグを微調整することができている。このためjsFiddle explaining the issue

Answer 1

です：おそらく、あなたは

EDIT 2 ...私がやったよりも、それをより良い感覚を作ってあげます重複キーに間違った選択を防ぐ：

[{index:1, value:3}, 
{index:2, value:2}, 
{index:3, value:3}] 

として参照：d.indexとd.value：

d3.select(".I997").selectAll("p") 
      .data([{index:1, value:3},{index:2, value:2},{index:3, value:3}]) 
     .enter() 
     .append("p") 
     .text(function (d) {return d.value}) 

d3.selectAll("p") 
     .data([{index:4, value:3}]) 
     .append ("p") 
     .text(function (d) {return d.value}) 

か、この使用することができます：

0123を

var ps = d3.select("body").selectAll('div') 
    .data([3, 2, 3]) 
    .enter() 
    .append('div') 
    .text(String); 

d3.selectAll('div') 
    .data([3]) 
    .append('div') 
    .text(String); 

あなたはここで作業コード

期待するとして、これは動作します：https://jsfiddle.net/5rxadq4q/

https://jsfiddle.net/v0n8971q/1/