title: Display multiple datasets from array with chart.js
body: <p>I'm trying to display a multiple line chart of about the growth of the population on the different department of a country but when I get the JSON from PHP I can't iterate the array for getting the year and total of the population. Here's my code:</p>
  
  <pre><code>$(document).ready(function(){
  
   $.ajax({
  
     url: "../assets/api/stats.php",
  
     data: "stat=birth&amp;in=departement",
  
     type: "GET",
  
     success: function(data) {
        console.log(data);
        var departement = {
               Zone: []
        };
  
        var year = {
               Birth: []
        };
  
        var total = {
               Birth: []
        };
  
        var len = data.length;
        console.log(data.length);
  
        var lctx = $('#line-chart- departement');
        for (var j = 0; j &lt; len; j++) {
  
       departement.Zone.push(data[j][0].departement);
  
       for (var i = 0; i &lt; data.length; i++) {
         annee.Naissance.push(departement.Zone[i].annee);
         total.Naissance.push(departement.Zone[i].total);
       }
  
       var data = {
         labels: annee.Naissance,
         datasets: [{
           label: data[j],
           data: total.Naissance,
           backgroundColor: getRandomColor(),
           borderColor: "#3e95cd",
           fill: false,
           lineTension: 0,
           pointRadiues: 5
         }]
       };
       console.log();
       var chart = new Chart(lctx, {
         type: "line",
         data: data,
         options: {}
       });
  
     }
   },error: function(data) {
     //console.log(data)
   }
     });
     function getRandomColor() {
  
     var letters = '0123456789ABCDEF'.split('');
     var color = '#';
     for (var i = 0; i &lt; 6; i++) {
     color += letters[Math.floor(Math.random() * 16)];
   }
  
   return color;}
   });
  </code></pre>
  
  <p>And there is my array</p>
  
  <pre><code>[
  
      {
          "Nord-Est": 
         [
              {
                  "annee": "1995",
                  "totalnaissance": "1"
              }
          ]
      },
      {
          "Ouest": 
          [
              {
                  "annee": "1994",
                  "totalnaissance": "2"
              },
              {
                  "annee": "1995",
                  "totalnaissance": "1"
              }
          ]
      },
      {
          "Nippes": 
          [
              {
                  "annee": "1951",
                  "totalnaissance": "1"
              },
              {
                  "annee": "1987",
                  "totalnaissance": "1"
              },
              {
                  "annee": "1986",
                  "totalnaissance": "1"
              },
              {
                  "annee": "1992",
                  "totalnaissance": "2"
              }
          ]
      },
      {
          "Sud-Est": 
          [
              {
                  "annee": "1985",
                  "totalnaissance": "1"
              }
          ]
      }
  ]
  </code></pre>