title: Multiple bubble chart datasets for chartjs
body: <p>I have an array called <code>main_arr</code> which has multiple data arrays within it.</p>
  
  <p>So i am using a <code>bubble chart</code> to show all these different arrays in different colors to distinguish them</p>
  
  <pre><code>var myBubbleChart = new Chart(ctx, {
      type : 'bubble',
      data : {
          datasets : [
              {
                  label : 'Group 1: ' + main_arr[0].length,
                  data : main_arr[0],
                  backgroundColor : 'lightblue'
              }, {
                  label : 'Group 2: ' + main_arr[1].length,
                  data : main_arr[1],
                  backgroundColor : 'pink'
              }
          ],
      },
      options : {
          scales : {
              yAxes : [{
                      ticks : {
                          beginAtZero : true,
                          min : 0,
                          max : 100
                      }
                  }
              ],
              xAxes : [{
                      ticks : {
                          beginAtZero : true,
                          min : 0,
                          max : 10
                      }
                  }
              ],
          }
      }
  });
  </code></pre>
  
  <p>This works perfectly. But i want to make it dynamic so that i dont need to hard code <code>main_arr[0]</code>, <code>main_arr[1]</code>...so on for each array.</p>
  
  <p>So i want to use a for loop that loops through the <code>main_arr</code> and initialize the dataset.</p>
  
  <pre><code>datasets : [
      for (var i = 0; i &lt; main_arr.length; i++) { {
              label : 'Group ' + i + ': ' + main_arr[i].length,
              data : main_arr[i],
              backgroundColor : 'lightblue'
          }
      }
  ],
  </code></pre>
  
  <p>This gives an error in the console: </p>
  
  <pre><code>Uncaught SyntaxError: Unexpected token for
  </code></pre>
  
  <p>So how to achieve this ?</p>