Question

一些js：

var cityDivisionJSON = '[\
{"city":"Челябинск","percentage":"66.67"},\
{"city":"Аша","percentage":"16.67"},\
{"city":"Бакал","percentage":"16.67"},\
{"city":"Верхний Уфалей","percentage":"0"},\
{"city":"Еманжелинск","percentage":"0"},\
{"city":"Златоуст","percentage":"0"},\
{"city":"Карабаш","percentage":"0"},\
{"city":"Карталы","percentage":"0"},\
{"city":"Касли","percentage":"0"},\
{"city":"Катав-Ивановск","percentage":"0"},\
{"city":"Коркино","percentage":"0"},\
{"city":"Куса","percentage":"0"},\
{"city":"Кыштым","percentage":"0"},\
{"city":"Магнитогорск","percentage":"0"},\
{"city":"Миасс","percentage":"0"},\
{"city":"Миньяр","percentage":"0"},\
{"city":"Нязепетровск","percentage":"0"},\
{"city":"Сатка","percentage":"0"},\
{"city":"Сим","percentage":"0"},\
{"city":"Снежинск","percentage":"0"},\
{"city":"Трехгорный","percentage":"0"},\
{"city":"Троицк","percentage":"0"},\
{"city":"Усть-Катав","percentage":"0"},\
{"city":"Чебаркуль","percentage":"0"},\
{"city":"Южноуральск","percentage":"0"},\
{"city":"Юрюзань","percentage":"0"}\
]';
    root=JSON.parse(cityDivisionJSON);
    var arcs=group.selectAll(".arc")
        .data(pie(data))
        .enter()
        .append("g")
        .attr("class","arc")
        .on("mouseover",toggleArc)
        .on("mouseleave",toggleArc)
        .append("path")
        .attr("d",arc)
        .attr("fill",function(d){return color(d.data.percentage);});
        group
        .append("circle")
        .style("fill","white")
        .attr("r",radius-20);

它说：数据未定义

Answer 1

root = JSON.parse(cityDivision);
var arcs= d3.selectAll(".arc")
        .data(pie(root))
        .enter()

您在任何地方都没有data变量，这就是为什么.data(pie(data))会为您提供数据未定义的错误。

将其替换为.data(pie(root))。

同样在d3.js中，没有group.selectAll。而是使用d3.selectAll()。

这应该可以解决您的问题

d3.js中json字符串的问题

1 个答案: