用相同的渲染创建六个图表，不同的数据（高图）

我需要帮助，我需要使用SAME渲染创建六个图表，但在每个图表中使用ajax调用（jquery）使用不同的数据和图表标题，我该怎么办呢？

http://www.highcharts.com/documentation/how-to-use#live-charts

var chart; $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: 'container', defaultSeriesType: 'column', margin: [ 50, 50, 100, 80] }, title: { text: 'World\'s largest cities per 2008' }, xAxis: { categories: [ 'Tokyo', 'Jakarta', 'New York', 'Seoul', 'Manila', 'Mumbai', 'Sao Paulo', 'Mexico City', 'Dehli', 'Osaka', 'Cairo', 'Kolkata', 'Los Angeles', 'Shanghai', 'Moscow', 'Beijing', 'Buenos Aires', 'Guangzhou', 'Shenzhen', 'Istanbul' ], labels: { rotation: -45, align: 'right', style: { font: 'normal 13px Verdana, sans-serif' } } }, yAxis: { min: 0, title: { text: 'Population (millions)' } }, legend: { enabled: false }, tooltip: { formatter: function() { return ''+ this.x +'
'+ 'Population in 2008: '+ Highcharts.numberFormat(this.y, 1) + ' millions'; } }, series: [{ name: 'Population', data: [34.4, 21.8, 20.1, 20, 19.6, 19.5, 19.1, 18.4, 18, 17.3, 16.8, 15, 14.7, 14.5, 13.3, 12.8, 12.4, 11.8, 11.7, 11.2], dataLabels: { enabled: true, rotation: -90, color: Highcharts.theme.dataLabelsColor || '#FFFFFF', align: 'right', x: -3, y: 10, formatter: function() { return this.y; }, style: { font: 'normal 13px Verdana, sans-serif' } } }] }); }) ; 

Answer 1

如果您想要使用不同数据但具有相同设置的多个图表，请尝试以下操作：

 var charts = []; var cities = []; //replace with your array of cities, assuming that they aren't part of the changing data $(document).ready(function() { var getChartConfig = function(renderId, title, data) { var config = {}; config.chart = { renderTo: renderId, defaultSeriesType: 'column', margin: [50, 50, 100, 80] }; config.title = title; config.xAxis = { categories: cities, labels: { rotation: -45, align: 'right', style: { font: 'normal 13px Verdana, sans-serif' } } }; config.yAxis = { min: 0, title: { text: 'Population (millions)' } }; config.legend = { enabled: false }; config.tooltip = tooltip: { formatter: function() { return ''+ this.x +'
' + 'Population in 2008: '+ Highcharts.numberFormat(this.y, 1) + ' millions'; } }; config.series = data; return config; }; //now, creating a new chart is easy! charts.push(new Highcharts.Chart( getChartConfig("container", "title", data) )) });