3

この単純なjsfiddleを見てください：http：//jsfiddle.net/perikut/9qUVW/2/ （ Firefoxを使用している場合は申し訳ありませんが、なぜ見栄えが悪いのかわかりません...）

ここに画像の説明を入力してください

オブジェクトでは、「children」以外の単語を使用して、どこからデータを抽出するかを示すことができますか？（私が見るすべての例は、このデータ構造に従います。以下を参照してください）。どこにそれを示すべきですか？

グループ/親から子を表示/非表示にするために'group'パラメーターの2倍を宣言する必要があるため、コードはかなり不十分だと思います（jsfiddleを参照）。

group1の子ノードを直接選択してアニメーションを適用する方法はありませんか？将来的にはもっと複雑なデータ構造が欲しいので、この種の基本を前もって知っておく必要があります。

現在のデータ構造：

data = {
name:'root',
group:'no_group',
children:[
    {
        group: 'group1',
        children:[
            { group:'group1',name:'a1',value:10,color:'red' },
            { group:'group1',name:'a2',value:40,color:'lightcoral' }
        ]
    }
    , { .... }
4

1 に答える 1

4

D3の階層レイアウトでは、すべてのノードに「親」属性を含む一連の標準属性が入力されます。したがって、「グループ」属性を指定することを避け、特定のノードの子を選択するときに代わりに「親」を使用できます。

d3.selectAll("circle").filter(function(d) { return d.parent.name === "foo"; });

または、ノードオブジェクト自体への参照がある場合は、オブジェクト参照で比較できます。

var parent = nodes.filter(function(d) { return d.name === "foo"; });
d3.selectAll("circle").filter(function(d) { return d.parent === parent; });

ここでは、各ノードに「名前」属性があると想定しています。

また、別の属性から子を取得する方法についても言及しました。はい、これは「子供」アクセサーを使用して実現できます。これにより、ノードの子がそのノードの「children」という属性に格納され、すでに存在する可能性のあるものがすべて上書きされることに注意してください。

于 2012-07-31T15:56:49.193 に答える