Tuesday, 17 January 2017

Session3-My First Google Charts-part3_12Jan

Creating a Dashboard - Part 1

When you have a lot of data to be shown on a page, it makes sense to give the viewer an opportunity to filter some of the data so that he or she gets a cleaner view. In this case, we will first draw a rather clumsy Column Chart and then in the next section. The data for the chart is drawn from this spreadsheet. The chart shown below can also be seen in this regular HTML page.


Basic Column Chart Showing All Data

Data Source


Linkfor Data Source


Note how we have specified:



  • the Google Docs spreadsheet : https://docs.google.com/spreadsheets/d/1k0xYnDU78GYGuMivC-JTD3AakxyftIS4-Z_ptboPsQs/edit?usp=sharing
  • the sheet : sheet=MilkProduction
  • range : range=B2:H37
  • headers : headers=1
  • columns : query.setQuery('select B,E,F');
  • chart type : var chartMQ = new google.visualization.ColumnChart(document.getElementById('chart_divMQ'));

No comments:

Post a Comment