带有PHP和javascript数组的Google图表

Question

I am trying to loop through an array elements to populate a google chart. I can call array elements directly in php and in javascript and I also even converted a php array into a javascript array. But I can only call an array element and not loop through an array.

What I can do...

<script src="js/modernizr.js"></script>

    <!--Load the AJAX API-->    
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>    
    <script type="text/javascript">      

    var dateArray = <?php echo (json_encode($arrayDate)); ?>;
    var hitsArray = <?php echo (json_encode($arrayHits)); ?>;
    <!---document.write(myVariable);-->



    <!--Content Delivery Network Stats-->   
        google.load("visualization", "1", {packages:["corechart"]});      
        google.setOnLoadCallback(drawChart);      
        function drawChart() {        
        var data = google.visualization.arrayToDataTable([ 
        ['Date', 'Hits'],

                [dateArray[0], +hitsArray[0] ],
                [dateArray[1], +hitsArray[1] ],
                [dateArray[2], +hitsArray[2] ]

                ]);


        var options = {  title: 'Content Delivery Network Stats',          
        hAxis: {title: 'Date', titleTextStyle:   {color: 'red'}}        };        
        var chart = new google.visualization.ColumnChart  (document.getElementById('chart_div'));        chart.draw(data, options);      }
      <!--Content Delivery Network Stats-->
  </script>

What I am trying to do....

<script src="js/modernizr.js"></script>

    <!--Load the AJAX API-->    
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>    
    <script type="text/javascript">      

    var dateArray = <?php echo (json_encode($arrayDate)); ?>;
    var hitsArray = <?php echo (json_encode($arrayHits)); ?>;
    <!---document.write(myVariable);-->



    <!--Content Delivery Network Stats-->   
        google.load("visualization", "1", {packages:["corechart"]});      
        google.setOnLoadCallback(drawChart);      
        function drawChart() { 

        var myDataArray = [['Date', 'Hits']];
        for (var i = 0; i < dateArray.length; i++) {
            myDataArray.push([dateArray[i], hitsArray[i]);
        }
        var data = google.visualization.arrayToDataTable(myDataArray);              

        var options = {  title: 'Content Delivery Network Stats',          
        hAxis: {title: 'Date', titleTextStyle: {color: 'red'}}        };        
        var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));        chart.draw(data, options);      }
    <!--Content Delivery Network Stats-->
   </script>

Answer 1

Try this:

var myDataArray = [['Date', 'Hits']];
for (var i = 0; i < dateArray.length; i++) {
    myDataArray.push([dateArray[i], hitsArray[i]]);
}
var data = google.visualization.arrayToDataTable(myDataArray);