Google 可视化折线图 - 多条线

Gia*_*nis 5 javascript charts linechart google-visualization

我有一个折线图,h 轴是日期,v 轴是双精度。我需要显示两行:

lineA: [
    [2016-1-1 00:00, 1.1]
    [2016-2-1 00:00, 1.1]
    [2016-3-1 00:00, 1.1]
]
lineB: [
    [2016-1-1 00:00, 2.1]
    [2016-2-1 08:00, 2.1]
    [2016-3-1 00:00, 2.1]
]
Run Code Online (Sandbox Code Playgroud)

为了在图表上显示数据,我需要组合这两行并将结果传递给 arrayToDataTable。

combine: [
    [2016-1-1 00:00, 1.1, 2.1],
    [2016-2-1 00:00, 1.1, null],
    [2016-2-1 08:00, null, 2.1],
    [2016-3-1 00:00, 1.1, 2.1],
]
Run Code Online (Sandbox Code Playgroud)

由于上述原因,我的线条出现了间隙。我该如何解决这个问题?是否可以通过两组单独的组,每行一组?我找到的所有示例都需要将它们合并为表格combine

作为 line1 和 line2 表的一部分提供时,我需要保留空值

Whi*_*Hat 5

使用以下选项来填补null值 造成的空白

interpolateNulls: true
Run Code Online (Sandbox Code Playgroud)

编辑

请参阅以下工作片段...

interpolateNulls: true
Run Code Online (Sandbox Code Playgroud)
google.charts.load('current', {
  callback: function () {
    var data = google.visualization.arrayToDataTable([
      [new Date(2016, 0, 1), 1.1, 2.1],
      [new Date(2016, 1, 1), 1.1, null],
      [new Date(2016, 1, 1, 8), null, 2.1],
      [new Date(2016, 2, 1), 1.1, 2.1]
    ], true);

    var options = {
      interpolateNulls: true
    };

    var container = document.body.appendChild(document.createElement('div'));
    var chart = new google.visualization.LineChart(container);
    chart.draw(data, options);
  },
  packages: ['corechart']
});
Run Code Online (Sandbox Code Playgroud)