如何从 pi3 lamp 服务器获取 google 仪表与 mysql 数据库一起工作
how to get google gauges work with mysql database from pi3 lamp server
我正在使用树莓派 pi3 lamp 服务器来显示来自两个温度传感器 AM2302 的数据
我正在学习以仪表格式显示数据的教程,这里是视频 https://www.youtube.com/watch?v=WyUM--RGLH0 的 link(它是西班牙语,我认为精通此内容的专家会轻描淡写视频没有问题。但我对这些东西了解不多,我是业余爱好者,对编码真的很菜鸟。
我正在使用两个 PHP 文件,一个用于读取数据并以 JSON 格式显示,另一个用于在仪表中显示。现在我可以读取数据,但仪表不起作用。他们保持零在此处输入图片描述
我认为数据 json 是这样显示的:我的结果是:
{"temperature":"27.8","humidity":"61.2"}
但教程中的结果格式是
[{"temperature":"27.8","humidity":"61.2"}]
我想我的 JSON 没有像视频显示的那样显示方括号:视频的 1:07 分钟
这是我的 index.php 文件
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Medidor Temperatura, Humedad</title>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js">
</script>
<script type="text/javascript"
src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['gauge']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Label', 'Value'],
['humidity', 0],
['temperature', 0]
]);
var options = {
width: 400, height: 400,
redFrom: 90, redTo: 100,
yellowFrom:75, yellowTo: 90,
minorTicks: 5
};
var chart = new
google.visualization.Gauge(document.getElementById("Medidores"));
chart.draw(data, options);
setInterval(function() {
var JSON=$.ajax({
url:"http:192.168.0.115/sensores.php",
dataType: 'json',
async: false}).responseText;
var Respuesta=jQuery.parseJSON(JSON);
data.setValue(0, 1,Respuesta[0].humidity);
data.setValue(1, 1,Respuesta[0].temperature);
chart.draw(data, options);
}, 1300);
}
</script>
</head>
<body>
<div id="Medidores" ></div>
读取数据的文件名为:sensores.php(从传感器收集数据的文件)。
<?php
// Settings
// host, user and password settings
$host = "localhost";
$user = "logger";
$password = "123456";
$database = "temperatures";
//how many hours backwards do you want results to be shown in web page.
$hours = 24;
// make connection to database
$connectdb = mysqli_connect($host,$user,$password)
or die ("Cannot reach database");
// select db
mysqli_select_db($connectdb,$database)
or die ("Cannot select database");
// sql command that selects all entires from current time and X hours backward
$sql="SELECT temperature, humidity FROM temperaturedata where sensor = 'Exterior' and dateandtime >= (NOW() - INTERVAL $hours HOUR) order by dateandtime desc LIMIT 1";
// set query to variable
$temperatures = mysqli_query($connectdb,$sql);
// create content to web page
?>
<?php
// loop all the results that were read from database and "draw" to web page
while($temperature=mysqli_fetch_assoc($temperatures))
$json=json_encode($temperature);
echo $json;
?>
我想在 index.php 文件中显示来自两个传感器的数据
但我即使有一个我也会感觉很好
在while循环中,在JSON均值数组中构建[]
个指标的数组。
这也是有道理的,因为无论如何您都可能从查询中获得多个结果。
$temps = [];
while($temperature = mysqli_fetch_assoc($temperatures)) {
$temps[] = $temperature;
}
echo json_encode($temps);;
我正在使用树莓派 pi3 lamp 服务器来显示来自两个温度传感器 AM2302 的数据
我正在学习以仪表格式显示数据的教程,这里是视频 https://www.youtube.com/watch?v=WyUM--RGLH0 的 link(它是西班牙语,我认为精通此内容的专家会轻描淡写视频没有问题。但我对这些东西了解不多,我是业余爱好者,对编码真的很菜鸟。
我正在使用两个 PHP 文件,一个用于读取数据并以 JSON 格式显示,另一个用于在仪表中显示。现在我可以读取数据,但仪表不起作用。他们保持零在此处输入图片描述
我认为数据 json 是这样显示的:我的结果是:
{"temperature":"27.8","humidity":"61.2"}
但教程中的结果格式是
[{"temperature":"27.8","humidity":"61.2"}]
我想我的 JSON 没有像视频显示的那样显示方括号:视频的 1:07 分钟
这是我的 index.php 文件
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Medidor Temperatura, Humedad</title>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js">
</script>
<script type="text/javascript"
src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['gauge']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Label', 'Value'],
['humidity', 0],
['temperature', 0]
]);
var options = {
width: 400, height: 400,
redFrom: 90, redTo: 100,
yellowFrom:75, yellowTo: 90,
minorTicks: 5
};
var chart = new
google.visualization.Gauge(document.getElementById("Medidores"));
chart.draw(data, options);
setInterval(function() {
var JSON=$.ajax({
url:"http:192.168.0.115/sensores.php",
dataType: 'json',
async: false}).responseText;
var Respuesta=jQuery.parseJSON(JSON);
data.setValue(0, 1,Respuesta[0].humidity);
data.setValue(1, 1,Respuesta[0].temperature);
chart.draw(data, options);
}, 1300);
}
</script>
</head>
<body>
<div id="Medidores" ></div>
读取数据的文件名为:sensores.php(从传感器收集数据的文件)。
<?php
// Settings
// host, user and password settings
$host = "localhost";
$user = "logger";
$password = "123456";
$database = "temperatures";
//how many hours backwards do you want results to be shown in web page.
$hours = 24;
// make connection to database
$connectdb = mysqli_connect($host,$user,$password)
or die ("Cannot reach database");
// select db
mysqli_select_db($connectdb,$database)
or die ("Cannot select database");
// sql command that selects all entires from current time and X hours backward
$sql="SELECT temperature, humidity FROM temperaturedata where sensor = 'Exterior' and dateandtime >= (NOW() - INTERVAL $hours HOUR) order by dateandtime desc LIMIT 1";
// set query to variable
$temperatures = mysqli_query($connectdb,$sql);
// create content to web page
?>
<?php
// loop all the results that were read from database and "draw" to web page
while($temperature=mysqli_fetch_assoc($temperatures))
$json=json_encode($temperature);
echo $json;
?>
我想在 index.php 文件中显示来自两个传感器的数据 但我即使有一个我也会感觉很好
在while循环中,在JSON均值数组中构建[]
个指标的数组。
这也是有道理的,因为无论如何您都可能从查询中获得多个结果。
$temps = [];
while($temperature = mysqli_fetch_assoc($temperatures)) {
$temps[] = $temperature;
}
echo json_encode($temps);;