title: Grouping Data in Google Apps Script Charts
body: <p>I'm trying to build a simple dashboard app using google apps script to pull data from a google spreadsheet and then display that data visually using charts on the dashboard.</p>
  
  <p>I've managed to carry out those initial steps but am having problems trying to group the data to prevent multiple slices in the pie chart being assigned to the same task. In the below source spreadsheet you'll see numerous entries of the "Support" task (column E) linked to different Clients (column B). What I need is to group the data based on the "Task" column (E) so the time entries recorded in column G (Hours) are totaled and displayed accordingly (i.e. one segment of the pie chart for each task regardless of client).</p>
  
  <p>I've searched the Apps Script Documentation and have essentially got lost in the noise and can't find any definitive way of doing this directly in Apps Script. I've found some info about potentially using Google Visualization to achieve something similar but am struggling with how to implement as there is so much conflicting documentation out there. </p>
  
  <p>Essentially I'm asking is this possible within Apps Script directly without 1st Querying the Data and producing another sheet (as a basis for the chart) or if not then what the most straightforward and/or best approach would be?</p>
  
  <p>Data Source:
  <a href="https://docs.google.com/spreadsheets/d/1Gvqe89ytJxrKWOvGJWX5heYwrj5L-MP_Pe2jpTqqB5o/edit?usp=sharing" rel="nofollow noreferrer">https://docs.google.com/spreadsheets/d/1Gvqe89ytJxrKWOvGJWX5heYwrj5L-MP_Pe2jpTqqB5o/edit?usp=sharing</a></p>
  
  <p>Current App displays the below:
  <img src="https://i.stack.imgur.com/6FXbD.gif" alt="Current App Displays the below:"></p>
  
  <p>Apps Script Code:</p>
  
  <pre><code>function doGet() {
  var ss = SpreadsheetApp.openById('1Gvqe89ytJxrKWOvGJWX5heYwrj5L-MP_Pe2jpTqqB5o');
  var data = ss.getDataRange();
  
  var taskFilter = Charts.newCategoryFilter().setFilterColumnIndex(4).build();
  var clientFilter = Charts.newStringFilter().setFilterColumnIndex(1).build();
  
  var tableChart = Charts.newTableChart()
  .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([1,2,4,6]))
  .build(); 
  
  var pieChart = Charts.newPieChart()
  .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([4,6]))
  .build(); 
  
  var dashboard = Charts.newDashboardPanel().setDataTable(data)
  .bind([taskFilter, clientFilter], [tableChart, pieChart])
  .build();
  
  var app = UiApp.createApplication();
  var filterPanel = app.createVerticalPanel();
  var chartPanel = app.createHorizontalPanel();
  filterPanel.add(taskFilter).add(clientFilter).setSpacing(10);
  chartPanel.add(tableChart).add(pieChart).setSpacing(10);
  
  dashboard.add(app.createVerticalPanel().add(filterPanel).add(chartPanel));
  app.add(dashboard);
  return app;
  }
  </code></pre>