我想分析我的网站访问日志。该网站存储一个moment.js
时间数组,每次在该网站上进行新的访问时,它将一个moment.js
时间推送到该数组中。
从这个输入中,我想绘制线状图来显示number of visits
day by day
、week by week
和month by month
。在每天显示访问次数的这个例子中,我必须自己准备数据(x轴和y轴):
var enumerateDaysBetweenDates = function(startDate, endDate) {
var dates = {};
var currDate = startDate.clone().startOf('day').add(-1,'days');
var lastDate = endDate.clone().startOf('day');
while(currDate.add(1, 'days').diff(lastDate) <= 0) {
var x = currDate.clone();
dates[x.format('YYYY-MM-DD')] = { "numberOfVisits": 0 };
}
return dates;
};
var startDate = moment({ year : 2017, month : 10, day : 1 });
var endDate = moment({ year : 2017, month : 10, day : 30 });
var res = enumerateDaysBetweenDates(startDate, endDate)
for (var i = 0; i < logs.length; i++) {
var date = moment.utc(logs[i]).format("YYYY-MM-DD");
res[date].numberOfVisits++
}
// change format:
var r = [];
for (var d in res) {
if (res.hasOwnProperty(d)) {
var a = d.split("-");
var b = Date.UTC(a[0], a[1] - 1, a[2]);
r.push([b, res[d].numberOfVisits])
}
}
为了绘制几个星期或几个月的图表,我必须重新准备数据。有没有人知道是否有允许自动绘制图表的方法、参数或库?
PS:这是chart.js的一个例子
发布于 2017-11-30 11:43:14
Highstock提供了您需要的dataGroupig
功能。
现场演示: http://jsfiddle.net/kkulig/avd0gqgr/
我强制数据分组,并覆盖它的单位按一下按钮。
//options
xAxis: {
ordinal: false
},
plotOptions: {
series: {
dataGrouping: {
forced: true,
approximation: 'sum'
}
}
},
(...)
// button
$('#months').click(function() {
chart.update({
plotOptions: {
series: {
dataGrouping: {
units: [
[
'month', [1]
]
]
}
}
}
});
});
API参考: https://api.highcharts.com/highstock/plotOptions.series.dataGrouping
文档参考: https://www.highcharts.com/docs/advanced-chart-features/data-grouping
https://stackoverflow.com/questions/47525393
复制相似问题