2011-06-15 12 views
2

私は助けが必要ですが、私は同じレンダリングで6つのチャートを作成する必要がありますが、ajaxコール(jquery)私はどうですか?同じレンダリング、異なるデータ(ハイチャート)の6つのチャートを作成

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 '<b>'+ this.x +'</b><br/>'+ 
        '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' 
       } 
      }   
      }] }); 

     }) 

; 
+0

を?すべての設定を設定し、別のデータを渡すことができます。 6つのチャートを同時に表示していますか? – NT3RP

+0

はい私は6つのチャートを同時に表示します。 –

答えて

7

あなたは、異なるデータで複数のグラフを持っているしたいのですが、同じ設定の場合、このような何か試してください:あなたは「同じレンダリング」とはどういう意味ですか

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 '<b>'+ this.x +'</b><br/>' + 
        '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) 
    )) 
}); 
関連する問題