Javascript, чтобы вытащить несколько данных Google Spreadsheets для диаграмм чертежей

Я пытаюсь использовать Google App Script/Javascript, чтобы создать панель, основанную на данных, извлеченных из нескольких листов в файле Google Spreadsheet. Ниже приведены функциональные коды, которые могут успешно выполнить диаграмму данных августа. Я хочу, чтобы добавить июльские данные (лист 2) к диаграмме в качестве второй серии. Является ли это возможным?Javascript, чтобы вытащить несколько данных Google Spreadsheets для диаграмм чертежей

Если бы я мог выяснить, как хранить и получать доступ к таблице данных каждого месяца, я думаю, я должен использовать метод .join() для объединения этих таблиц. https://developers.google.com/chart/interactive/docs/reference?hl=en#join

Оцените это заранее за любую помощь!

<html> 
 
    <head> 
 
    <title> 
 
     Test 
 
    </title> 
 
    <!--Load the AJAX API--> 
 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
 
    <script type="text/javascript"> 
 
     google.load('visualization', '1', {'packages': ['table', 'controls', 'corechart']}); 
 
     google.setOnLoadCallback(initialize); 
 

 
     function initialize() { 
 

 
       var urlMonth = 'https://docs.google.com/spreadsheets/d/1_mSbT87MVWOiX2cfKX_x3dgTnToY5ulCWeGGCVn13iQ/gviz/tq?sheet=Sheet1&tq=' 
 
       
 
       var queryStringMonthly = encodeURIComponent("SELECT B, sum(C), sum(D), sum(E), sum(F), sum(G), sum(H) GROUP BY B LABEL B 'Issue' "); 
 

 
       var queryMonthCurrent = new google.visualization.Query(urlMonth+ queryStringMonthly); 
 
       queryMonthCurrent.send(megaData); 
 

 
     } 
 

 
    function megaData(monthData) { 
 
     var monthData_table = monthData.getDataTable(firstRowIsHeader = true); 
 

 
     var monthData_tablePivot = new google.visualization.DataTable(); 
 
     monthData_tablePivot.addColumn('string', 'Rep'); 
 
     monthData_tablePivot.addColumn('number', 'August'); 
 
     monthData_tablePivot.addColumn({type: 'string', label: 'Issue', role: 'annotation'}); 
 

 
     var newRows = []; // 
 

 
     //iterate through each row 
 
     for (i = 0; i < monthData_table.getNumberOfRows(); i ++) { 
 
      var issue = monthData_table.getValue(i, 0); 
 
      //iterate through each column 
 
      for (j = 1; j < monthData_table.getNumberOfColumns(); j ++){ 
 
      var newRow = []; // use an array to park [RepName1, tickets#, Issue1] 
 
      rep = monthData_table.getColumnLabel(j); 
 
      newRow.push(rep); 
 
      newRow.push(monthData_table.getValue(i, j)); 
 
      newRow.push(issue); 
 
      newRows.push(newRow); //push each newRow to newRows 
 
      } 
 
     } 
 

 
     monthData_tablePivot.addRows(newRows); 
 

 
     // Create a dashboard. 
 
     var dashboard = new google.visualization.Dashboard(
 
      document.getElementById('dashboard_div4')); 
 

 
     // Create filter 
 
     var issueFilter = new google.visualization.ControlWrapper({ 
 
      'controlType': 'CategoryFilter', 
 
      'containerId': 'filter_div4', 
 
      'options': { 
 
      'filterColumnLabel': 'Issue', 
 
      'ui': { 
 
      'allowMultiple': false, 
 
      'allowNone': false, 
 
      } 
 
      }, 
 
      //Set default filter value 
 
      'state': {'selectedValues': [monthData_table.getValue(0 , 1)]} 
 
     } 
 
     ); 
 

 
     
 
     //create chart 
 
     var yearChart = new google.visualization.ChartWrapper({ 
 
      'chartType': 'ColumnChart', 
 
      'containerId': 'current_year', 
 
      'options': { 
 
       'legend': {'position': 'right'}, 
 
       //Set the fontsize of labels so they don't show up crazily 
 
       'annotations': {'textStyle': {'opacity': 0}, 
 
          //use 'line' style so to remove the line pointer 
 
          'style': 'point', 
 
          'stemLength': 0 
 
          }, 
 
      } 
 
     }); 
 

 
     // bind charts and controls to dashboard 
 
     dashboard.bind(issueFilter, yearChart); 
 
     // Draw the dashboard. 
 
     dashboard.draw(monthData_tablePivot);   
 
     } 
 

 
    </script> 
 
    </head> 
 

 
    <body> 
 
    <!--Div that will hold the dashboard--> 
 
    <div id="dashboard_div4"> 
 
     <div id="filter_div4"> </div> 
 
     <div id="current_year" style="align: right; width:1100px; height: 300px;"> 
 
     </div> 
 
    </div>  
 

 
