Javascript 使用Google Apps脚本和UiApp（）填充饼图

试图从电子表格中用谷歌应用程序脚本构建一个饼图，但到目前为止一切都不起作用

以下是我现在掌握的代码：

代码：

function doGet() {

var ss   =   SpreadsheetApp.openById('1lmmpJs2Bz3EfQWExB4KXq_uJWoLlq1PMCahy6w4ipcE');
var data = ss.getDataRange();

/* Build filters to analyze charts */
var neighborhoodFilter   = Charts.newCategoryFilter().setFilterColumnIndex(2).build();
var attendanceFilter     = Charts.newCategoryFilter().setFilterColumnIndex(3).build();

var pieChart   =  Charts.newPieChart()
                 .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([2,3]))
               .build();


var dashboard  =  Charts.newDashboardPanel().setDataTable(data)
               .bind([neighborhoodFilter, attendanceFilter], [pieChart])
               .build();

var app         = UiApp.createApplication();
var filterPanel = app.createVerticalPanel();
var chartPanel  = app.createHorizontalPanel();
filterPanel.add(neighborhoodFilter).add(attendanceFilter).setSpacing(10);
chartPanel.add(pieChart).setSpacing(10);


dashboard.add(app.createVerticalPanel().add(filterPanel).add(chartPanel));
app.add(dashboard);
return app;
}

function doGet() {

var ss   = SpreadsheetApp.openById('1lmmpJs2Bz3EfQWExB4KXq_uJWoLlq1PMCahy6w4ipcE');
var data = ss.getDataRange();

/* Build filters to analyze charts */
var nameFilter           = Charts.newStringFilter().setFilterColumnIndex(1).build();
var neighborhoodFilter   = Charts.newCategoryFilter().setFilterColumnIndex(2).build();
var attendanceFilter     = Charts.newCategoryFilter().setFilterColumnIndex(3).build();
var transportationFilter = Charts.newCategoryFilter().setFilterColumnIndex(4).build();
var travelFilter         = Charts.newCategoryFilter().setFilterColumnIndex(5).build();
var companyFilter        = Charts.newNumberRangeFilter().setFilterColumnIndex(6).build();

/* Build charts and dashboard object */
var tableChart =  Charts.newTableChart()
               .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([1,2,3,4,5,6]))
               .build();


var pieChart   =  Charts.newPieChart()
               .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([2,3]))
               .build();

var dashboard  =  Charts.newDashboardPanel().setDataTable(data)
               .bind([neighborhoodFilter, attendanceFilter, nameFilter, transportationFilter, travelFilter, companyFilter], [tableChart, pieChart])
               .build();

var app         = UiApp.createApplication();
var filterPanel = app.createVerticalPanel();
var chartPanel  = app.createHorizontalPanel();


 filterPanel.add(neighborhoodFilter).add(attendanceFilter).add(nameFilter).add(transportationFilter).add(travelFilter).add(companyFilter).setSpacing(10);
chartPanel.add(pieChart).add(tableChart).setSpacing(10);

dashboard.add(app.createVerticalPanel().add(filterPanel).add(chartPanel));
app.add(dashboard);
return app;
}

它已部署为web应用程序，可在此处看到：

我通过调试器运行它，一切正常

另外，为了更清楚，这是我试图创建的一个较大仪表板中的一个简化片段，它填充了两个图表

如果有用的话，下面是我尝试使用的全部代码（如本例中所预期的那样填充表格）：

代码：

function doGet() {

var ss   =   SpreadsheetApp.openById('1lmmpJs2Bz3EfQWExB4KXq_uJWoLlq1PMCahy6w4ipcE');
var data = ss.getDataRange();

/* Build filters to analyze charts */
var neighborhoodFilter   = Charts.newCategoryFilter().setFilterColumnIndex(2).build();
var attendanceFilter     = Charts.newCategoryFilter().setFilterColumnIndex(3).build();

var pieChart   =  Charts.newPieChart()
                 .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([2,3]))
               .build();


var dashboard  =  Charts.newDashboardPanel().setDataTable(data)
               .bind([neighborhoodFilter, attendanceFilter], [pieChart])
               .build();

var app         = UiApp.createApplication();
var filterPanel = app.createVerticalPanel();
var chartPanel  = app.createHorizontalPanel();
filterPanel.add(neighborhoodFilter).add(attendanceFilter).setSpacing(10);
chartPanel.add(pieChart).setSpacing(10);


dashboard.add(app.createVerticalPanel().add(filterPanel).add(chartPanel));
app.add(dashboard);
return app;
}

function doGet() {

var ss   = SpreadsheetApp.openById('1lmmpJs2Bz3EfQWExB4KXq_uJWoLlq1PMCahy6w4ipcE');
var data = ss.getDataRange();

/* Build filters to analyze charts */
var nameFilter           = Charts.newStringFilter().setFilterColumnIndex(1).build();
var neighborhoodFilter   = Charts.newCategoryFilter().setFilterColumnIndex(2).build();
var attendanceFilter     = Charts.newCategoryFilter().setFilterColumnIndex(3).build();
var transportationFilter = Charts.newCategoryFilter().setFilterColumnIndex(4).build();
var travelFilter         = Charts.newCategoryFilter().setFilterColumnIndex(5).build();
var companyFilter        = Charts.newNumberRangeFilter().setFilterColumnIndex(6).build();

/* Build charts and dashboard object */
var tableChart =  Charts.newTableChart()
               .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([1,2,3,4,5,6]))
               .build();


var pieChart   =  Charts.newPieChart()
               .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([2,3]))
               .build();

var dashboard  =  Charts.newDashboardPanel().setDataTable(data)
               .bind([neighborhoodFilter, attendanceFilter, nameFilter, transportationFilter, travelFilter, companyFilter], [tableChart, pieChart])
               .build();

var app         = UiApp.createApplication();
var filterPanel = app.createVerticalPanel();
var chartPanel  = app.createHorizontalPanel();


 filterPanel.add(neighborhoodFilter).add(attendanceFilter).add(nameFilter).add(transportationFilter).add(travelFilter).add(companyFilter).setSpacing(10);
chartPanel.add(pieChart).add(tableChart).setSpacing(10);

dashboard.add(app.createVerticalPanel().add(filterPanel).add(chartPanel));
app.add(dashboard);
return app;
}

此处可以看到与工作表图表的链接：

---

任何帮助都将不胜感激。谢谢。

您可能需要注意：

用户界面服务是。要创建用户界面，请改用

幸运的是，这里有一个教程“”

对于Google Apps脚本的用户，有两种可视化数据的方法：

继续使用Charts+UiApp。虽然已弃用且编辑器中不支持自动完成，但UiApp仍然可以工作。目前还没有宣布它将被关闭

按照谷歌的建议，使用HtmlService。已拒绝使用HtmlService支持的图表。因此，这个看似简单的建议包含了一个额外的要求，即使用Google的另一个API，也称为Google可视化API，或GViz

---

希望这有帮助

您可能需要注意：

用户界面服务是。要创建用户界面，请改用

幸运的是，这里有一个教程“”

对于Google Apps脚本的用户，有两种可视化数据的方法：

继续使用Charts+UiApp。虽然已弃用且编辑器中不支持自动完成，但UiApp仍然可以工作。目前还没有宣布它将被关闭

按照谷歌的建议，使用HtmlService。已拒绝使用HtmlService支持的图表。因此，这个看似简单的建议包含了一个额外的要求，即使用Google的另一个API，也称为Google可视化API，或GViz

希望这有帮助