javascript - Bilevel Partition D3 创建一个简单的 2 层

Question

这是我第一次使用 D3，想知道是否有人可以解释我如何创建只有两层的双层分区。

完整和不完整的部分。然后完整的部分显示平均正确和不正确。

我看过这段代码 http://bl.ocks.org/mbostock/5944371

但我并不完全了解它的作用。

Answer 1

代码并不真正关心你向它抛出什么数据，只要它按照它期望的方式格式化即可。

现在，this is the JSON file它正在加载。

制作你自己的 JSON 文件，看起来像

{
  "name": "sections",
  "children": [
    {
      "name": "complete",
      "children": [
        {"name": "correct", "size": 10},
        {"name": "incorrect", "size": 30}
      ]
    },
    {
      "name": "incomplete",
      "size": 20
    }
  ]
}

当您加载它而不是 flare.json 时，看看它是否有效。如果在本地加载文件，使用firefox查看代码，chrome会屏蔽对本地文件的请求。

我让它在 tributary 上有点工作，你可以更改数据和代码，如果你想保存你的编辑，可以 fork 它。 here it is