如何在 c3.js 中将零值添加到时间序列中
How to add in zero values into a time series in c3.js
>有没有办法在 c3 中将零值添加到时间序列中.js在示例中,您可以看到,错过了 2016-01-07。我们可以用零值显示此类错过的日期吗?
var jsonData = [{"id": 569, "date": "2016-01-10", "data1": 1, "data2": 0}, {"id": 569, "date": "2016-01-06", "data1": 96, "data2": 22}, {"id": 569, "date": "2016-01-08", "data1": 24, "data2": 1}, {"id": 569, "date": "2016-01-09", "data1": 1, "data2": 0}, {"id": 569, "date": "2016-01-11", "data1": 43, "data2": 2}, {"id": 569, "date": "2016-01-12", "data1": 10, "data2": 1}]
var chart = c3.generate({
bindto: '#chart',
data: {
json: jsonData,
keys: {
x: 'date',
value: ['data1', 'data2']
}
},
axis: {
x: {
type: 'timeseries',
tick: {
format: function (x) {
return x.toLocaleDateString('en-GB');}
}
}
},
subchart: {
show: true
},
zoom: {
enabled: true
}
});
http://jsfiddle.net/pr18wkz6/16/
看看这是否适合你。像 moment.js 这样的日期库也有助于简化这一点
// first sort by date
var data = jsonData.sort(function(a, b) {
return a.date > b.date
}).reduce(function(res, curr, i, arr) {
res.push(curr);
// if not last element in array increment current date
// compare to next date and fill holes until they match
if (arr[i + 1]) {
var currDate = itemDate(curr.date);
var nextDate = itemDate(arr[i + 1].date);
while (currDate.setDate(currDate.getDate() + 1) < nextDate) {
res.push(blankItem(currDate))
}
}
return res;
}, []);
//can pass data to chart now
// date helper
function itemDate(str) {
var parts = str.split('-');
return new Date(+parts[0], (+parts[1] - 1), +parts[2])
}
// new item helper for padding
function blankItem(date) {
return {
data1: 0,
data2: 0,
date: date.toISOString().slice(0, 10)
}
}
演示
相关文章:
- 时间序列数据的线性回归
- 动态时间序列C3js图表
- 用Javascript编辑范围数据(时间序列)
- 如何在添加时间值时始终恢复到最长24小时
- 向 Firebase “push” 方法添加时间戳
- 添加到序列化数组中的复杂对象在服务器端始终为 null
- 更新 FLOT 时间序列图
- 向 d3 图表添加时间
- 添加时间数组的元素
- 我想添加时间
- 时间序列统计(如相关性、傅里叶变换)
- 在javascript中向本地时间戳添加时间戳偏移量
- Highcharts将变量数组添加到序列中
- 如何用javascript更简洁地填充时间序列数据中缺失的值
- 使用Gulp向文件名添加时间戳
- 如何生成时间序列的所有排列
- Javascript 添加了缺失天数的时间序列结果
- 如何在 c3.js 中将零值添加到时间序列中
- 绘制 D3 折线图后如何添加更多时间序列数据
- 如何添加固定垂直轴的焦点+上下文缩放时间序列