</html>

источник

2015-08-28 Lily

Я думаю, что это возможно, проверьте документацию https://developers.google.com/chart/interactive/docs/gallery/columnchart#creating-material-column- диаграммы и пример, связанный с этим. В основном вам нужны 3 столбца в качестве входных данных. насколько я знаю, при запросе листов он берет информацию с первой. вы, вероятно, могли бы управлять информацией с каждого месяца на других листах, а в первой можно скопировать нужную вам информацию. – Gerardo

Привет, @Gerado. Спасибо за комментарий. Моя задача состоит в том, что я не знаю, как вернуть «информацию с первой», потому что таблица данных «monthData_tablePivot» завернута в функцию «megaData (monthData)». – Lily

в функции «initialize» - это то, где вы вызываете google.visualization.Query с вашей таблицей в качестве параметра. эта функция будет извлекать информацию из первого листа в Таблице. С помощью оператора select вы описываете, как вы хотите, чтобы информация была организована, о чем я упомянул, так это то, что вы также можете получить информацию о июле на этом листе и поместить эту информацию в другой столбец «monthData_table», – Gerardo

Вот решение, которое может решить мою проблему. Если у кого-то есть лучшее решение, я был бы признателен, если вы можете поделиться им здесь. В принципе вы можете использовать finished(); в конце функции megaData(monthData), чтобы обойти асинхронный javascript. Таким образом, структура будет выглядеть следующим образом:

function initialize() { 

    var urlMonth = 'https://docs.google.com/spreadsheets/d/1dTeqpX1If74h5_I3POrYkoktSm7FxV47iSUHshhlmI4/gviz/tq?sheet=Sheet1&tq=' 
    var queryStringMonthly = encodeURIComponent("SELECT B, sum(C), sum(D), sum(E), sum(F), sum(G), sum(H) GROUP BY B LABEL B 'Issue' "); 
    var queryMonthCurrent = new google.visualization.Query(urlMonth+ queryStringMonthly); 
    queryMonthCurrent.send(megaData); 

    var urlOneMonthPrior = 'https://docs.google.com/spreadsheets/d/1dTeqpX1If74h5_I3POrYkoktSm7FxV47iSUHshhlmI4/gviz/tq?sheet=Sheet2&tq=' 
    var queryStringOneMonthPrior = encodeURIComponent("SELECT B, sum(C), sum(D), sum(E) GROUP BY B LABEL B 'Issue' "); 
    var queryMonthOnePior = new google.visualization.Query(urlMonth+ queryStringOneMonthPrior); 
    queryMonthOnePior.send(megaData); 

    } 

    function megaData(monthData) { 
    //... 
    //use codes from the question post 
    finished(); 
    } 

    function finished() { 
    if (dataTables.length != 2) { 
    //do nothing if data tables are not fully ready 
     return; 
    } 
    //blahblah do something with all the data tables 
    }

источник

2015-09-01 01:27:09 Lily

Javascript, чтобы вытащить несколько данных Google Spreadsheets для диаграмм чертежей

ответ

Смежные вопросы