Directly on the code
"Official documentation See HTTP://WWW.HIGHCHARTS.COM/DOCS/WORKING-WITH-DATA/GETTING-DATA-ACROSS-DOMAINS-JSONP"
"Instance http://highcharts-mzm.rhcloud.com/"
1, index.html
<!DOCTYPE HTML><HTML> <Head> <Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8"> <title>Highcharts Example</title> <Scripttype= "Text/javascript"src= "Http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></Script> <styletype= "Text/css"> ${Demo.css} </style> <Scripttype= "Text/javascript">$ (document). Ready (function() { varOptions={chart: {renderto:'Container', type:'column'}, Title: {text:'highcharts Chart PHP with MySQL Example', x:- - //Center}, Subtitle: {text:'Source:dongqiudi.com', x:- -}, Xaxis: {categories: [], title: {text: 'Team'}}, YAxis: {title: {text:'score'}, Plotlines: [{value:0, Width:1, Color:'#808080'}]}, tooltip: {valuesuffix:'a'}, Legend: {layout:'Vertical', align:' Right', VerticalAlign:'Middle', BorderWidth:0}, Series: []}; varURL= "http://yourip/getHighchartData.php?callback=?"; $.getjson (URL,function(data) {options.xAxis.categories=data[0]['Data']; //Xaxis: {categories: []}options.series[0] =data[1]; options.series[1] =data[2]; varChart= NewHighcharts.chart (options); });}); </Script> </Head> <Body> <Scriptsrc=".. /.. /js/highcharts.js "></Script> <Scriptsrc=".. /.. /js/modules/exporting.js "></Script> <DivID= "Container"style= "min-width:310px; height:400px; margin:0 Auto"></Div> </Body></HTML>
2, gethighchartdata.php
<?PHP/** Following code would list all the products*///Array for JSON response$response=Array();//include DB Connect classrequire_once__dir__. '/db_connect.php ';//Connecting to DB$db=NewDb_connect ();//Check home goals and home game loss data$result=mysql_query("Select Home_team, sum (score_home) as Score_h, sum (score_visiting) as Score_v from Fbscore Group by Home_team") or die(Mysql_error());$bln=Array();$bln[' name '] = ' team name ';$rows[' name '] = ' home score ';$rows 2[' name '] = ' visiting score ';//check for empty resultif(mysql_num_rows($result) > 0) { while($r=Mysql_fetch_array($result)) { //Temp User array//$array = $row ["Score_home"]; Array_push($array,$row[Score_home]); $bln[' Data '] [] =$r[' Home_team ']; $rows[' Data '] [] =$r[' Score_h ']; $rows 2[' Data '] [] =$r[' Score_v ']; } $rslt=Array(); Array_push($rslt,$bln); Array_push($rslt,$rows); Array_push($rslt,$rows 2); //Echoing JSON response Echo $_get[' Callback ']. ' ('. Json_encode ($rslt, Json_numeric_check). ‘)‘; //Print Json_encode ($rslt, json_numeric_check);}Else { Echo"Error!";}
3.
Highcharts PHP requests MySQL to return JSON data as a data source for mapping