3

Google Chart Service を使用して、Google Apps Script で Web アプリ用のテーブルを作成しています。
今、私は2つの問題を抱えています:

  1. 行と列を追加すると、スクロールバーが表示されるまで列の幅が狭くなります。コード例を追加しました。スクロールバーが表示されないように、グラフの (最大) 表示サイズを変更/拡大できますか?

  2. 右揃えの文字列列が必要です。デフォルトは、文字列列の左揃えです。どうすればこれを変更できますか? また、テーブルのフォーマット (テキスト サイズ、色、太字など) を変更するオプションは他にもありますか?

    function doGet() {
    var app = UiApp.createApplication();
    
    var data = Charts.newDataTable()
    .addColumn(Charts.ColumnType.STRING, "Name")
    .addColumn(Charts.ColumnType.STRING, "Gender")
    .addColumn(Charts.ColumnType.NUMBER, "Age")
    .addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
    .addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
    .addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
    .addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
    .addRow(["Michael", "Male", 12, 5])
    .addRow(["Michael", "Male", 12, 5])
    .addRow(["Elisa", "Female", 20, 7])
    .addRow(["Robert", "Male", 7, 3])
    .addRow(["John", "Male", 54, 2])
    .addRow(["Jessica", "Female", 22, 6])
    .addRow(["Aaron", "Male", 3, 1])
    .addRow(["Margareth", "Female", 42, 8])
    .addRow(["Miranda", "Female", 33, 6])
    .addRow(["Miranda", "Female", 33, 6])
    .addRow(["Miranda", "Female", 33, 6])
    .addRow(["Miranda", "Female", 33, 6])
    .addRow(["Miranda", "Female", 33, 6])
    .addRow(["Miranda", "Female", 33, 6])
    .build();
    
    var tableChart = Charts.newTableChart().setDataTable(data)
    .build();
    
    app.add(tableChart);
    
    return app;
    }
    
4

1 に答える 1

4

p.1について。グラフの幅と高さを変更するには、2 つの方法があります。1 つ目は、クラスのsetDimensionsメソッドを使用することTableChartBuilderです。この方法の欠点は、ページの幅/高さのパーセンテージで幅/高さを設定できないことです。2 番目の方法は、同じクラスのsetOptionメソッドを使用することです。この方法にはデメリットがありません。次のコードはそれを示しています。

p.2について。残念ながら、現在、テーブル チャートの列を揃えることはできません。私の知る限り、テーブル チャートのフードの下にあるGWT テーブルの列を揃えることさえ不可能です。この不足について、 GAS issue trackerで機能リクエストを自由に作成できます。

function doGet() {
var app = UiApp.createApplication();

var data = Charts.newDataTable()
.addColumn(Charts.ColumnType.STRING, "Name")
.addColumn(Charts.ColumnType.STRING, "Gender")
.addColumn(Charts.ColumnType.NUMBER, "Age")
.addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
.addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
.addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
.addColumn(Charts.ColumnType.NUMBER, "Donuts eaten")
.addRow(["Michael", "Male", 12, 5])
.addRow(["Michael", "Male", 12, 5])
.addRow(["Elisa", "Female", 20, 7])
.addRow(["Robert", "Male", 7, 3])
.addRow(["John", "Male", 54, 2])
.addRow(["Jessica", "Female", 22, 6])
.addRow(["Aaron", "Male", 3, 1])
.addRow(["Margareth", "Female", 42, 8])
.addRow(["Miranda", "Female", 33, 6])
.addRow(["Miranda", "Female", 33, 6])
.addRow(["Miranda", "Female", 33, 6])
.addRow(["Miranda", "Female", 33, 6])
.addRow(["Miranda", "Female", 33, 6])
.addRow(["Miranda", "Female", 33, 6])
.build();

var tableChart = Charts.newTableChart().setDataTable(data);

//tableChart.setDimensions(1200, 100); // Uncomment this line if you wish to set dimentions in pixels.
tableChart.setOption('width', '100%');
tableChart.setOption('height', '100%');  


app.add(tableChart.build());

return app;
}
于 2012-09-24T18:25:38.377 に答える