为 Google 图表加入两个数组

Question

我想完全连接两个数组以绘制在 Google 图表折线图上。 X 必须是日期，Y 必须是值（值 1 和值 2）

第一个数组：

data1 = [ 'day', 'values1' ],
    [ '01', 6471.92 ],
    [ '02', 14487.97 ],
    [ '03', 28230.21 ],
    [ '04', 46632.87 ],
    [ '05', 58017.5 ],
    [ '06', 65310.17 ],
    [ '07', 71586.54 ],
    [ '08', 79214.96 ],
    [ '09', 85993.71 ],
    [ '10', 98608.51 ],
    [ '11', 115264.9 ],
    [ '12', 123930.66 ],

第二个数组：（完全相同的值）

data2 = [ 'day', 'values2' ],
    [ '01', 6471.92 ],
    [ '02', 14487.97 ],
    [ '03', 28230.21 ],
    [ '04', 46632.87 ],
    [ '05', 58017.5 ],
    [ '06', 65310.17 ],
    [ '07', 71586.54 ],
    [ '08', 79214.96 ],
    [ '09', 85993.71 ],
    [ '10', 98608.51 ],
    [ '11', 115264.9 ],
    [ '12', 123930.66 ],

代码：

var v1 = google.visualization.arrayToDataTable(data1);
var v2 = google.visualization.arrayToDataTable(data2);
var joinData = new google.visualization.data.join(
  v1,
  v2,
  'full',
  [[0,0]],
  [1],
  [1]
);

我期望的是两条线重叠，但我得到：

有什么想法吗？

此致

Answer 1

请参阅以下工作片段。
线条似乎在这里重叠。

您的数据看起来有些不对。
在 post 中，没有看到数组的左括号和右括号...？

  var data1 = [  // <-- opening bracket
    [ 'day', 'values1' ],
    [ '01', 6471.92 ],
    [ '02', 14487.97 ],
    [ '03', 28230.21 ],
    [ '04', 46632.87 ],
    [ '05', 58017.5 ],
    [ '06', 65310.17 ],
    [ '07', 71586.54 ],
    [ '08', 79214.96 ],
    [ '09', 85993.71 ],
    [ '10', 98608.51 ],
    [ '11', 115264.9 ],
    [ '12', 123930.66 ],
  ];  // <-- closing bracket

google.charts.load('current', {
  packages: ['corechart']
}).then(function () {
  var data1 = [
    [ 'day', 'values1' ],
    [ '01', 6471.92 ],
    [ '02', 14487.97 ],
    [ '03', 28230.21 ],
    [ '04', 46632.87 ],
    [ '05', 58017.5 ],
    [ '06', 65310.17 ],
    [ '07', 71586.54 ],
    [ '08', 79214.96 ],
    [ '09', 85993.71 ],
    [ '10', 98608.51 ],
    [ '11', 115264.9 ],
    [ '12', 123930.66 ],
  ];

  var data2 = [
    [ 'day', 'values2' ],
    [ '01', 6471.92 ],
    [ '02', 14487.97 ],
    [ '03', 28230.21 ],
    [ '04', 46632.87 ],
    [ '05', 58017.5 ],
    [ '06', 65310.17 ],
    [ '07', 71586.54 ],
    [ '08', 79214.96 ],
    [ '09', 85993.71 ],
    [ '10', 98608.51 ],
    [ '11', 115264.9 ],
    [ '12', 123930.66 ],
  ];

  var v1 = google.visualization.arrayToDataTable(data1);
  var v2 = google.visualization.arrayToDataTable(data2);
  var joinData = new google.visualization.data.join(
    v1,
    v2,
    'full',
    [[0,0]],
    [1],
    [1]
  );

  var options = {
    legend: {
      position: 'top'
    },
    pointSize: 8
  };

  var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
  chart.draw(joinData, options);
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>

Answer 2

在这种情况下，您可以尝试这样的操作：

google.charts.load('current', {
  'packages': ['corechart']
});
google.charts.setOnLoadCallback(drawChart);

function drawChart() {
  var data = google.visualization.arrayToDataTable([
    ['Year', 'Values1', 'Values2'],
    ['01', 6471.92, 6471.92],
    ['02', 14487.97, 14487.97],
    ['03', 28230.21, 28230.21],
    ['04', 46632.87, 46632.87]
    ['05', 200, 300]
  ]);

  var options = {
    title: 'Company Performance',
    curveType: 'function',
    legend: {
      position: 'bottom'
    }
  };

  var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

  chart.draw(data, options);
}

<div id="curve_chart" style="width: 900px; height: 500px"></div>

<script src="https://www.gstatic.com/charts/loader.js"></script>

您可以在文档中查看为折线图提供的示例 HERE

为 Google 图表加入两个数组

Join two array for Google Chart

javascript

charts

google-visualization