免責事項：私はD3の新機能ですので、これは可能ですが、何を探し出すのかをまだ理解していないことは確かです。D3で重く入れ子になったオブジェクトを扱う方法
私は、ネストされたJSONオブジェクト/配列でいっぱいになっている1つの大きな配列からD3を使用して視覚化を作成しようとしています。例のために、のは私のオブジェクトは、次のようになりましょう：今すぐ
var arr = [
{
"name":"John",
"info":[
{
"age":31,
"height":6,
"weight":155,
"eyes":"green"
},
{
"age":35,
"height":6,
"weight":165,
"eyes":"green"
}
]
},
{
"name":"Eric",
"info":[
{
"age":29,
"height":5,
"weight":135,
"eyes":"brown"
},
{
"age":30,
"height":5,
"weight":155,
"eyes":"brown"
}
]
}
]
、私はオブジェクトの入れ子レベルが反映さよりも、このデータを取得し、それを視覚化したいのですが、スタイリングのためのより多くのdivを使用する必要があると言います。だから、私はこのようなコードをしたい：
今<div>
<h1>John</h1>
<div>
<div>
<div>
<h2>Age:31</h2>
<div>
<p>Weight:155</p>
</div>
</div>
<div>
<h2>Age:35</h2>
<div>
<p>Weight:165</p>
</div>
</div>
</div>
</div>
</div>
<div>
<h1>Eric</h1>
<div>
<div>
<div>
<h2>Age:29</h2>
<div>
<p>Weight:135</p>
</div>
</div>
<div>
<h2>Age:30</h2>
<div>
<p>Weight:155</p>
</div>
</div>
</div>
</div>
</div>
、私は余分なdiv要素を持っていなかった場合、
var visualization = d3.select("body").selectAll("div")
.data(arr)
.enter()
.append("div");
var person = visualization.selectAll("h1")
.data(function(d){return(d.name)}
.enter()
.append("h1")
.text(function(d){return d});
を使用することはかなり簡単であると思います。そして、私は同じことを行うことができます私が必要とするものを作成するためにdivsとd.infoをループします。しかし、ネストされたdivを追加すると、もはや親のデータをループスルーすることができなくなり、.data（）によって自動ループで親divのインデックスが見つからないように見えます。
本当に、arr []の長さに基づいてdivを作成し、そのdivに "name"のような情報を追加してから、スタイルdivのためにdivをルートdivに追加してからループするためにそのルートdivのデータだけに戻ります。私はこれを行うためにD3を使いたいと思っていますが、これはそれが構築されていることを知っていますが、この時点では、私が使用しているインデックスを知っているループを使って、ネストされたデータ。うまくいけばそれは理にかなっていますが、私はD3を使って正しく行う方法について完全に固執しています。
これが不明な点があるかどうか尋ねてください。実際にこれを理解したいと考えてください。ありがとう！