Google apps script 我如何使用一个以上的数据源为我的谷歌图表与应用程序脚本仪表板?
我正在尝试用应用程序脚本构建一个谷歌图表仪表板。Google apps script 我如何使用一个以上的数据源为我的谷歌图表与应用程序脚本仪表板?,google-apps-script,google-visualization,Google Apps Script,Google Visualization,我正在尝试用应用程序脚本构建一个谷歌图表仪表板。 基本上,我在3个谷歌电子表格中有3个数据源,并希望创建一个显示3个独立图表的dsahboard(每个图表都有自己的数据表) 我当前的脚本位于下面,我只引用了一个数据源: var ss=SpreadsheetApp.openById('0agqxvgx4fxy6dgroez3djy0m3diutnoqkv4ts00mee') 最后,我想使用一个源来创建tableChart,另一个源来创建ColumnChart和一个LineChart 如何做到这一点
基本上,我在3个谷歌电子表格中有3个数据源,并希望创建一个显示3个独立图表的dsahboard(每个图表都有自己的数据表) 我当前的脚本位于下面,我只引用了一个数据源: var ss=SpreadsheetApp.openById('0agqxvgx4fxy6dgroez3djy0m3diutnoqkv4ts00mee') 最后,我想使用一个源来创建tableChart,另一个源来创建ColumnChart和一个LineChart 如何做到这一点
function doGet() {
var ss = SpreadsheetApp.openById('0AgQXvGX4FXy6dGRrOEZ3djY0M3dIUTNoQkV4TS00MEE')
var data = ss.getDataRange();
var InstallDateFilter = Charts.newCategoryFilter()
.setFilterColumnIndex(0)
.setAllowMultiple(false)
.build();
var PlatformFilter = Charts.newCategoryFilter()
.setFilterColumnIndex(1)
.build();
var tableChart = Charts.newTableChart()
.setDimensions(600, 1000)
.enablePaging(30)
.setDataViewDefinition(Charts.newDataViewDefinition()
.setColumns([0,1,2,3,4]))
.build();
var ColumnChart = Charts.newColumnChart()
.setDimensions(600, 600)
.setColors(["green", "red"])
.setTitle('Installs')
.setXAxisTitle('Platform')
.setDataViewDefinition(Charts.newDataViewDefinition()
.setColumns([1,4]))
.setLegendPosition(Charts.Position.BOTTOM)
.build();
var LineChart = Charts.newLineChart()
.setDimensions(1000, 600)
.setTitle('ARPI')
.setXAxisTitle('InstallDate')
.setDataViewDefinition(Charts.newDataViewDefinition()
.setColumns([0,2]))
.setCurveStyle(Charts.CurveStyle.SMOOTH)
.setPointStyle(Charts.PointStyle.MEDIUM)
.setLegendPosition(Charts.Position.BOTTOM)
.build();
var dashboard = Charts.newDashboardPanel()
.setDataTable(data)
.bind ( [InstallDateFilter, PlatformFilter], [tableChart] )
.bind ( [InstallDateFilter, PlatformFilter], [ColumnChart] )
.bind ( [InstallDateFilter, PlatformFilter], [LineChart] )
.build();
var app = UiApp.createApplication();
var filterPanel = app.createVerticalPanel();
var chartPanel = app.createHorizontalPanel();
filterPanel.add(InstallDateFilter) .add(PlatformFilter).setSpacing(10);
chartPanel .add(tableChart) .add(ColumnChart) .add(LineChart) .setSpacing(10);
dashboard.add(app.createHorizontalPanel()
.add(filterPanel).add(chartPanel));
app.add(dashboard);
return app;
}
如果仪表板上的图表具有不同的基础数据,则没有意义。仪表板用于以不同的方式显示相同的数据。如果要为每个图表设置筛选器,或者不使用仪表板并填充每个图表数据,请创建3个仪表板。有很多这样做的示例。您可以使用不同的数据集创建不同的仪表板 下面是代码示例:
function doGet() {
var data1 = getFirstDataSet();
var genderFilter = Charts.newCategoryFilter().setFilterColumnLabel("Gender").build();
var tableChart = Charts.newTableChart().setDataViewDefinition(Charts.newDataViewDefinition().setColumns([0, 1, 2])).build();
var dashboard1 = Charts.newDashboardPanel().setDataTable(data1).bind(genderFilter, tableChart).build();
var data2 = getSecondDataSet();
var ageFilter = Charts.newNumberRangeFilter().setFilterColumnLabel("Age").build();
var pieChart = Charts.newPieChart().setDataViewDefinition(Charts.newDataViewDefinition().setColumns([0, 2])).build();
var dashboard2 = Charts.newDashboardPanel().setDataTable(data2).bind(ageFilter, pieChart).build();
var uiApp = UiApp.createApplication();
dashboard1.add(uiApp.createHorizontalPanel().setSpacing(70).add(genderFilter).add(tableChart));
dashboard2.add(uiApp.createHorizontalPanel().setSpacing(70).add(ageFilter).add(pieChart));
uiApp.add(dashboard1);
uiApp.add(dashboard2);
return uiApp;
}
function getFirstDataSet() {
var data = Charts.newDataTable()
.addColumn(Charts.ColumnType.STRING, "Name")
.addColumn(Charts.ColumnType.STRING, "Gender")
.addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
.addRow(["Michael", "Male", 5])
.addRow(["Elisa", "Female", 7])
.addRow(["Robert", "Male", 3])
.addRow(["John", "Male", 2])
.addRow(["Jessica", "Female", 6])
.addRow(["Aaron", "Male", 1])
.addRow(["Margareth", "Female", 8])
.addRow(["Miranda", "Female", 6])
.build();
return data;
}
function getSecondDataSet() {
var data = Charts.newDataTable()
.addColumn(Charts.ColumnType.STRING, "Name")
.addColumn(Charts.ColumnType.NUMBER, "Age")
.addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
.addRow(["Michael", 12, 5])
.addRow(["Elisa", 20, 7])
.addRow(["Robert", 7, 3])
.addRow(["John", 54, 2])
.addRow(["Jessica", 22, 6])
.addRow(["Aaron", 3, 1])
.addRow(["Margareth", 42, 8])
.addRow(["Miranda", 33, 6])
.build();
return data;
}
仪表板只能使用单个数据源。在使用可视化API的javascript实现时,可以绕过此限制,但在使用应用程序脚本实现时则不行。感谢您的提醒,您是否有指向使用可视化API的javascript实现的文档的链接?或者最好是一个基本的代码模板?;文档中有大量的示例。文档似乎只展示了如何绘制基本图表,而没有展示如何使用外部数据源,即谷歌电子表格。函数drawChart(){var data=google.visualization.arrayToDataTable(['Year','Sales','Expenses'],['2004',1000400],'2005',1170460],'2006',6601120],'2007',1030540]);请给我一个链接,指向一个适当的示例。我想我可以将所有3个数据集合并到一个数据集中。如果我在仪表板上创建3个图表,我需要在每个单独的图表上进行筛选。这方面的示例将非常好。感谢官方示例有仪表板示例