title: Using multiple Highcharts in a single page
body: <p>I’m using Highcharts and I want to add multiple charts to a single page</p>
  
  <p>below is my js code</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(function () {
      var chart;
      $(document).ready(function() {
  
          chart = new Highcharts.Chart({
              chart: {
                  renderTo: 'container',
                  plotBackgroundColor: null,
                  plotBorderWidth: null,
                  plotShadow: false
              },
              title: {
                  text: 'Visual Data'
              },
              tooltip: {
                  formatter: function() {
                      return '&lt;b&gt;'+ this.point.name +'&lt;/b&gt;: '+ this.percentage +' %';
                  }
              },
              plotOptions: {
                  pie: {
                      allowPointSelect: true,
                      cursor: 'pointer',
                      dataLabels: {
                          enabled: true,
                          color: '#000000',
                          connectorColor: '#000000',
                          formatter: function() {
                              return '&lt;b&gt;'+ this.point.name +'&lt;/b&gt;: '+ this.percentage +' %';
                          }
                      }
                  }
              },
  
              series: [{
  
                  type: 'pie', 
                  name: 'Market Share',
                  data: [
                      ['Plan 1',       &lt;?php echo $1; ?&gt;],
                      ['Plan 2',    &lt;?php echo $2; ?&gt;],
                      ['Plan 3',     &lt;?php echo $3; ?&gt;]
  
                  ]
              }]
          });
      });
  
  });
          &lt;/script&gt;
  </code></pre>
  
  <p>I can simple repeat the code and change the code
  renderTo: 'container' to display the other charts  but the code is duplicated many times.</p>
  
  <p>Is there any better way that i can reuse the code so I can pass the data to</p>
  
  <pre><code> series: []
  
  title: {
                  text: 'Visual Data'
              },
  </code></pre>
  
  <p>to display multiple charts. Currently I want to show 5 charts in a single page.</p>