Javascript 操纵电子表格数据以实现可视化_Javascript_Google Apps Script_Google Sheets_Google Visualization

Javascript 操纵电子表格数据以实现可视化

javascript google-apps-script google-sheets google-visualization

Javascript 操纵电子表格数据以实现可视化,javascript,google-apps-script,google-sheets,google-visualization,Javascript,Google Apps Script,Google Sheets,Google Visualization,我刚开始学习Google Apps脚本/JavaScript，想知道如何从Google电子表格中重塑、操作多维数据。我读过一些帖子，比如说GAS在数据处理方面不灵活。但是这篇文章有点过时了，所以我想知道气体功能是否有任何新的变化/增加下面是要开始的功能代码。它可以成功地绘制下面的图表。但我真正想要的是：按“工作日”（dayOfWeek（toDate（A）））和“项目”（列B）分组使用“Item”作为过滤器我尝试使用PIVOT B，按周日分组（toDate（A）），，但它返回了一个或多个

我刚开始学习Google Apps脚本/JavaScript，想知道如何从Google电子表格中重塑、操作多维数据。我读过一些帖子，比如说GAS在数据处理方面不灵活。但是这篇文章有点过时了，所以我想知道气体功能是否有任何新的变化/增加

下面是要开始的功能代码。它可以成功地绘制下面的图表。但我真正想要的是：

按“工作日”（

dayOfWeek（toDate（A））

）和“项目”（

列B

）分组

使用“Item”作为过滤器

我尝试使用

PIVOT B

，

按周日分组（toDate（A）），

，但它返回了

一个或多个参与者未能绘制（）×

错误消息或意外格式

<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 url = 'https://docs.google.com/spreadsheets/d/1_mSbT87MVWOiX2cfKX_x3dgTnToY5ulCWeGGCVn13iQ/gviz/tq?sheet=Sheet1&tq='   

              var queryStringDaily = encodeURIComponent("SELECT dayOfWeek(toDate(A)), sum(C), sum(D), sum(E), sum(F), sum(G), sum(H) GROUP BY dayOfWeek(toDate(A)) LABEL dayOfWeek(toDate(A)) 'Weekday' " ); 

              var queryDaily = new google.visualization.Query(url+ queryStringDaily);
              queryDaily.send(drawDaily);
      }

      function drawDaily(dailyTicket) {

                //prepare data
                var dailyTicket_table = dailyTicket.getDataTable(firstRowIsHeader = true); 

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

                // Create a filter
                var categoryFilter = new google.visualization.ControlWrapper({
                  'controlType': 'CategoryFilter',
                  'containerId': 'filter_div2',
                  'options': {
                    'filterColumnLabel': 'Weekday'
                  }
                });

                //create chart
                var dailyChart = new google.visualization.ChartWrapper({
                  'chartType': 'LineChart',
                  'containerId': 'current_day',
                  'options': {
                    'title': 'Tickets by Rep, Item, and Weekday',
                    'legend': {position: 'right'},
                    //reformat x-axis tickmarks
                    'hAxis': {'viewWindow': {'min': 1.5, 'max': 6.5},
                              'ticks': [//{v: 1, f: 'Sunday'}, 
                                        {v: 2, f: 'Monday'}, 
                                        {v: 3, f: 'Tuesday'}, 
                                        {v: 4, f: 'Wednesday'}, 
                                        {v: 5, f: 'Thursday'}, 
                                        {v: 6, f: 'Friday'}, 
                                        //{v: 7, f: 'Saturday'}
                                        ] 
                            },                    
                  }
                });

                // bind charts and controls to dashboard 
                dashboard.bind(categoryFilter, dailyChart); 

                // Draw the dashboard.
                dashboard.draw(dailyTicket_table);

      }


    </script>
  </head>

  <body>
    <!--Div that will hold the dashboard-->
    <div id="dashboard_div2"></div>
    <!--Divs that will hold each control and chart-->
    <div id="filter_div2"></div>
    <div id="current_day" style="align: center; width: 500px; height: 250px;"></div>

  </body>
</html>


