Class DataViewDefinitionBuilder

資料檢視定義建構工具

DataViewDefinition 物件的建構工具。

以下是使用建構工具的範例。資料是從 Google 試算表匯入。

function doGet() {
  // This example creates two table charts side by side. One uses a data view
  // definition to restrict the number of displayed columns.

  // Get sample data from a spreadsheet.
  const dataSourceUrl = 'https://docs.google.com/spreadsheet/tq?range=A1%3AF' +
      '&key=0Aq4s9w_HxMs7dHpfX05JdmVSb1FpT21sbXd4NVE3UEE&gid=4&headers=-1';

  // Create a chart to display all of the data.
  const originalChart = Charts.newTableChart()
                            .setDimensions(600, 500)
                            .setDataSourceUrl(dataSourceUrl)
                            .build();

  // Create another chart to display a subset of the data (only columns 1 and
  // 4).
  const dataViewDefinition = Charts.newDataViewDefinition().setColumns([0, 3]);
  const limitedChart = Charts.newTableChart()
                           .setDimensions(200, 500)
                           .setDataSourceUrl(dataSourceUrl)
                           .setDataViewDefinition(dataViewDefinition)
                           .build();

  const htmlOutput = HtmlService.createHtmlOutput();
  const originalChartData = Utilities.base64Encode(
      originalChart.getAs('image/png').getBytes(),
  );
  const originalChartUrl =
      `data:image/png;base64,${encodeURI(originalChartData)}`;
  const limitedChartData = Utilities.base64Encode(
      limitedChart.getAs('image/png').getBytes(),
  );
  const limitedChartUrl =
      `data:image/png;base64,${encodeURI(limitedChartData)}`;
  htmlOutput.append('<table><tr><td>');
  htmlOutput.append(`<img border="1" src="${originalChartUrl}">`);
  htmlOutput.append('</td><td>');
  htmlOutput.append(`<img border="1" src="${limitedChartUrl}">`);
  htmlOutput.append('</td></tr></table>');
  return htmlOutput;
}

方法

方法	傳回類型	簡短說明
build()	DataViewDefinition	使用此建構工具建構並傳回資料檢視定義物件。
setColumns(columns)	DataViewDefinitionBuilder	設定要納入資料檢視畫面的資料欄索引，以及指定角色欄位資訊。

內容詳盡的說明文件

build()

使用此建構工具建構並傳回資料檢視定義物件。

回攻員

DataViewDefinition：使用這個建構工具建構的資料檢視定義物件。

---

setColumns(columns)

設定要納入資料檢視的資料欄索引，以及指定角色欄位資訊。這個資料欄索引子集會參照資料檢視畫面衍生自的資料來源資料欄。

資料欄角色會說明該欄資料的用途：例如，資料欄可能會儲存說明工具提示文字、資料點註解或不確定指標的資料。詳情請參閱 Google 圖表說明文件中的「資料資料表角色」。

假設試算表的 A1 到 C3 儲存格中含有以下資料：

'abc', 20, 'blue';
'def', 30, 'red';
'ghi', 40, 'orange';

下列程式碼會建立長條圖，其中每個長條的顏色都不同。顏色是透過樣式「角色欄」指派。

const COLUMN_SPEC = [
  0,  // categories
  1,  // counts
  {sourceColumn: 2, role: 'style'},
];

function roleColumnChart() {
  const spreadsheet = SpreadsheetApp.getActiveSpreadsheet();
  const sheet = spreadsheet.getActiveSheet();
  const viewSpec =
      Charts.newDataViewDefinition().setColumns(COLUMN_SPEC).build();
  const chartBuilder = sheet.newChart()
                           .setChartType(Charts.ChartType.BAR)
                           .setDataViewDefinition(viewSpec)
                           .setOption('useFirstColumnAsDomain', true)
                           .setPosition(5, 1, 0, 0)
                           .setOption('hAxis', {title: 'Counts'})
                           .setOption('vAxis', {title: 'Categories'})
                           .addRange(sheet.getRange('A1:C3'));
  sheet.insertChart(chartBuilder.build());
}

參數

名稱	類型	說明
columns	Object[]	要納入資料檢視的資料欄索引或資料欄說明 (物件) 陣列。資料欄說明會定義資料欄角色。資料表和資料檢視欄的列舉值皆以零為起點。

回攻員

DataViewDefinitionBuilder：這個建構工具可用於鏈結。