如何使用非数字值的百分比创建d3饼图？

-1

[{ 
    "sex" : "male", 
    "name" : "Ted", 
    "country": "USA" 
}, { 
    "sex" : "male", 
    "name" : "Mark", 
    "country": "Hungary" 
}, { 
    "sex" : "female", 
    "name" : "Mary", 
    "country": "Australia" 
}, { 
    "sex" : "male", 
    "name" : "Valery", 
    "country": "India" 
}, { 
    "sex" : "female", 
    "name " : "Olga", 
    "country": "Ireland" 
}]

我想借助d3.JS将此JSON文件转换为饼图以显示男性和女性的百分比。例如，应该有大约70％的男性和30％的女性。我见过饼图的例子，但它们是从数值创建的。一个例子是我想要的，但它是由CSV文件构成的： http://bl.ocks.org/phil-pedruco/a326c32fb44b10d979d2 - 我试着为我管理这段代码，但不起作用，不幸的是： http://plnkr.co/edit/cE77QKAeDKi304666cWJ?p=preview 您能否提供一些信息？如何使用非数字值的百分比创建d3饼图？

来源

2015-11-22 rinatoptimus

为什么不将此数据结构转换为正确的格式？即统计男性的数量！ –

是的，我想过，但我没有经历过这个（ – rinatoptimus

开始学习Javascript。 –

如果认为你需要看看数据嵌套如何工作。一个好的起点是阅读D3js documentation看看some examples on nesting data with d3

如果你想创建从您的JSON可以嵌套男性和女性的数量饼图数据由sex，然后汇总通过的长度数组已创建。

var data = d3.nest() 
    .key(function(d) { 
     return d.sex; 
    }) 
    .rollup(function(d) { 
     return d.length; 
    }).entries(json_data);

要通过创建嵌套数据得到的百分比可以循环，并与您json_data的总长度划分。

data.forEach(function(d) { 
    d.percentage = d.values/json_data.length; 
});

来源

2015-11-22 08:56:53

谢谢，乔纳斯，它的工作原理！ – rinatoptimus

如何使用非数字值的百分比创建d3饼图？

回答

相关问题