I'm looking to use highcharts to display quantity (0.0) and time (HH:MM). The quantity and time will be selected from a database.
At this point I have made a working example but the data from the database is weight (0.0) and age (weeks). This data was easy to put into the chart and has worked perfectly. The code I have used for this is shown below;
<?php
session_start();
// Create connection
$con=mysqli_connect("localhost","username","password","database");
// Check connection
if (mysqli_connect_errno($con))
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$id = $_SESSION['id'];
$response = mysqli_query($con,"SELECT b_id,weight,age FROM tbl WHERE id = '".$id."' ");
if(!$response)
{
die("<p>Error". mysqli_error($con)."</p>");
}
$weight = array();
$age = array();
while($result=mysqli_fetch_array($response))
{
$weight += [$result['b_id'] => $result['weight']];
$age += [$result['b_id'] => $result['age']];
}
?>
// High Chart //
<script type="text/javascript">
$(function () {
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: ''
},
subtitle: {
text: ''
},
xAxis: {
categories: [<?php echo join($age, ',');?>],
crosshair: true
},
yAxis: {
min: 0,
title: {
text: ''
}
},
tooltip: {
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
'<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>',
footerFormat: '</table>',
shared: true,
useHTML: true
},
plotOptions: {
column: {
pointPadding: 0.2,
borderWidth: 0
}
},
series: [{
name: '',
data: [<?php echo join($weight, ',');?>]
}]
});
});
</script>
I now need to create a graph to show the quantity (0.0) and time (HH:MM) in a similar way. I know that the time must be converted into milliseconds for it to work with JavaScript for which I did find some code for from stack overflow courtesy of Tim Cooper:
<?php $str_time = $time;
sscanf($str_time, "%d:%d:%d", $hours, $minutes, $seconds);
$time_seconds = isset($seconds) ? $hours * 3600 + $minutes * 60 + $seconds : $hours * 60 + $minutes;
?>
I just need to know if and how to make this work with the highcharts in the way that I have used them using php rather than using JSON to get the data.
Also if instead i need to reformat the time(HH:MM) to milliseconds before it is inserted into the database so that it can be selected and put into the array to use with the highcharts?
I'm slightly new to JavaScript so if anyone has any hints or tips on how to get this graph to work - preferably using similar syntax to the first graph it would be much appreciated!
Thanks!