使用D3js v4的d3.hierarchy的旭日形图的数据

Question

我正在尝试使用d3.hierarchy和d3js v4获得一个旭日形图.我在 这里做了同样的例子.但是由于我作为对象数组得到的数据与示例中使用的数据不一样,所以我添加了一个小函数,以便数据与示例中的数据相同.以下是功能

const arrayToObject = (array) =>
    array.reduce((obj, item) => {
        obj[item.name] = item
        return obj
}, {})

这是小提琴的链接:https: //jsfiddle.net/snt1/mbszu1u5/8/

谢谢.

Answer 1

我不确定这是否是一个答案（我认为是）或者我应该将其作为评论发布，但这就是您的代码的问题：

d3.hierarchy()查找具有“name”和“children”的对象并操作随后由partition(root).

如果您在https://bl.ocks.org/maybelinot/5552606564ef37b5de7e47ed2b7dc099调试代码，您将看到d3.hierarchy()接收一个对象为{name: "flare", children: Array[15]}

在您的代码中，如果我只是将data数组包装在一个对象中，例如： {name: "test", children: data}，它会创建一个具有颜色和适当标题的旭日。

这是一个修改的小提琴。（顺便说一句，我已经评论过arrayToObject）

希望这可以帮助。:)