Builder para gráficos de colunas. Para mais detalhes, consulte a documentação do Google Charts.
Este exemplo mostra como criar um gráfico de colunas com dados de uma tabela de dados.
const sampleData = Charts.newDataTable() .addColumn(Charts.ColumnType.STRING, 'Year') .addColumn(Charts.ColumnType.NUMBER, 'Sales') .addColumn(Charts.ColumnType.NUMBER, 'Expenses') .addRow(['2004', 1000, 400]) .addRow(['2005', 1170, 460]) .addRow(['2006', 660, 1120]) .addRow(['2007', 1030, 540]) .addRow(['2008', 800, 600]) .addRow(['2009', 943, 678]) .addRow(['2010', 1020, 550]) .addRow(['2011', 910, 700]) .addRow(['2012', 1230, 840]) .build(); const chart = Charts.newColumnChart() .setTitle('Sales & Expenses') .setXAxisTitle('Year') .setYAxisTitle('Amount (USD)') .setDimensions(600, 500) .setDataTable(sampleData) .build();
Métodos
| Método | Tipo de retorno | Breve descrição | 
|---|---|---|
| build() | Chart | Cria o gráfico. | 
| reverse | Column | Inverte o desenho das séries no eixo do domínio. | 
| set | Column | Define a cor de fundo do gráfico. | 
| set | Column | Define as cores das linhas no gráfico. | 
| set | Column | Define o URL da fonte de dados usado para extrair dados de uma fonte externa, como as Planilhas Google. | 
| set | Column | Define a tabela de dados a ser usada no gráfico usando um DataTableBuilder. | 
| set | Column | Define a tabela de dados que contém as linhas do gráfico, bem como os rótulos do eixo X. | 
| set | Column | Define a definição de visualização de dados a ser usada no gráfico. | 
| set | Column | Define as dimensões do gráfico. | 
| set | Column | Define a posição da legenda em relação ao gráfico. | 
| set | Column | Define o estilo de texto da legenda do gráfico. | 
| set | Column | Define opções avançadas para este gráfico. | 
| set | Column | Define o intervalo do gráfico. | 
| set | Column | Usa linhas empilhadas, ou seja, os valores de linhas e barras são empilhados (acumulados). | 
| set | Column | Define o título do gráfico. | 
| set | Column | Define o estilo de texto do título do gráfico. | 
| set | Column | Define o estilo de texto do eixo horizontal. | 
| set | Column | Adiciona um título ao eixo horizontal. | 
| set | Column | Define o estilo do texto do título do eixo horizontal. | 
| set | Column | Define o estilo de texto do eixo vertical. | 
| set | Column | Adiciona um título ao eixo vertical. | 
| set | Column | Define o estilo do texto do título do eixo vertical. | 
| use | Column | Transforma o eixo de intervalo em uma escala logarítmica (exige que todos os valores sejam positivos). | 
Documentação detalhada
build()
Cria o gráfico.
Retornar
Chart: um objeto de gráfico, que pode ser incorporado a documentos, elementos da interface ou usado como uma imagem
    estática.
reverse
Inverte o desenho das séries no eixo do domínio. Para gráficos de intervalo vertical (como gráficos de linhas, de área ou de colunas), isso significa que o eixo horizontal é desenhado da direita para a esquerda. Para gráficos de intervalo horizontal (como gráficos de barras), isso significa que o eixo vertical é desenhado de cima para baixo. Para gráficos de pizza, isso significa que as fatias são desenhadas no sentido anti-horário.
// Creates a pie chart builder and sets drawing of the slices in a // counter-clockwise manner. const builder = Charts.newPieChart(); builder.reverseCategories();
Retornar
Column: esse builder é útil para encadeamento.
set
Define a cor de fundo do gráfico.
// Creates a line chart builder and sets the background color to gray const builder = Charts.newLineChart(); builder.setBackgroundColor('gray');
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| css | String | O valor CSS da cor (como "blue"ou"#00f"). | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define as cores das linhas no gráfico.
// Creates a line chart builder and sets the first two lines to be drawn in // green and red, respectively. const builder = Charts.newLineChart(); builder.setColors(['green', 'red']);
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| css | String[] | Uma matriz de valores CSS de cor, como ["red", "#acf"]. O elemento n
    na matriz representa a cor da linha n no gráfico. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define o URL da fonte de dados usado para extrair dados de uma fonte externa, como as Planilhas Google. Se um URL da fonte de dados e uma DataTable forem fornecidos, o URL da fonte de dados será ignorado.
