Question

这里我将json数据作为

{
"nodes": [{
    "name": "Tomcat",
    "comp_type": "tomcat_155:7077",
    "id": "tomcat_155:7077",
    "pie": true,
    "url": "../images/component_icons/1424962275_f-server_128.svg",
    "group": 1,
    "fixed": true
}, {
    "name": "lraj_155_Nov_3(MS SQL)",
    "comp_type": "192.168.11.212:1433_Ba",
    "id": "lraj_155_Nov_3(MS SQL)",
    "pie": false,
    "url": "../images/component_icons/1424962160_19.svg",
    "group": 2,
    "fixed": true
}, {
    "name": "rajesh_window",
    "comp_type": "192.234.11.116:1433_window",
    "id": "rajesh_window",
    "pie": false,
    "url": "../images/component_icons/1424882359_database.svg",
    "group": 3,
    "fixed": true
}, {
    "name": "shanker_ux_win_3(PS)",
    "comp_type": "192.168.11.116:1433_window",
    "pie": true,
    "id": "shanker_ux_win_3(PS)",
    "url": "../images/component_icons/1424882359_database.svg",
    "group": 4,
    "fixed": true
}],
"links": [{
    "source": 1,
    "target": 0,
    "description": "windows flows",
    "value": 1
}, {
    "source": 2,
    "description": "SQLMS(36.67%)",
    "target": 0,
    "value": 8
}, {
    "source": 1,
    "description": "",
    "target": 0,
    "value": 8
}, {
    "source": 3,
    "target": 2,
    "description": "ctrix 6765",
    "value": 1
}]

}

每个节点包含真或假的PIE。因此，当我渲染d3强制布局时，如果PIE为真，则圆圈必须附加到组别，否则不得附加圆圈。

请帮帮我。提前谢谢。

Answer 1

您可以使用过滤器执行此操作。例如，假设您为每个数据附加了g元素，而仅为pie == true的那些附加了圈子：

d3.selectAll("g").data(json.nodes)
  .enter().append("g")
  .filter(function(d) { return d.pie; })
  .append("circle");

D3.js根据JSON值将圆圈附加到GROUP

1 个答案: