Javascript 高效地检测数组中缺少的日期并注入空值(highcharts和jquery)
我正在使用highcharts.js可视化数据库中的数据系列。有很多数据系列,它们可以从使用ajax收集的数据库中随时更改。我不能保证它们完美无缺,有时它们的日期会出现空白,这是一个问题。Highcharts只是在整个间隙中画一条线,直到下一个可用日期,这在我的情况下是不好的 该系列以不同的分辨率存在。几小时、几天、几周。这意味着可能会错过几个小时、几天或几周。图表在绘制时一次仅显示一个分辨率,如果分辨率发生变化,则重新绘制 “实际”的问题是如何让高图表不以有效的方式画出这些差距,这种方式可以持续几小时、几天和几周 我知道highcharts(线型)可以有这样的行为,即如果间隙以null开头,它不会在间隙上绘制一条直线 我试图做的是使用分辨率(记录为0、1、2表示小时、天或周),在包含值的数组中循环,并检测为“this date+1!=(this date+1应该是什么) 我需要解决这个问题的代码在这里Javascript 高效地检测数组中缺少的日期并注入空值(highcharts和jquery),javascript,jquery,date,highcharts,Javascript,Jquery,Date,Highcharts,我正在使用highcharts.js可视化数据库中的数据系列。有很多数据系列,它们可以从使用ajax收集的数据库中随时更改。我不能保证它们完美无缺,有时它们的日期会出现空白,这是一个问题。Highcharts只是在整个间隙中画一条线,直到下一个可用日期,这在我的情况下是不好的 该系列以不同的分辨率存在。几小时、几天、几周。这意味着可能会错过几个小时、几天或几周。图表在绘制时一次仅显示一个分辨率,如果分辨率发生变化,则重新绘制 “实际”的问题是如何让高图表不以有效的方式画出这些差距,这种方式可以持
for (var k in data.values) {
//help start, psudo code.
if(object-after-k != k + resolution){ //The date after "this date" is not as expected
data.values.push(null after k)
}
//help end
HC_datamap.push({ //this is what I use to fill the highchart later, so not important
x: Date.parse(k),
y: data.values[k]
});
}
数据中的k
对象
2015-05-19T00:00:00
2015-05-20T00:00:00
2015-05-21T00:00:00
...and more dates
作为字符串。它们可以有数千个,我不想让用户永远等待。所以性能是个问题,我也不是这里的专家
请要求澄清。我个人认为,以属性名称作为日期的对象可能有点问题。相反,我会创建一个数据数组。然后简单的循环来填补空白应该不会很慢。例如:(注意:我正在按照建议将格式更改为数组)
var origData={
“2015-05-19T00:00:00”:20,
“2015-05-20T00:00:00”:30,
“2015-05-21T00:00:00”:50,
“2015-06-21T00:00:00”:50,
“2015-06-22T00:00:00”:50
};
//让我们换成数组格式
变量数据=(函数(){
var d=[];
for(原始数据中的变量k){
d、 推动([k,origData[k]]);
}
返回d;
})();
变量间隔='Date';//或小时、月或年等。
函数fillData(数据,间隔){
变量d=[],
现在=新日期(数据[0][0]),//第一个x点
len=data.length,
last=新日期(数据[len-1][0]),//最后一个x点
迭代器=0,
Y
而(现在我写了这个循环
在我的例子中,我的数据总是被键入一个日期(上午12点),它以1天、1周或1个月的间隔移动。它被设计用于处理已经准备好的点数组({x,y})。这就是数据点,这些数据点被映射到finalDataPoints,finalDataPoints也会得到空值。finalDataPoints是最终用作序列数据的数据点。这是使用momentjs,forwardUnit
是间隔(d、w或M)
它假设数据点已经从最早的x排列到最早的x
dataPoints.forEach(function (point, index) {
var plotDate = moment(point.x);
finalDataPoints.push(point);
var nextPoint = dataPoints[index+1];
if (!nextPoint) {
return;
}
var nextDate = moment(nextPoint.x);
while (plotDate.add(1, forwardUnit).isBefore(nextDate)) {
finalDataPoints.push({x: plotDate.toDate(), y: null});
}
});
不幸的是,您的解决方案不起作用。您介意再试一次吗?它按照用户的要求工作:在日期之间添加空点。在第28行的演示中,您可以更改null->90
,然后查看结果。
dataPoints.forEach(function (point, index) {
var plotDate = moment(point.x);
finalDataPoints.push(point);
var nextPoint = dataPoints[index+1];
if (!nextPoint) {
return;
}
var nextDate = moment(nextPoint.x);
while (plotDate.add(1, forwardUnit).isBefore(nextDate)) {
finalDataPoints.push({x: plotDate.toDate(), y: null});
}
});