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[]	데이터 뷰에 포함할 열 색인 또는 열 설명 (객체)의 배열입니다. 열 설명은 열 역할을 정의합니다. 데이터 테이블과 데이터 뷰 열의 열거형은 0부터 시작합니다.

리턴

DataViewDefinitionBuilder: 체이닝에 유용한 빌더입니다.