si pongo directo en en valor defrente en lugar del json "chartData" funciona
[{"name":"Male","data":[501,654,98]},{"name":"Female","data":[510,654,878]}]
pero si lo traigo con base de datos ya no me funciona por que el json enconde le agrega comillas
[{"name":"Male","data":["501,654,98"]},{"name":"Female","data":["510,654,878"]}] alos valores numericos que estan dentro del corchete
ejemplo ["510,654,878"]}] en lugar de [510,654,878]}]
alguien sabe por que ?
aqui mi codigo html
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<style>
#dynamic_data{
border: 1px solid gray;
border-radius: 10px;
padding: 10px;
text-decoration:none;
float:left;
margin:4px;
text-align:center;
display: block;
color: green;
}
</style>
<script>
$(function () {
//on page load
getAjaxData(1);
//on changing select option
$('#dynamic_data').change(function(){
var val = $('#dynamic_data').val();
getAjaxData(val);
});
function getAjaxData(id){
//use getJSON to get the dynamic data via AJAX call
$.getJSON('data.php', {id: id}, function(chartData) {
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Highcharts - Pulling data from PHP using Ajax'
},
xAxis: {
categories: ['One', 'Two', 'Three']
},
yAxis: {
min: 0,
title: {
text: 'Value'
}
},
series: chartData
});
});
}
});
</script>
</head>
<body>
<h3><a href="http://blog.theonlytutorials.com/highcharts-load-json-data-via-ajax-php/">Go back to the Tutorial</a></h3>
<select id="dynamic_data">
<option value="0">Select Data</option>
<option value="1" selected>Data 1</option>
<option value="2">Data 2</option>
<option value="3">Data 3</option>
</select>
<div id="container" style="width: 50%;min-width: 310px; height: 400px; margin: 0 auto"></div>
</body>
</html>
y aqui el php
<?php
//connect to database
$con = mysql_connect("localhost","root","");
if (!$con) {
die('Could not connect: ' . mysql_error());
}
//select database
mysql_select_db("eduardo", $con);
$id = $_GET['id'];
$arr = array();
$arr1 = array();
$result = array();
$sql = "select * from higcharts_data where map_id = $id";
$q = mysql_query($sql);
$j = 0;
while($row = mysql_fetch_assoc($q)){
if($j == 0){
$arr['name'] = 'Male';
$arr1['name'] = 'Female';
$j++;
}
$arr['data'][] = $row['male'];
$arr1['data'][] = $row['female'];
}
array_push($result,$arr);
array_push($result,$arr1);
//var_dump($result);
print json_encode($result, JSON_NUMERIC_CHECK);
mysql_close($con);
?>
