Pay attentions! Absolute beginner :)

44 views
Skip to first unread message

Vincenzo Segneri

unread,
Jun 16, 2016, 1:57:35 PM6/16/16
to Google Visualization API
Hi, I'm a Acucobol software developer trying to reply wonderful Google Chart example showned in the gallery.
I've written 'my' own code, but it does not work (of course). 
Can someone give a fresh look to the following code and report which are and correcting mistakes lines?
Thank you for your kind help.


<html>
<head>
  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['line']});

//    Can I gather these 2 frases together?  
      google.charts.load("current", {packages:["corechart"]});
      google.charts.setOnLoadCallback(drawChart);

    function drawChart() {
      var data = new google.visualization.DataTable();
      data.addColumn('number', 'Day');
      data.addColumn('number', 'Guardians of the Galaxy');
      data.addColumn('number', 'The Avengers');
      data.addColumn('number', 'Transformers: Age of Extinction');
      data.addRows([
        [1,  37.8, 80.8, 41.8],
        [2,  30.9, 69.5, 32.4],
        [3,  25.4,   57, 25.7],
        [4,  11.7, 18.8, 10.5],
      ]);
      var options = {
        chart: {
          title: 'Box Office Earnings in First Two Weeks of Opening',
          subtitle: 'in millions of dollars (USD)'
        },
        width: 900,
        height: 500,
        axes: {
          x: {
            0: {side: 'bottom'}
          }
        }
      };
      var chart = new google.charts.Line(document.getElementById('line_top_x'));
      chart.draw(data, options);
 
//      Code pasted from Pie Donut example  
        var data2 = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     11],
          ['Eat',      2],
          ['Commute',  2],
          ['Watch TV', 2],
          ['Sleep',    7]
        ]);

        var options2 = {
          title: 'My Daily Activities',
          pieHole: 0.4,
 colors: ['#CC0000', '#999999', '#EEEEEE', '#FF9999', 'red'],
        };

        var chart2 = new google.visualization.PieChart(document.getElementById('donutchart'));
        chart2.draw(data2, options2);  
    }
  </script>
</head>
<body>
  <td>Hello World! </td>
  <div id="line_top_x"></div>
<td>
  <div id="donutchart" style="width: 900px; height: 500px;"></div>
</td>
</body>
</html>

Daniel LaLiberte

unread,
Jun 16, 2016, 4:24:21 PM6/16/16
to Google Visualization API
You have two calls of google.charts.load().  You should see an error message about that if you look in your JS console.  

But if you change 'current' to 'upcoming' this should work for you now.  Or simply change to packages: [ 'corechart', 'line' ] 

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/cb97f3d3-472d-4c4b-a8aa-042fc8846f6d%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.



--

Vincenzo Segneri

unread,
Jun 17, 2016, 12:53:10 AM6/17/16
to Google Visualization API
Great!! It works now.
Thanks for you kink help.

To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.



--
Reply all
Reply to author
Forward
0 new messages