带有json数据的动态高图

我试图弄清楚是否可以在php和mysql的帮助下从数据库中动态获取json数据,并且可以使用过于动态自动更新的highcharts进行绘制? 任何帮助,将不胜感激。

遵循我已经尝试过的代码并且工作不正常并希望在网站上实现10行。

  highchart example     var chart; function requestData() { $.ajax({ url: 'live-server-data.php', success: function(point) { var series = chart.series[0], shift = series.data.length > 20; // shift if the series is // longer than 2 // add the point chart.series[0].addPoint(point, true, shift); // call it again after one second setTimeout(requestData1, 1000); }, cache: false, }); } function requestData1() { $.ajax({ url: 'live-server-data.php', success: function(point) { var series2 = chart.series[1], shift = series2.data.length > 20; // shift if the series is // longer than 20 // add the point chart.series[1].addPoint(point, true, shift); // call it again after one second setTimeout(requestData, 1000); }, cache: false, }); } $(function () { $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: 'container', defaultSeriesType: 'spline', events: { load: requestData } }, title: { text: 'Live random data' }, xAxis: { type: 'datetime', tickPixelInterval: 150, maxZoom: 20 * 1000 }, yAxis: { minPadding: 0.2, maxPadding: 0.2, title: { text: '', margin: 80 } }, series: [ { name: 'Random data', data: [] }, { name: ' hahaha', data: [] } ], }); }); });    
*** the live-server-data.php is as followed:

你可以试试

 var options = { chart: { renderTo: 'chart', }, credits: { enabled: false }, title: { text: 'Impression/Click Overview', x: -20 }, xAxis: { categories: [{}] }, tooltip: { formatter: function() { var s = ''+ this.x +''; $.each(this.points, function(i, point) { s += '
'+point.series.name+': '+point.y; }); return s; }, shared: true }, series: [{},{}] }; $.ajax({ url: "json.php", data: 'show=impression', type:'post', dataType: "json", success: function(data){ options.xAxis.categories = data.categories; options.series[0].name = 'Impression'; options.series[0].data = data.impression; options.series[1].name = 'Click'; options.series[1].data = data.clicks; var chart = new Highcharts.Chart(options); } });

highcharts网站上有一些关于使用动态数据的有用文章。 这可能是最好的起点。

http://www.highcharts.com/docs/working-with-data/preprocessing-live-data

http://www.highcharts.com/docs/working-with-data/preprocessing-data-from-a-database

尝试一下,如果你遇到麻烦,请回到这里,提出一个更具体的问题来展示你的尝试。 就目前而言,您的问题过于宽泛,可能会被关闭。

更新数据的ajax请求类似于:

 function requestData() { $.ajax({ url: 'live-server-data.php', success: function(point) { var series = chart.series[0], shift = series.data.length > 20; // shift if the series is // longer than 20 // add the point chart.series[0].addPoint(point, true, shift); // call it again after one second setTimeout(requestData, 1000); }, cache: false }); 

}