Class DataViewDefinitionBuilder

Creador de definiciones de vistas de datos

Compilador para objetos DataViewDefinition.

Este es un ejemplo de cómo usar el compilador. Los datos se importan desde una hoja de cálculo de 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;
}

Métodos

MétodoTipo de datos que se muestraDescripción breve
build()DataViewDefinitionCompila y muestra el objeto de definición de vista de datos que se compiló con este compilador.
setColumns(columns)DataViewDefinitionBuilderEstablece los índices de las columnas que se incluirán en la vista de datos, así como la información de la columna de roles.

Documentación detallada

build()

Compila y muestra el objeto de definición de vista de datos que se compiló con este compilador.

Volver

DataViewDefinition: Es un objeto de definición de vista de datos que se compiló con este compilador.


setColumns(columns)

Establece los índices de las columnas que se incluirán en la vista de datos, así como la información de la columna de roles. Este subconjunto de índices de columna hace referencia a las columnas de la fuente de datos de la que se deriva la vista de datos.

El rol de una columna describe el propósito de los datos en esa columna: por ejemplo, una columna puede contener datos que describen el texto de la información sobre herramientas, las anotaciones de los datos o los indicadores de incertidumbre. Para obtener más detalles, consulta Roles de las tablas de datos en la documentación de Google Charts.

Supongamos que tenemos una hoja de cálculo con los siguientes datos en A1:C3:

'abc', 20, 'blue';
'def', 30, 'red';
'ghi', 40, 'orange';
Con el siguiente código, se crea un gráfico de barras en el que cada barra tiene un color diferente. Los colores se asignan a través de una "columna de roles" de estilo.
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());
}

Parámetros

NombreTipoDescripción
columnsObject[]Un array de índices de columna o descripciones de columna (un objeto) para incluir en la vista de datos. Las descripciones de las columnas definen el rol de una columna. La tabla de datos y la enumeración de las columnas de la vista de datos se basan en cero.

Volver

DataViewDefinitionBuilder: Este compilador es útil para encadenar.