highcharts.php
3.22 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<?php
$mysql_host = 'localhost';
$mysql_user = 'haseo';
$mysql_password = 'haseo';
$mysql_db = 'M2351';
// DB 접속
$conn = mysqli_connect($mysql_host, $mysql_user, $mysql_password, $mysql_db);
// charset 설정, 설정하지 않으면 기본 mysql 설정으로 됨, 대체적으로 euc-kr를 많이 사용
//mysql_query("set names utf8");
// $sql="
// select * from (
// SELECT DATE_FORMAT( regday, '%m-%d %HH' ) mdh , COUNT( * ) cnt, SUM( temperature ) , round(SUM( temperature ) / COUNT( * ),2) atemper
// FROM `temperature`
// GROUP BY DATE_FORMAT( regday, '%Y%m%d%H' )
// order by regday desc
// limit 12
// ) t_a
// order by t_a.mdh
// ";
//echo $sql;
//$sql = "SELECT * FROM pulseTable";
$sql = "SELECT * FROM
(SELECT * FROM pulseTable ORDER BY date DESC LIMIT 30) A ORDER BY A.date ASC";
//echo $sql;
$result = mysqli_query($conn, $sql);
//echo $result;
$str_date="";
$str_heartrate="";
while ($row = mysqli_fetch_assoc($result))
{
$str_date .="'".$row['date']."',";
$str_heartrate .="".$row['pulse'].",";
}
$str_date= substr($str_date,0,-1);
$str_heartrate= substr($str_heartrate,0,-1);
//$str_date= substr($str_date,0,-1);
//$str_heartrate= substr($str_heartrate,0,-1);
//echo $str_date."</br>";
//echo $str_heartrate."</br>";
mysqli_close($conn);
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Heart Rate Monitoring</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<style type="text/css">
${demo.css}
</style>
<script type="text/javascript">
$(function () {
$('#container').highcharts({
chart: {
type: 'line',
events: {
load: function() {
// set up the updating of the chart each second
var series = this.series[0];
setInterval(function refresh(){
window.location.reload();
}, 3000);
}
}
},
title: {
text: 'Heart Rate Monitoring'
},
subtitle: {
text: 'Data was obtained from the MAX30102 in NuMaker-PFM-M2351 Secure World'
},
xAxis: {
categories: [<?php echo $str_date?>]
},
yAxis: {
title: {
text: 'Heart Rate (bpm)'
}
},
plotOptions: {
line: {
dataLabels: {
enabled: true
},
enableMouseTracking: true,
color: '#FF0000'
}
},
series: [{
name: 'Heart Rate',
data: [<?php echo $str_heartrate?>]
}
]
});
});
</script>
</head>
<body>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/series-label.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<script src="https://code.highcharts.com/modules/accessibility.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
</body>
</html>