<script>

$(document).ready(function(){


  $.ajax({
    url: "analytics/chart1.php",
    method: "GET",
    dataType: "json",
    success: function(data) {     
      
      var cname = [];
      var ans = [];
      var coloR = [];
       var coloR2 = [];

           var dynamicColors = function() {
            var r = Math.floor(Math.random() * 255);
            var g = Math.floor(Math.random() * 255);
            var b = Math.floor(Math.random() * 255);
            return "rgb(" + r + "," + g + "," + b + ")";
         };
      

      for(var i in data) {
         cname.push( data[i].cname);
         ans.push(data[i].ans);
        coloR.push(dynamicColors());
         coloR2.push(dynamicColors());
        
                         }
      
      var ctx = document.getElementById('mycanvas');
      var mycanvas = new Chart(ctx, {
        type: 'bar',
        data: {
                labels:cname,
                datasets : [ {
                                label: ' Customer Registered  ',
                                backgroundColor:coloR,                              
                                borderColor:  coloR2,
                               
                                hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
                                hoverBorderColor: 'rgba(200, 200, 200, 1)',
                                data: ans,
                                fill: false
                              } ]
              }
      });
    }
  });

// second chart


 $.ajax({
    url: "analytics/chartpie2.php",
    method: "GET",
    dataType: "json",
    success: function(data) {     
      
      var dname = [];
      var ans = [];
       var coloR = [];
       var coloR2 = [];

       var dynamicColors = function() {
            var r = Math.floor(Math.random() * 255);
            var g = Math.floor(Math.random() * 255);
            var b = Math.floor(Math.random() * 255);
            return "rgb(" + r + "," + g + "," + b + ")";
         };
      

      for(var i in data) {
         dname.push( data[i].dname);
         ans.push(data[i].ans);
         coloR.push(dynamicColors());
         coloR2.push(dynamicColors());
        
                         }
      
      var ctx2 = document.getElementById('mycanvaspie');
      var mycanvaspie = new Chart(ctx2, {
        type: 'pie',
        data: {
               //  labels: dname,
                datasets : [ {
                                label: 'Customers  ',
                                backgroundColor:coloR,                              
                                borderColor:  coloR2,
                                hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
                                hoverBorderColor:coloR2,
                                data: ans,
                                fill: false
                              } ]
              }
      });
    }
  });

// Third chart
  $.ajax({
    url: "analytics/dashboardchartall.php",
    method: "GET",
    dataType: "json",
    success: function(data) {     
      
      var dname = [];
      var ans = [];
      var coloR = [];
      var coloR2 = [];

       var dynamicColors = function() {
            var r = Math.floor(Math.random() * 255);
            var g = Math.floor(Math.random() * 255);
            var b = Math.floor(Math.random() * 255);
            return "rgb(" + r + "," + g + "," + b + ")";
         };

      

      for(var i in data) {
         dname.push( data[i].dname);
         ans.push(data[i].ans);
          coloR.push(dynamicColors());
          coloR2.push(dynamicColors());
        
                         }
      
      var ctx = document.getElementById('mycanvas2');
      var mycanvas2 = new Chart(ctx, {
        type: 'bar',
        data: {
                labels: dname,
                datasets : [ {
                                label: ' Vehicles  ',
                                backgroundColor: coloR ,                              
                                borderColor: 'rgba(75, 200, 200, 1)',
                                hoverBackgroundColor:coloR2,
                                hoverBorderColor: 'rgba(200, 200, 200, 1)',
                                data: ans,
                                fill: false
                              } ]
              }
      });
    }
  });





});


</script>