jsonからデータを取得しています
{
"name": "abcd", "size": 150000,
"children": [
{
"name": "Modules", "size": 100000,
"children": [
{"name": "Audio Library", "size": 100000, "info": "hello", "image": "http://s3.amazonaws.com/web2tools-production/images/199/Google_logo.PNG"},
{"name": "CommentBox", "size": 100000, "info": "hi" },
{"name": "Localization", "size": 100000, "info": "hi there"}
]
},
{
"name": "Features", "size": 100000,
"children": [
{"name": "Rapid Development", "size": 100000, "info": "hello", "image": "http://s3.amazonaws.com/web2tools-production/images/199/Google_logo.PNG"},
{"name": "User friendly interface", "size": 100000, "info": "hi" },
{"name": "Highly Customizable", "size": 100000, "info": "hi there"},
{"name": "Full control", "size": 100000, "info": "hi" },
{"name": "Open Source", "size": 100000, "info": "hi there"}
]
}
]
}
今、私はhttp://bl.ocks.org/mbostock/1093130として d3.js を使用して "Collapsible Force Layout" 効果を取得しようとしています。
しかし、最初の読み込み時に最初の子要素のみを読み込みたいです。
私の場合
- 最初のルート----->abcd 最初の子---->モジュール 2 番目の子--->機能
json からすべてのノードを取得するために flatten 関数を使用しています
function flatten(root) {
var nodes = [], i = 0;
function recurse(node) {
if (node.children) node.children.forEach(recurse);
if (!node.id) node.id = ++i;
nodes.push(node);
}
recurse(root);
return nodes;
}
さて、この関数から最初の子要素を取得するにはどうすればよいですか。私は d3.js が初めてで、これについて少し混乱しています。