Question

我是javascript（以及Stack Overflow）的新手，我遇到了一个我似乎无法解决的问题。我正在尝试生成一个简单的饼图，显示我的数据中每个技术值的项目数。这是我正在使用的数据类型：

[Project1，Java]
[Project2，Excel]
[Project3，SAS]
[Project4，Java]

上例中的饼比为2：1：1。

我的代码的第一部分加载数据并将其推送到包含[project，tech]的数组“techArray”。这部分工作正常 - 我已经在代码的简化版本中验证了它。

然后我想将数组“techArray”分组并计算每个技术的实例。为此，我使用的是Underscore库，如下所示：

var chartData = [];
var techData = _.groupBy(techArray, 'tech');
_.each(techData, function(row) {
    var techCount = row.length;
    chartData = push( {
        name: row[0].tech,
        y: techCount
    });
});

然后脚本使用highcharts呈现chartData数组。同样，我已经验证此部分使用简化（未组合）版本。

上面列出的分组/计数步骤一定存在问题，因为我看不到输出，但我根本找不到位置。我的解决方案基于以下工作示例：Worked example。

如果有人能够在我写的内容中发现错误，或提出另一种分组阵列的方式，我将非常感激。这似乎应该比它证明的更简单。

Answer 1

可以使用

countBy代替groupBy：

var techArray = [
    { project: 'Project1', tech: 'Java'},
    { project: 'Project2', tech: 'Excel'},
    { project: 'Project3', tech: 'SAS'},
    { project: 'Project4', tech: 'Java'},
];

var counts = _.countBy(techArray,'tech');

这将返回一个对象，其中tech为属性，其值为count：

{ Java: 2, Excel: 1, SAS: 1 }

要获取highcharts表单中的数据，请使用map而不是每个：

var data = _.map(counts, function(value, key){
    return {
        name: key,
        y: value
    };
});

Answer 2

这应该有效

var techArray = [['Project1','Java'], ['Project2', 'excel'], ['Project3', 'Java']];

var chartData = [];
var techData = _.groupBy(techArray, function(item) {
    return item[1];
});
_.each(techData, function(value, key) {
    var techCount = value.length;
    chartData.push({
        name: key,
        y: techCount
    });
});

_.groupBy需要获取属性名称或返回分组值的函数。数组没有tech属性，因此您无法通过它进行分组。但是，由于我们的techArray是一个元组数组，我们可以传递一个函数_.groupBy，它返回我们想要groupBy的值，即每个元组中的第二个项。

chartData现在看起来像这样：

[{
    name: 'Java',
    y: 2
}, {
    name: 'excel',
    y: 1
}]

使用underscore.js在javascript中分组/计数

2 个答案: