Question

我有一些数据，这是以秒为单位的时间（来自完成锻炼的人）。我想在HighCharts中绘制这些时间图，但我觉得我这一切都错了。现在我必须用0来填充值之间的空格。另外，请注意有些人在完全相同的时间内完成了

//Time in seconds, already ordered
var rawData = [183, 189, 195, 237, 256, 298, 306, 314, 328, 330, 330, 330, 338, 364, 370, 411, 411, 458, 474, 513, 513, 566, 572, 574, 600];

//Get the smallest & largest values.
//This is simple since it's already ordered
var min = rawData[0];
var max = rawData[rawData.length - 1];

//Now fill in the missing places in the data.
//Count how many items have the exact same value
var graphData = [];
for (var i = min; i <= max; i++) {
  graphData.push(_.filter(rawData,function(m){
    return m === i;
  }).length);
}

我知道这不是做我想做的最好的方法，我知道它有一些错误。谁能建议一个更好的方法呢？

演示：http://codepen.io/chrismbarr/pen/epGGYX?editors=001

Answer 1

你不需要这样做。您只需要创建一个包含x和y值的2D数组，例如

var graphData = [];
for (var i in rawData) {
    graphData.push([rawData[i], _.filter(rawData,function(m){
    return m === rawData[i];
  }).length]);
}

创建一个类似

的数组

[
    [183, 1],
    [189, 1],
    [195, 1],
    [237, 1],
    [256, 1],
    [298, 1], 
    // so on
    [330, 3],
    [330, 3],
    [330, 3],
    // ...
]

<强>更新

另一种选择是

var graphData = [];
for (var i = min; i <= max; i++) {
    var ocurrences = _.filter(rawData, function(m){
        return m === i;
    }).length;
    if (ocurrences > 0) {
       graphData.push([i,ocurrences]);
    }
}

创建

[
    [183, 1],
    [189, 1],
    [195, 1],
    [237, 1],
    [256, 1],
    [298, 1], 
    // so on
    [330, 3],
    // ...
]

这两个选项都有效，您不必担心第一个结果数组中的重复项目，因为Highcharts会将条形图精确地绘制在相同的位置，因此您不会注意到差异。

演示 http://codepen.io/anon/pen/RWLjed?editors=001

HighCharts中的分布图

演示：http://codepen.io/chrismbarr/pen/epGGYX?editors=001

1 个答案: