How to draw google pie chart in loop using php and javascript

Question

I am trying draw pie chart in loop. In my array there are 3 values and i want to draw 3 pie individual charts. I have tried like below.

<?php foreach($pie as $m)
 { ?>
      google.charts.load('current', {'packages':['corechart']});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {
		
    
    var data = google.visualization.arrayToDataTable([
		 ['Task', 'Hours per Day'],
		<?php foreach($piearray[$m] as $kf=>$v){	?>
          ['<?php echo $kf;?>', <?php echo $v;?>],
		  <?php } ?>
        ]);
		
        var options = {
          title: 'Brand Placement'
        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart<?php echo $m;?>'));

        chart.draw(data, options);
      } <?php }?>

<script src="https://gstatic.com/charts/loader.js"></script>
 <?php foreach($pie as $mi)
 {
 <div id="piechart<?php echo $mi;?>" style="width: 900px; height: 500px;"></div>
 }
}

but it is running only one last one.Please help me.

Answer 1

I added $m for drawchart function in loop. It is working. I have referred below link:

Drawing pie charts on google map using for loop does not functioning well