Welcome Guest, Not a member yet? Register   Sign In
Need help / Results from an array to a JS function with Google Charts API
#1

[eluser]Ludovic-r[/eluser]
Hi Ci mates Wink I'm working on an open Source CMS based on CodeIgniter and I'm trying to integrate a chart system with the API of Google Analytics.

Let me explain :

I've successfully retrieved the informations from Google Analytics (like visits, page views and so on) and it gives me an Array :

Code:
Array
(
    [] => Array
        (
            [ga:visits] => 800
            [ga:pageviews] => 1200
        )
    [] => Array
        (
            [ga:visits] => 400
            [ga:pageviews] => 900
        )
) ...

Then to use the informations I've made a foreach loop

Code:
foreach ($report as $value) {
            echo $value["ga:visits"];
            echo '-';
        }

I've all my statistics with this 'echo' and it appears like this 1200-300-450- and so on. great until now.

Well, now I use the Charts API from Google to make a chart and I have this piece of code :

Code:
// Load the Visualization API and the piechart package.
      google.load('visualization', '1.0', {'packages':['corechart']});
      
      // Set a callback to run when the Google Visualization API is loaded.
      google.setOnLoadCallback(drawChart);


      // Callback that creates and populates a data table,
      // instantiates the pie chart, passes in the data and
      // draws it.
      function drawChart() {

      // Create the data table. I NEED TO PLACE MY RETRIEVED INFORMATIONS FROM THE FOREACH LOOP HERE :
      var data = new google.visualization.DataTable();
      data.addColumn('string', 'Month');
      data.addColumn('number', 'visits');
      data.addRows(8);
      data.setValue(0, 0, 'Day 1');
      data.setValue(0, 1, 1000);
      data.setValue(1, 0, 'Day 2');
      data.setValue(1, 1, 70);
      data.setValue(2, 0, 'Day 3');
      data.setValue(2, 1, 860);
      data.setValue(3, 0, 'Day 4');
      data.setValue(3, 1, 1030);

      // Set chart options
      var options = {
'title':'test',
'width':1200,
'height':600,
'legend' : 'bottom',
'series' : {0:{color: 'black', pointSize : 12, visibleInLegend: true}},
'backgroundColor' : '#FFFFFF',
                };

      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }

I just want to use my retrieved informations from the foreach loop in the 'data.setValue(..., ..., ...);' of this JS function.


Any help would be very very very appreciated Big Grin Thanks !!!




Theme © iAndrew 2016 - Forum software by © MyBB