Para mais informações sobre como consultar fontes de dados, consulte a documentação do Google Charts.
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| url | String | O URL da fonte de dados, incluindo os parâmetros de consulta. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define a tabela de dados a ser usada no gráfico usando um DataTableBuilder. Esse é um método conveniente
para definir a tabela de dados sem precisar chamar build().
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| table | Data | Um criador de tabelas de dados. Uma nova tabela de dados é criada instantaneamente como parte dessa chamada, portanto, outras atualizações do builder não serão refletidas no gráfico. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define a tabela de dados que contém as linhas do gráfico, bem como os rótulos do eixo X. A primeira coluna precisa ser uma string e conter os rótulos do eixo horizontal. Qualquer número de colunas pode ser seguido, todas precisam ser numéricas. Cada coluna é mostrada como uma linha separada.
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| table | Data | A tabela de dados a ser usada no gráfico. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define a definição de visualização de dados a ser usada no gráfico.
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| data | Data | Um objeto de definição de visualização de dados que define a visualização que precisa ser derivada da fonte de dados especificada para o desenho do gráfico. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define as dimensões do gráfico.
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| width | Integer | A largura do gráfico, em pixels. | 
| height | Integer | A altura do gráfico, em pixels. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define a posição da legenda em relação ao gráfico. Por padrão, não há legenda.
// Creates a line chart builder and sets the legend position to right. const builder = Charts.newLineChart(); builder.setLegendPosition(Charts.Position.RIGHT);
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| position | Position | A posição da legenda. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define o estilo de texto da legenda do gráfico.
// Creates a line chart builder and sets it up for a blue, 26-point legend. const textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26); const style = textStyleBuilder.build(); const builder = Charts.newLineChart(); builder.setLegendTextStyle(style);
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| text | Text | O estilo de texto a ser usado na legenda do gráfico. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define opções avançadas para este gráfico. Consulte as opções disponíveis para este gráfico. Esse método não terá efeito se a opção for inválida.
// Build a column chart with a 1-second animation duration. const builder = Charts.newColumnChart(); builder.setOption('animation.duration', 1000); const chart = builder.build();
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| option | String | A opção a ser definida. | 
| value | Object | O valor que será definido. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define o intervalo do gráfico.
Se algum ponto de dados estiver fora do intervalo, ele será expandido para incluir esses pontos.
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| start | Number | O valor da linha de grade mais baixa do eixo de intervalo. | 
| end | Number | O valor da linha de grade mais alta do eixo de intervalo. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Usa linhas empilhadas, ou seja, os valores de linhas e barras são empilhados (acumulados). Por padrão, não há empilhamento.
Retornar
Column: esse builder é útil para encadeamento.
set
Define o título do gráfico. O título é exibido centralizado acima do gráfico.
// Creates a line chart builder and title to 'My Line Chart'. const builder = Charts.newLineChart(); builder.setTitle('My Line Chart');
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| chart | String | o título do gráfico. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define o estilo de texto do título do gráfico.
// Creates a line chart builder and sets it up for a blue, 26-point title. const textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26); const style = textStyleBuilder.build(); const builder = Charts.newLineChart(); builder.setTitleTextStyle(style);
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| text | Text | O estilo de texto a ser usado para o título do gráfico. É possível criar um objeto TextchamandoCharts.newTextStyle(). | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define o estilo de texto do eixo horizontal.
// Creates a line chart builder and sets the X-axis text style to blue, 18-point // font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setXAxisTextStyle(textStyle);
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| text | Text | O estilo de texto a ser usado para o título do eixo horizontal. É possível criar um objeto TextchamandoCharts.newTextStyle(). | 
Retornar
Column: esse builder é útil para encadeamento.
set
Adiciona um título ao eixo horizontal. O título é centralizado e aparece abaixo dos rótulos de valor do eixo.
// Creates a line chart builder and sets the X-axis title. const builder = Charts.newLineChart(); builder.setTitle('X-axis Title');
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| title | String | O título do eixo X. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define o estilo do texto do título do eixo horizontal.
// Creates a line chart builder and sets the X-axis title text style to blue, // 18-point font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setXAxisTitleTextStyle(textStyle);
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| text | Text | O estilo de texto a ser usado para o título do eixo horizontal. É possível criar um objeto TextchamandoCharts.newTextStyle(). | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define o estilo de texto do eixo vertical.
// Creates a line chart builder and sets the Y-axis text style to blue, 18-point // font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setYAxisTextStyle(textStyle);
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| text | Text | O estilo de texto a ser usado para o título do eixo horizontal. É possível criar um objeto TextchamandoCharts.newTextStyle(). | 
Retornar
Column: esse builder é útil para encadeamento.
set
Adiciona um título ao eixo vertical. O título é centralizado e aparece à esquerda dos rótulos de valor.
// Creates a line chart builder and sets the Y-axis title. const builder = Charts.newLineChart(); builder.setYAxisTitle('Y-axis Title');
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| title | String | O título do eixo Y. | 
Retornar
Column: esse builder é útil para encadeamento.
set
Define o estilo do texto do título do eixo vertical.
// Creates a line chart builder and sets the Y-axis title text style to blue, // 18-point font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setYAxisTitleTextStyle(textStyle);
Parâmetros
| Nome | Tipo | Descrição | 
|---|---|---|
| text | Text | O estilo de texto a ser usado para o título do eixo horizontal. É possível criar um objeto TextchamandoCharts.newTextStyle(). | 
Retornar
Column: esse builder é útil para encadeamento.
use
Transforma o eixo de intervalo em uma escala logarítmica (exige que todos os valores sejam positivos). O eixo de intervalo é o eixo vertical para gráficos verticais (como linha, área ou coluna) e o eixo horizontal para gráficos horizontais (como barra).
Retornar
Column: esse builder é útil para encadeamento.