Question

我从arduino传感器收集数据到mysql表中，然后使用google图形绘制带有数据的折线图。我的数据是温度，湿度和计算出的湿度。我的项目的一部分是用我能够做的当前值来绘制图表。因此，我将数据选择到数据表中，然后使用数据视图对其进行过滤。然后为每个过滤后的值绘制三个单独的指标。问题是温度通常在-40至40的范围内，湿度通常在0至100％的范围内，因此将它们绘制在同一张图中就温度而言，该图看起来很平坦。

我的目标是绘制两个图形，而不必两次查询数据库（如果可能的话）

下面是相关代码

echo "[new Date(" . $row["Year"] .", " .$row["Month"].", " .$row["Day"].", " .$row["Hour"].", " .$row["Min"]."), ". $temperature . ", " . $humidex . ", " . $humidity . "]";

var temp_view = new google.visualization.DataView(data);
      temp_view.setRows([0,1,2]);

var humid_view = new google.visualization.DataView(data);
      humid_view.setRows([0,3]);

var options = {'title':'Temperature', 'width':650, 'height':500};

var chart1 = new google.visualization.LineChart(document.getElementById('temp_chart'));
      chart1.draw(temp_view, options);

var chart2 = new google.visualization.LineChart(document.getElementById('humid_chart'));
      chart2.draw(humid_view, options);

Answer 1

如果数据生成的数组类似于以下内容...

[new Date(2018, 5, 29, 7, 26), 70, 75, 0.98]

那么您只有一行四列

这意味着您应该使用setColumns而不是setRows ...

尝试...

var temp_view = new google.visualization.DataView(data);
temp_view.setColumns([0,1,2]);

var humid_view = new google.visualization.DataView(data);
humid_view.setColumns([0,3]);

var options = {'title':'Temperature', 'width':650, 'height':500};

var chart1 = new google.visualization.LineChart(document.getElementById('temp_chart'));
chart1.draw(temp_view, options);

var chart2 = new google.visualization.LineChart(document.getElementById('humid_chart'));
chart2.draw(humid_view, options);

从一个数据表中绘制两个Google折线图

1 个答案: