Google Apps脚本webApp用户界面重绘用户界面

时间:2013-11-08 23:35:52

标签: google-apps-script

我有一个GAS,它会从Google电子表格中显示排行榜(Google Chart)。

我喜欢这样做,以便每次电子表格更新时,图表都会刷新并显示最新分数。

每次有新分数时,电子表格都会计算新分数并更新列表。 (此部分已使用GAS正常工作)

似乎没有用的是webApp不会重新加载/重绘图表。

logChange()函数由电子表格触发器onChange()调用,当电子表格发生更改并成功记录其进程的开始和结束时(成功调用redrawUI()函数),该函数会触发。

下面提供了webApp代码。每当电子表格发生变化时,任何人都可以帮助我让这个应用重绘图表吗?

function doGet(e) {
  var app = drawUI();
  return app;
}

function logChange(e) {
  Logger.log("Changed at: " + new Date());
  redrawUI();
  Logger.log("after redrawUI recall " + new Date());
  return app;
}

function redrawUI() {
  var app = drawUI();
  return app;
}

function drawChart() {
  var ss = SpreadsheetApp.openById('txS....w'); //Spreadsheet Key
  var hs = ss.getSheetByName('All Scores');
  var data = hs.getRange(1, 1, 11, 3);

  var barChart = Charts.newBarChart()
  .setDataViewDefinition(Charts.newDataViewDefinition().setColumns([1,2]))
  .setDataTable(data)
  .setOption('axisTitlesPosition', 'in')
  .setOption('hAxis.minorGridlines.count', 9)
  .setOption('theme', 'maximized')
  .setOption('colors', ['#45818e'])
  .setLegendPosition(Charts.Position.NONE)
  .setYAxisTextStyle(Charts.newTextStyle().setFontName('Courier New').setFontSize(48))
  .setDimensions(1000, 800)
  .build();

  return barChart;
}

function drawUI() {
  var barChart = drawChart();

  var app = UiApp.createApplication();
  var mainPanel = app.createHorizontalPanel();
  var hsLabel = app.createLabel("THE Geek Game 2013")
                   .setStyleAttribute("font-size", "5em")
                   .setStyleAttribute("font-weight", "bold")
                   .setStyleAttribute("line-height", "2em");
  var subLabel = app.createLabel("Leader Board")
                   .setStyleAttribute("font-size", "3em")
                   .setStyleAttribute("font-weight", "bold")
  var vPanel = app.createVerticalPanel().setId("vPanel");

  mainPanel.add(vPanel).setSize("100%", "100%")
    .setCellHorizontalAlignment(vPanel, (UiApp.HorizontalAlignment.CENTER));
  vPanel.add(hsLabel).add(subLabel);
  vPanel.add(barChart).setSize("500", "100%");
  vPanel.setCellHorizontalAlignment(hsLabel, (UiApp.HorizontalAlignment.CENTER));
  vPanel.setCellHorizontalAlignment(subLabel, (UiApp.HorizontalAlignment.CENTER));

  app.add(mainPanel);
  app.createServerHandler("redrawUI");  
  return app;
}

如果您想查看当前应用的显示方式,请看到以下链接: https://script.google.com/macros/s/AKfycbykZZYCXd9SCJL0pnoNrR7L5ekdFQb8CzRsut0vLunKwq4jg8o/exec

1 个答案:

答案 0 :(得分:0)

AFAIK除非使用"计时器*"否则无法在没有用户操作的情况下刷新webApp Ui。在webapp本身。

我建议的是让电子表格限制脚本中的onChange触发器设置一个“标记值”'在您的userProperties中,使用计时器*轮询该值并在发现更改时进行更新。您可以将刷新限制在一天中的某些小时,以避免配额限制。

* note:以此类计时器see this post using the checkBox作为处理程序触发器的示例。