具有不同时间戳和不同数据点数量的两个数组系列

时间:2020-03-10 10:52:41

标签: reactjs echarts

我有2个时间序列的数据,这些数据具有不同的时间戳和不同数量的数据点。

第一个:

​​[
 { time: "2020-03-10T06:48:08.884220928Z", value: 99.05870056152344 }
​​​​​
 { time: "2020-03-10T06:48:10.888220928Z", value: 99.09293365478516 }
​​​​​
 { time: "2020-03-10T06:48:14.890221056Z", value: 99.17850494384766 }
​​​​​
 { time: "2020-03-10T06:49:18.894221056Z", value: 99.12715911865234 }
​​​​​
 { time: "2020-03-10T06:49:20.895220992Z", value: 99.16139221191406 }
​​​​​
 { time: "2020-03-10T06:49:24.900220928Z", value: 99.14427185058594 }
​​​​​
 { time: "2020-03-10T06:49:26.901220864Z", value: 99.21273040771484 }
​​​​​
 { time: "2020-03-10T06:50:30.904220928Z", value: 99.24696350097656 }
​​​​​
 { time: "2020-03-10T06:50:32.904220928Z", value: 99.22985076904297 }
​​​​​
 { time: "2020-03-10T06:50:36.910221056Z", value: 99.22985076904297 }
]

和第二个:

[
{ time: "2020-03-10T06:48:59.000Z", value: 0 }
​​​​
{ time: "2020-03-10T06:49:01", value: 61.7744735137 }
​​​​
{ time: "2020-03-10T06:49:05", value: 27.1289544868 }
​​​​
{ time: "2020-03-10T06:49:09", value: 100 }
]

正如我在堆积式折线图https://www.echartsjs.com/examples/en/editor.html?c=line-stack中所看到的那样,必须正确地将另一个数据点添加到第二个数组中。否则,x轴上仅4个第一点(位置0、1、2、3)显示在第二分布图上。 这不是我想要的。我需要根据数据戳放置位置。

有没有一种方法可以在图表中绘制这些点而无需更改将为第二个序列对象提供空值的第二个数组?

1 个答案:

答案 0 :(得分:0)

我想出了解决方案,但这是一个奇怪的解决方案

因此,基本上,一个人需要每秒钟输入数据。

为了对不同的时间戳数组执行此操作,需要获取开始时间和结束时间,运行循环并添加每秒,然后使用该数组填充第一个序列(0)数据。只有在此之后,后续数据系列(1和2)中的点才会开始正确调整为系列0中的时间戳点。

从官方示例页面上的文档中完全不清楚。