Question

我正在使用highcharts，我有一个像这样的数组

visits=["Wed, 01 Jan 2014 14:09:01 GMT","Wed, 01 Jan 2014 14:11:01 GMT","Wed, 01 Jan 2014 16:11:01 GMT"]

我想制作一个图表，显示每小时有多少人访问过我的网站。所以在上面的例子中，图形将有两个点，一个点为2（因为两个访问在1小时内，前两个元素）和另一个数据点在1。

我不确定在highcharts中是否有任何功能可以帮助我解决这个问题。如果有，请告诉我。如果没有，任何关于自己创建算法的建议都会很棒。

提前谢谢。

Answer 1

这是一些示例代码。注意，我正在使用momentjs来进行日期解析。

var visits=["Wed, 01 Jan 2014 14:09:01 GMT","Wed, 01 Jan 2014 14:11:01 GMT","Wed, 01 Jan 2014 16:11:01 GMT"]

var counts = {};
for (var i = 0; i < visits.length; i++){
    // create unique key of date/hour using momentjs
    var key = moment(visits[i]).format("YYYY, MMM DD, HH"); 
    // count them up
    if (key in counts){
        counts[key] += 1;   
    }else{
        counts[key] = 1;   
    }
}

// get data in correct format for highcharts
var cats = [];
var data = [];
for (var key in counts){
    cats.push(key);
    data.push(counts[key]);
}

// build chart
$('#container').highcharts({
    chart: {
        type: 'column'
    },
    xAxis:{
        categories:  cats
    },
    series: [{
        data: data
    }]
});

小提琴here。

评论的编辑

要做范围，我会切换到使用时间戳作为我的唯一键而不是字符串。使用一点Math.floor，你就可以加入10秒的间隔。

var counts = {};
for (var i = 0; i < visits.length; i++){
    // this key is the unix epoch to the nearest 10 second interval
    var key = Math.floor(moment(visits[i]).unix()/10)*10;
    if (key in counts){
        counts[key] += 1;   
    }else{
        counts[key] = 1;   
    }
}

更新了fiddle。

使用HighCharts每X次显示多少个元素

1 个答案: