如何填充固定长度的日期数组中的间隙

时间:2017-08-01 00:44:16

标签: javascript underscore.js chart.js lodash chart.js2

我使用 Chart.js 2.6 在条形图上工作,xAxes是天数的时间刻度。意味着轴上的每个刻度都是一个月中的某一天。所以值是日期对象而不仅仅是数字;

假设我们在 7月,我们这个月有 31天。我们有一个代表几个月日期的数字数组。例如:

[1, 2, 3, 12, 28, 30, 31]

在我们的案例中,这意味着我们在这些特定日期提供了数据。现在,如果我们想要从月的第一天到最后一天呈现时间线,我们可以轻松地迭代数天并轻松绘制数据图表。但这是一个特例。

假设我们有10天或更短的数据,就像您看到的示例数组一样。在这些情况下,没有必要渲染31天,因为大多数都是空的。它在特别是小屏幕(即iPhone 5)上变得更加重要。

问题

我想显示10天的数据,这意味着xAxes将有10个日期。但是我们如何填补阵列的空白和填充?

实施例

假设我们有这个数组:

[1, 2, 29, 30, 31]

这意味着我们可以在每月的第1天,第2天,第29天,第30天和最后一天提供数据。现在我们想要一个包含10个项目的数组。

我们有5天的数据,所以有5天的空间可以填写。我们可以填补这样的空白:

[1, 2, 3, 4, 5, 6, 7, 29, 30, 31]

如何在JavaScript中实现此功能?我需要能够使用我的几天,填写剩下的10天。但这应该考虑可用天数。在哪里添加缺失天数,以及添加多少是问题。

1 个答案:

答案 0 :(得分:2)

我要做的是初始化填充'数字1到9的数组,从数组中的数组中删除任何数字,从填充数组中弹出数字到数据数组,直到数据数组的长度为10,然后sort()数据数组。 / p>