0

我正在修改原始的 D3 Sequence Sunburst 文件以更好地满足我的需要。原始colors变量是一个硬编码的对象。这显然不是最好的方法。我正在使用flare.json 示例，该示例更大，更难阅读，并且仍然比我在测试后将成为用户的json 文件小得多。

我想随机生成颜色，将它们应用于createvisualization函数中的每个数据，但我是 D3 的新手，不知道如何 1）从 json 文件中获取名称（除了叶子之外的所有内容），以及 2）将它们与随机颜色配对。

编辑：

添加随机颜色并应用它们原来是微不足道的，

var colors = d3.scale.category10();
...
.style("fill", function(d,i) { return colors(i); })

但我仍然注意到如何获取 json 中所有非叶子的名称，然后从随机颜色和非叶子创建一个数组。

非常感谢这里的帮助。

4

1 回答 1

1

要获取所有非叶子元素的名称，您可以执行以下操作。

var names = [];

function getNames(node) {
  if(node.children) {
    names.push(node.name);
    node.children.forEach(function(c) { getNames(c); });
  }
}

getNames(root);

运行此代码后，names将包含您想要的所有名称。然后从中生成图例，您可以使用names数组作为数据：

var gs = svg.selectAll("g.name").data(names).enter().append("g").attr("class", "name");
gs.append("rect")
  // set position, size etc
  .attr("fill", d);
gs.append("text")
  // set position etc
  .text(String);

这将为g每个名称附加一个元素，并在每个g元素内附加一个rect填充有与名称对应的颜色的text元素和一个显示名称的元素。

于 2014-02-01T19:31:47.087 回答