I am trying to extend an excellent HighCharts Column Range Chart example that I found at JSFiddle. After many days and lots of research I am almost done dynamically generating a my chart, except I cannot get the y data in the correct format for HighCharts.
I can successfully get the x data from the server in php to the browser in Javascript using json_encode, but I am stuck getting the y data to do the same, even after reading how to use json_encode and json_encode returning the next rows values - PHP PDO SQL HighCharts. I feel that I am on the cusp of the solution, but my computer thinks differently.
To simplify my problem solving I have hard-coded some example data in PHP:
$data_x_in_php_array = array();
// set x values
array_push($data_x_in_php_array, 'A');
array_push($data_x_in_php_array, 'B');
// set y values
$data_y_in_php_array[] = array('x' => 0, 'low' => 1375488000000, 'high' => 1375527600000);
Next I used json_encode to move the data from php to javascript:
var data_x_in_js_array = <?php echo json_encode($data_x_in_php_array); ?>;
alert('data_x_in_js_array =' + data_x_in_js_array);
var data_y_in_js_array = <?php echo json_encode($data_y_in_php_array, JSON_NUMERIC_CHECK); ?>;
alert('data_y_in_js_array =' + data_y_in_js_array);
I then commented out some of the data provided in the example and replaced it with the data_y_in_js_array:
var data_x = data_x_in_js_array;
data_y = [{//blue
data_y_in_js_array // uncommenting this line and commenting out the next three lines causes bars to disappear in the chart
//x: 0,
//low: 1375488000000, // milliseconds since unix epoch
//high: 1375527600000 // milliseconds since unix epoch
}
Unfortunately, the chart renders without displaying the bars.
I have posted an example at the excellent PhpFiddle. Any help is much appreciated.