试验
load（'visualization'，'1'，{'packages'：['table'，'controls'，'corechart']}）；
setOnLoadCallback（初始化）；
函数初始化（）{
var url='1〕https://docs.google.com/spreadsheets/d/1_mSbT87MVWOiX2cfKX_x3dgTnToY5ulCWeGGCVn13iQ/gviz/tq?sheet=Sheet1&tq='   
var queryStringDaily=encodeURIComponent（“选择星期日（ToDayOfWeek）（toDate（A））、和（C）、和（D）、和（E）、和（F）、和（G）、和（H）按星期日分组（ToDayOfWeek（ToDayOfWeek）（ToDayOfWeek）（ToDayDate（A））‘工作日’）；
var queryDaily=new google.visualization.Query（url+queryStringDaily）；
查询每日发送（每日提取）；
}
功能提取每日（每日票据）{
//准备数据
var dailyTicket_table=dailyTicket.getDataTable（firstRowIsHeader=true）；
//创建一个仪表板。
var dashboard=new google.visualization.dashboard(
document.getElementById（'dashboard_div2'）；
//创建一个过滤器
var categoryFilter=new google.visualization.ControlWrapper({
“controlType”：“CategoryFilter”，
“containerId”：“filter_div2”，
“选项”：{
'filterColumnLabel'：'Weekday'
}
});
//创建图表
var dailyChart=new google.visualization.ChartWrapper({
“图表类型”：“线条图”，
“集装箱运输”：“当前日”，
“选项”：{
“标题”：“按代表、项目和工作日列出的门票”，
'图例'：{位置：'右'}，
//重新格式化x轴记号
hAxis:{'viewWindow'：{'min'：1.5，'max'：6.5}，
"ticks":[/{v:1,f:"Sunday",，
{v:2，f:'星期一'}，
{v:3，f:'星期二'}，
{v:4，f:'星期三'}，
{v:5，f:'星期四'}，
{v:6，f:'星期五'}，
//{v:7，f:'星期六'}
] 
},                    
}
});
//将图表和控件绑定到仪表板
仪表板绑定（分类过滤器，dailyChart）；
//绘制仪表板。
仪表板.绘图（每日票据表）；
}

您可以添加多个过滤器。要对源数据执行此操作，请执行以下操作：

您需要

选择

附加文本列

，并将其包括在

分组依据

和可选的

标签

语句中

var queryStringDaily=encodeURIComponent（“选择B，星期几（toDate（A）），和（C），
总和（D）、总和（E）、总和（F）、总和（G）、总和（H）
按星期日分组（toDate（A）），B
标签dayOfWeek（toDate（A））为“工作日”，B为“发布日”；

请注意，我们首先有

。如果我们不这样做，我们就会得到你提到的错误。这是因为

LineChart

需要一个标签列，然后是相关序列的列。将文本列移动到

SELECT

侧边的开始位置会导致错误

为“问题”添加筛选器

var issueFilter=new google.visualization.ControlWrapper({
“controlType”：“CategoryFilter”，
“集装箱运输”：“发行部门”，
“选项”：{
“filterColumnLabel”：“问题”
}
});

将新筛选器绑定到仪表板

dashboard.bind（issueFilter，dailyChart）；

就这样

。。。不，不是。因为

Issue

是我们的第一个专栏，所以它被选为长轴，这不是很有用

在这一点上，您的挑战是选择一个与您的数据相匹配的适当可视化-因为折线图不匹配

注意：此代码段是可运行的

google.load（'visualization'，'1'{
“包”：[“表”、“控件”、“核心图表”]
});
setOnLoadCallback（初始化）；
函数初始化（）{
var url='1〕https://docs.google.com/spreadsheets/d/1_mSbT87MVWOiX2cfKX_x3dgTnToY5ulCWeGGCVn13iQ/gviz/tq?sheet=Sheet1&tq='
var queryStringDaily=encodeURIComponent（“选择B，星期日（toDate（A）），总和（C），总和（D），总和（E），总和（F），总和（G），总和（H）按星期日分组（toDate（A）），B标签星期日（ToDayOfWeek）（toDate（A））‘工作日’，B‘发布’；
var queryDaily=new google.visualization.Query（url+queryStringDaily）；
查询每日发送（每日提取）；
}
功能提取每日（每日票据）{
//准备数据
var dailyTicket_table=dailyTicket.getDataTable（firstRowIsHeader=true）；
log（JSON.stringify（dailyTicket\u表）.replace（/\ \“/g，”）.replace（/“/g，”）；
//创建一个仪表板。
var dashboard=new google.visualization.dashboard(
document.getElementById（'dashboard-div'）；
//创建一个过滤器
var issueFilter=new google.visualization