Javascript 实时数据源不是'；我不在海图上
我试图从传感器向highchart添加实时值，以创建实时数据馈送 如果我手动提供数据，它是有效的，但当传感器数据到来时它不起作用。数据保存在数据库中，但它们没有显示在图表上 如果还有别的办法，请告诉我 add_data.phpJavascript 实时数据源不是'；我不在海图上,javascript,php,json,highcharts,Javascript,Php,Json,Highcharts,我试图从传感器向highchart添加实时值，以创建实时数据馈送 如果我手动提供数据，它是有效的，但当传感器数据到来时它不起作用。数据保存在数据库中，但它们没有显示在图表上 如果还有别的办法，请告诉我 add_data.php <?php session_start(); // Connect to MySQL include './connection.php'; // Substring function definition function ge
<?php
session_start();
// Connect to MySQL
include './connection.php';
// Substring function definition
function get_string_between($string, $start, $end)
{
$string = ' ' . $string;
$ini = strpos($string, $start);
if ($ini == 0) return '';
$ini += strlen($start);
$len = strpos($string, $end, $ini) - $ini;
return substr($string, $ini, $len);
}
// Collect value datas from packet using substring
$packet=$_GET["data_packet"];
$temp_s = floatval(get_string_between($packet, 'ttt', 'ppp'));
$pressure_s = floatval(get_string_between($packet, 'ppp', 'end'));
$device = get_string_between($packet, 'dev', 'ttt');
//convert to float
if($temp_s!=0 && $pressure_s!=0 && $device!=0)
{
if ($device==1)
{
$SESSION["temp"] = $temp_s;
$SESSION["pressure"] =$pressure_s;
$query = "INSERT INTO machine_1 VALUES('".$SESSION["temp"] ."','".$SESSION["pressure"]."',DEFAULT)";
include './press_m1.php';
include './temp_m1.php';
//echo $temp;
}
elseif($device==2)
{
// Enter datas into machine 2 table
$_SESSION["temp1"] = $temp_s;
$_SESSION["pressure2"] =$pressure_s;
$query = "INSERT INTO machine_2 VALUES ('".$_SESSION["temp1"]."','".$_SESSION["pressure2"]."',DEFAULT)";
include './press_m2.php';
include './temp_m2.php';
}
else
{
echo "Eror:404";
}
}
// Execute SQL statement
if(!mysqli_query($con,$query))
{
die('Error: ' . mysqli_error($con));
}
mysqli_close($con);
?>
<?php
session_start();
?>
<?php
header("Content-type: text/json");
// The x value is the current JavaScript time, which is the Unix time multiplied by 1000.
$x = time() * 1000;
$y = $_SESSION["temp"];
// Create a PHP array and echo it as JSON
$ret = array($x, $y);
echo json_encode($ret);
?>
<?php
session_start();
?>
<?php
header("Content-type: text/json");
// The x value is the current JavaScript time, which is the Unix time multiplied by 1000.
$x = time() * 1000;
// The y value is a random number
$z =$_SESSION["pressure"];
// Create a PHP array and echo it as JSON
$retn = array($x, $z);
echo json_encode($retn);
?>
<?php
include './header.php';
?>
<?php
include './site_top.php';
?>
<!-- ####################################################################################################### -->
<?php
include './menu.php';
?>
<script>
var chart;
var chart1; // global
/**
* Request data from the server, add it to the graph and set a timeout to request again
*/
function requestDataOne() {
$.ajax({
url: 'temp_m1.php',
success: function(point) {
var series = chart.series[0],
shift = series.data.length > 20; // shift if the series is longer than 20
// add the point
chart.series[0].addPoint(eval(point), true, shift);
// call it again after one second
setTimeout(requestDataOne, 1000);
},
cache: false
});
}
$(document).ready(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'temp',
defaultSeriesType: 'spline',
events: {
load: function() {
chart = this; // `this` is the reference to the chart
requestDataOne();
}
}
},
title: {
text: 'Live Temparature data'
},
xAxis: {
type: 'datetime',
tickPixelInterval: 150,
maxZoom: 20 * 1000
},
yAxis: {
minPadding: 0.2,
maxPadding: 0.2,
title: {
text: 'Value',
margin: 80
}
},
series: [{
name: 'Temparature',
data: []
}]
});
});
// global
/**
* Request data from the server, add it to the graph and set a timeout to request again
*/
function requestDataTwo() {
$.ajax({
url: 'press_m1.php',
success: function(point) {
var series = chart1.series[0],
shift = series.data.length > 20; // shift if the series is longer than 20
// add the point
chart1.series[0].addPoint(eval(point), true, shift);
// call it again after one second
setTimeout(requestDataTwo, 1500);
},
cache: false
});
}
$(document).ready(function() {
chart1 = new Highcharts.Chart({
chart: {
renderTo: 'pres',
defaultSeriesType: 'spline',
events: {
load: function() {
chart1 = this; // `this` is the reference to the chart
requestDataTwo();
}
}
},
title: {
text: 'Live Pressure data'
},
xAxis: {
type: 'datetime',
tickPixelInterval: 150,
maxZoom: 20 * 1000
},
yAxis: {
minPadding: 0.2,
maxPadding: 0.2,
title: {
text: 'Value',
margin: 80
}
},
series: [{
name: 'pressure',
data: []
}]
});
});
</script>
<div class="wrapper row4">
<div id="container" class="clear">
<div class="row">
<div id="temp" > </div>
</div>
<div class="row">
<div id="pres" ></div>
</div>
</div>
</div>
<?php
include './footer.php';
?>
var图；
var chart1；//全球的
/**
*从服务器请求数据，将其添加到图表中，并设置超时以再次请求
*/
函数requestDataOne（）{
$.ajax({
url:'temp_m1.php'，
成功：功能（点）{
var系列=图表系列[0]，
shift=series.data.length>20；//如果序列长度超过20，则进行shift
//补充一点
chart.series[0].添加点（eval（point），true，shift）；
//一秒钟后再打
setTimeout（requestDataOne，1000）；
},
缓存：false
});
}
$（文档）.ready（函数（）{
图表=新的高点图表。图表({
图表：{
renderTo:'临时'，
defaultSeriesType:“样条线”，
活动：{
加载：函数（）{
chart=this；//`this`是对图表的引用
requestDataOne（）；
}
}
},
标题：{
文本：“实时温度数据”
},
xAxis：{
键入：“日期时间”，
像素间隔：150，
最大缩放：20*1000
},
亚克斯：{
最小填充：0.2，
最大填充：0.2，
标题：{
文本：“值”，
差额：80
}
},
系列：[{
名称：'温度'，
数据：[]
}]
});
});
//全球的
/**
*从服务器请求数据，将其添加到图表中，并设置超时以再次请求
*/
函数requestDataTwo（）{
$.ajax({
url:“press_m1.php”，
成功：功能（点）{
var系列=图表1.系列[0]，
shift=series.data.length>20；//如果序列长度超过20，则进行shift
//补充一点
图表1.系列[0]。添加点（eval（point），true，shift）；
//一秒钟后再打
setTimeout（requestDataTwo，1500）；
},
缓存：false
});
}
$（文档）.ready（函数（）{
图表1=新的高点图表。图表({
图表：{
renderTo:“pres”，
defaultSeriesType:“样条线”，
活动：{
加载：函数（）{
chart1=这个；//`this`是对这个图表的引用
请求数据二（）；
}
}
},
标题：{
文本：“实时压力数据”
},
xAxis：{
键入：“日期时间”，
像素间隔：150，
最大缩放：20*1000
},
亚克斯：{
最小填充：0.2，
最大填充：0.2，
标题：{
文本：“值”，
差额：80
}
},
系列：[{
名称：'压力'，
数据：[]
}]
});
});