Javascript D3.js-从JSON创建多环圆环图数据集

我一直在尝试使用以下json创建一个多环圆环图

var dataset = {
        weeks: [
            {"displayName": "MUW", "name": "DEF", "score": 5},
            {"displayName": "DEFA", "name": "DEF", "score": 35}
        ],
        trimester: [
            {"displayName": "MUsW", "name": "DEsF", "score": 25},
            {"displayName": "DEFdA", "name": "DEdF", "score": 5}
        ]
    };

但是，它并不认为它是D3甜甜圈图表的合适数据集

var gs = svg.selectAll("g")
    .data(d3.values(dataset))
    .enter()
    .append("g")
    .attr("class", "arc");

因为我想从这个数据集中创建两个环，一个在顶部，另一个作为内部甜甜圈。并希望在每次单击甜甜圈切片时显示名称

---

-代码示例。

您正在这样设置数据

.data(d3.values(dataset))

由于您的数据集有两个数组，这并不意味着它将绘制两个圆环图

var gs = svg.selectAll("g")
    .data(d3.values(dataset))
    .enter()
    .append("g")
    .attr("class", "arc");

您需要明确指定两个数组中的哪一个将形成内部圆环图，哪一个将形成外部圆环图

var gs = svg.selectAll("g")
    .data(d3.values(dataset))
    .enter()
    .append("g")
    .attr("class", "arc");

对于第一个甜甜圈图表，您必须如下设置数据：

.data(pie(dataset.weeks))//dataset for weeks

.data(pie(dataset.trimester))//dataset for trimesters.

var pie = d3.layout.pie()
    .sort(null);

对于第二个甜甜圈图表，您必须如下设置数据：

.data(pie(dataset.weeks))//dataset for weeks

.data(pie(dataset.trimester))//dataset for trimesters.

var pie = d3.layout.pie()
    .sort(null);

在您的情况下，您可以这样定义fie函数：

.data(pie(dataset.weeks))//dataset for weeks

.data(pie(dataset.trimester))//dataset for trimesters.

var pie = d3.layout.pie()
    .sort(null);

应该是这样的，value函数缺失，它告诉我们哪个值将构成饼图切片的标准

 var pie = d3.layout.pie()
            .sort(null).value(function (d) {
            return d.score;//since score is the parameter for the pie
        });

工作代码

---

注意悬停时将显示文本。

浏览这些链接-简单甜甜圈（饼图）；-逐步开发的工作示例我已经看到了这一点，但我愿意创建一个多环圆环图。正如我提到的，我有以下数据集。未通过该命令将其识别为正确的数据集形式。您提供的代码不足。问题还不清楚。这是Fiddle的链接，在代码中，您正在制作一个饼。。。而且您设置的数据似乎是错误的。data（d3.values（dataset））我相信您希望在几周内制作一个甜甜圈，在三个月内制作一个甜甜圈