I want to import some data from a database table, and draw a graph. I wrote here my php code and js. It doesn't show me anything an web browser, except "Back" button. When I am using firebug, in the console window I have the message "SyntaxError: syntax error data: [
". plot.php (line 47, col 16).At that line is this code "if($row[1] < 50) {". Can anyone help me?
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Graph</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<style type="text/css">
#container, #sliders {
min-width: 310px;
max-width: 800px;
margin: 0 auto;
}
#container {
height: 400px;
}
</style>
<script type="text/javascript">
<?php
//header('Refresh: 10');
// connect to MySQL
$db_host = "localhost";
$db_user = "root";
$db_pass = "";
$db_name = "testdb";
//require_once 'phplot.php';
$con = mysql_connect('localhost', 'root', '') or die("Cannot connect because ".mysql_error());
$db_selected = mysql_select_db('testdb', $con);
if (!$db_selected) {
die ('Can\'t use testdb : ' . mysql_error());
}
$sql = "SELECT Doi, Trei FROM `tabela` ORDER BY `tabela`.`id` DESC LIMIT 10";
$result = mysql_query($sql);
if (!$result) {
echo 'Could not run query: ' . mysql_error();
exit;
}
$data = array();
$valoare = 100;
while($row = mysql_fetch_row($result)) {
if($row[1] < 50) {
$data[] = array($row[0], $valoare, null);
} else {
$data[] = array($row[0], null, $valoare);
}
}
?>
$(function () {
// Set up the chart
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'column',
margin: 75,
options3d: {
enabled: true,
alpha: 15,
beta: 15,
depth: 50,
viewDistance: 25
}
},
title: {
text: 'Graph view'
},
subtitle: {
text: 'Time'
},
plotOptions: {
column: {
depth: 25
}
},
series: [{
data: [<?php echo join($data, ',') ?>]
}]
});
// Activate the sliders
$('#R0').on('change', function(){
chart.options.chart.options3d.alpha = this.value;
showValues();
chart.redraw(false);
});
$('#R1').on('change', function(){
chart.options.chart.options3d.beta = this.value;
showValues();
chart.redraw(false);
});
function showValues() {
$('#R0-value').html(chart.options.chart.options3d.alpha);
$('#R1-value').html(chart.options.chart.options3d.beta);
}
showValues();
});
</script>
</head>
<body>
<form><input type="button" value="Back" onClick="window.location.href='source/login-home.php'"></form>
<div id="container"></div>
<div id="sliders">
<script src="http://localhost/graph/highcharts.js"></script>
<script src="http://localhost/graph/highcharts-3d.js"></script>
<script src="http://localhost/graph/exporting.js"></script>
<tr><td>Alpha Angle</td><td><input id="R0" type="range" min="0" max="45" value="15"/> <span id="R0-value" class="value"></span></td></tr>
<tr><td>Beta Angle</td><td><input id="R1" type="range" min="0" max="45" value="15"/> <span id="R1-value" class="value"></span></td></tr>
</div>
</body>
</html>
