Se usó la API de Cloud Translation para traducir esta página.

Class ScatterChartBuilder

Compilador para diagramas de dispersión. Para obtener más detalles, consulta la documentación de Google Charts.

Este es un ejemplo que muestra cómo crear un diagrama de dispersión. Los datos se importan desde una hoja de cálculo de Google.

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

var chartBuilder = Charts.newScatterChart()
    .setTitle('Adjusted GDP & U.S. Population')
    .setXAxisTitle('U.S. Population (millions)')
    .setYAxisTitle('Adjusted GDP ($ billions)')
    .setDimensions(600, 500)
    .setLegendPosition(Charts.Position.NONE)
    .setDataSourceUrl(dataSourceUrl);

var chart = chartBuilder.build();

Métodos

Método	Tipo de datos que se muestra	Descripción breve
`build()`	`Chart`	Compila el gráfico.
`setBackgroundColor(cssValue)`	`ScatterChartBuilder`	Establece el color de fondo para el gráfico.
`setColors(cssValues)`	`ScatterChartBuilder`	Establece los colores para las líneas en el gráfico.
`setDataSourceUrl(url)`	`ScatterChartBuilder`	Establece la URL de la fuente de datos que se usa para extraer datos de una fuente externa, como Hojas de cálculo de Google.
`setDataTable(tableBuilder)`	`ScatterChartBuilder`	Configura la tabla de datos que se usará para el gráfico con DataTableBuilder.
`setDataTable(table)`	`ScatterChartBuilder`	Establece la tabla de datos que contiene las líneas del gráfico y las etiquetas del eje X.
`setDataViewDefinition(dataViewDefinition)`	`ScatterChartBuilder`	Establece la definición de la vista de datos para usar en el gráfico.
`setDimensions(width, height)`	`ScatterChartBuilder`	Establece las dimensiones del gráfico.
`setLegendPosition(position)`	`ScatterChartBuilder`	Establece la posición de la leyenda con respecto al gráfico.
`setLegendTextStyle(textStyle)`	`ScatterChartBuilder`	Establece el estilo de texto de la leyenda del gráfico.
`setOption(option, value)`	`ScatterChartBuilder`	Establece opciones avanzadas para este gráfico.
`setPointStyle(style)`	`ScatterChartBuilder`	Establece el estilo de los puntos en la línea.
`setTitle(chartTitle)`	`ScatterChartBuilder`	Establece el título del gráfico.
`setTitleTextStyle(textStyle)`	`ScatterChartBuilder`	Establece el estilo del texto del título del gráfico.
`setXAxisLogScale()`	`ScatterChartBuilder`	Convierte el eje horizontal en una escala logarítmica (requiere que todos los valores sean positivos).
`setXAxisRange(start, end)`	`ScatterChartBuilder`	Establece el rango del eje horizontal del gráfico.
`setXAxisTextStyle(textStyle)`	`ScatterChartBuilder`	Establece el estilo del texto del eje horizontal.
`setXAxisTitle(title)`	`ScatterChartBuilder`	Agrega un título al eje horizontal.
`setXAxisTitleTextStyle(textStyle)`	`ScatterChartBuilder`	Establece el estilo del texto del título del eje horizontal.
`setYAxisLogScale()`	`ScatterChartBuilder`	Convierte el eje vertical en una escala logarítmica (requiere que todos los valores sean positivos).
`setYAxisRange(start, end)`	`ScatterChartBuilder`	Establece el rango del eje vertical del gráfico.
`setYAxisTextStyle(textStyle)`	`ScatterChartBuilder`	Establece el estilo del texto del eje vertical.
`setYAxisTitle(title)`	`ScatterChartBuilder`	Agrega un título al eje vertical.
`setYAxisTitleTextStyle(textStyle)`	`ScatterChartBuilder`	Establece el estilo del texto del título del eje vertical.

Documentación detallada

`build()`

Compila el gráfico.

Volver

Chart: Es un objeto de gráfico que se puede incorporar en documentos, elementos de la IU o usar como imagen estática.

`setBackgroundColor(cssValue)`

Establece el color de fondo para el gráfico.

// Creates a line chart builder and sets the background color to gray
var builder = Charts.newLineChart();
builder.setBackgroundColor("gray");

Parámetros

Nombre	Tipo	Descripción
`cssValue`	`String`	El valor de CSS del color (como `"blue"` o `"#00f"`)

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setColors(cssValues)`

Establece los colores para las líneas en el gráfico.

// Creates a line chart builder and sets the first two lines to be drawn in green and red,
// respectively.
var builder = Charts.newLineChart();
builder.setColors(["green", "red"]);

Parámetros

Nombre	Tipo	Descripción
`cssValues`	`String[]`	Un arreglo de valores CSS de color, como `["red", "#acf"]`. El enésimo elemento del arreglo representa el color de la enésima línea del gráfico.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setDataSourceUrl(url)`

Establece la URL de la fuente de datos que se usa para extraer datos de una fuente externa, como Hojas de cálculo de Google. Si se proporcionan una URL de fuente de datos y una tabla de datos, se ignora la URL de fuente de datos.

Para obtener más información sobre cómo consultar fuentes de datos, revisa la documentación de Google Charts.

Parámetros

Nombre	Tipo	Descripción
`url`	`String`	La URL de la fuente de datos, incluidos los parámetros de búsqueda.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setDataTable(tableBuilder)`

Configura la tabla de datos que se usará para el gráfico con DataTableBuilder. Este es un método conveniente para configurar la tabla de datos sin necesidad de llamar a build().

Parámetros

Nombre	Tipo	Descripción
`tableBuilder`	`DataTableBuilder`	Un compilador de tablas de datos Como parte de esta llamada, se crea una tabla de datos nueva de forma instantánea, por lo que las actualizaciones posteriores al compilador no se reflejarán en el gráfico.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setDataTable(table)`

Establece la tabla de datos que contiene las líneas del gráfico y las etiquetas del eje X. La primera columna debe ser una string y contener las etiquetas del eje horizontal. Cualquier cantidad de columnas puede seguir, todas deben ser numéricas. Cada columna se muestra como una línea separada.

Parámetros

Nombre	Tipo	Descripción
`table`	`DataTableSource`	La tabla de datos que se usará para el gráfico.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setDataViewDefinition(dataViewDefinition)`

Establece la definición de la vista de datos para usar en el gráfico.

Parámetros

Nombre	Tipo	Descripción
`dataViewDefinition`	`DataViewDefinition`	Un objeto de definición de vista de datos que define la vista que debe derivar de la fuente de datos determinada para el dibujo del gráfico.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setDimensions(width, height)`

Establece las dimensiones del gráfico.

Parámetros

Nombre	Tipo	Descripción
`width`	`Integer`	Es el ancho del gráfico en píxeles.
`height`	`Integer`	La altura del gráfico en píxeles.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setLegendPosition(position)`

Establece la posición de la leyenda con respecto al gráfico. De forma predeterminada, no hay leyenda.

// Creates a line chart builder and sets the legend position to right.
var builder = Charts.newLineChart();
builder.setLegendPosition(Charts.Position.RIGHT);

Parámetros

Nombre	Tipo	Descripción
`position`	`Position`	La posición de la leyenda

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setLegendTextStyle(textStyle)`

Establece el estilo de texto de la leyenda del gráfico.

// Creates a line chart builder and sets it up for a  blue, 26-point legend.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var builder = Charts.newLineChart();
builder.setLegendTextStyle(style);

Parámetros

Nombre	Tipo	Descripción
`textStyle`	`TextStyle`	El estilo de texto que se usará para la leyenda del gráfico.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setOption(option, value)`

Establece opciones avanzadas para este gráfico. Consulta las opciones disponibles para este gráfico. Este método no tiene efecto si la opción especificada no es válida.

// Build a scatter chart with a 1-second animation duration.
var builder = Charts.newScatterChart();
builder.setOption('animation.duration', 1000);
var chart = builder.build();

Parámetros

Nombre	Tipo	Descripción
`option`	`String`	La opción de establecer.
`value`	`Object`	Valor que se va a establecer

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setPointStyle(style)`

Establece el estilo de los puntos en la línea. De forma predeterminada, los puntos no tienen estilos particulares y solo la línea es visible.

// Creates a line chart builder and sets large point style.
var builder = Charts.newLineChart();
builder.setPointStyle(Charts.PointStyle.LARGE);

Parámetros

Nombre	Tipo	Descripción
`style`	`PointStyle`	El estilo que se usará para los puntos en la línea.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

Consulta también

PointStyle

`setTitle(chartTitle)`

Establece el título del gráfico. El título se muestra en el centro del gráfico.

// Creates a line chart builder and title to 'My Line Chart'.
var builder = Charts.newLineChart();
builder.setTitle('My Line Chart')

Parámetros

Nombre	Tipo	Descripción
`chartTitle`	`String`	el título del gráfico.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setTitleTextStyle(textStyle)`

Establece el estilo del texto del título del gráfico.

// Creates a line chart builder and sets it up for a  blue, 26-point title.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var builder = Charts.newLineChart();
builder.setTitleTextStyle(style);

Parámetros

Nombre	Tipo	Descripción
`textStyle`	`TextStyle`	El estilo de texto que se usará para el título del gráfico. Puedes crear un objeto `TextStyleBuilder` llamando a `Charts.newTextStyle()`.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setXAxisLogScale()`

Convierte el eje horizontal en una escala logarítmica (requiere que todos los valores sean positivos).

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setXAxisRange(start, end)`

Establece el rango del eje horizontal del gráfico.

Si algún dato está fuera del rango, este se expande para incluir esos datos.

// Creates a scatter chart builder and sets the X-axis range to be 0 to 100.
var builder = Charts.newTableChart();
builder.setXAxisRange(0, 100);

Parámetros

Nombre	Tipo	Descripción
`start`	`Number`	El valor de la línea de cuadrícula más baja del eje horizontal.
`end`	`Number`	Valor de la línea de cuadrícula más alta del eje horizontal.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setXAxisTextStyle(textStyle)`

Establece el estilo del texto del eje horizontal.

// Creates a line chart builder and sets the X-axis text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setXAxisTextStyle(textStyle);

Parámetros

Nombre	Tipo	Descripción
`textStyle`	`TextStyle`	El estilo de texto que se usará para el título del eje horizontal. Puedes crear un objeto `TextStyleBuilder` llamando a `Charts.newTextStyle()`.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setXAxisTitle(title)`

Agrega un título al eje horizontal. El título está centrado y aparece debajo de las etiquetas de valor del eje.

// Creates a line chart builder and sets the X-axis title.
var builder = Charts.newLineChart();
builder.setTitle('X-axis Title')

Parámetros

Nombre	Tipo	Descripción
`title`	`String`	El título del eje X.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setXAxisTitleTextStyle(textStyle)`

Establece el estilo del texto del título del eje horizontal.

// Creates a line chart builder and sets the X-axis title text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setXAxisTitleTextStyle(textStyle);

Parámetros

Nombre	Tipo	Descripción
`textStyle`	`TextStyle`	El estilo de texto que se usará para el título del eje horizontal. Puedes crear un objeto `TextStyleBuilder` llamando a `Charts.newTextStyle()`.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setYAxisLogScale()`

Convierte el eje vertical en una escala logarítmica (requiere que todos los valores sean positivos).

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setYAxisRange(start, end)`

Establece el rango del eje vertical del gráfico. Si hay datos fuera del rango, este se expande para incluir esos datos.

// Creates a scatter chart builder and sets the Y-axis range to be 0 to 100.
var builder = Charts.newTableChart();
builder.setYAxisRange(0, 100);

Parámetros

Nombre	Tipo	Descripción
`start`	`Number`	Valor de la línea de cuadrícula más baja del eje vertical.
`end`	`Number`	Valor de la línea de cuadrícula más alta del eje vertical.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setYAxisTextStyle(textStyle)`

Establece el estilo del texto del eje vertical.

// Creates a line chart builder and sets the Y-axis text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setYAxisTextStyle(textStyle);

Parámetros

Nombre	Tipo	Descripción
`textStyle`	`TextStyle`	El estilo de texto que se usará para el título del eje horizontal. Puedes crear un objeto `TextStyleBuilder` llamando a `Charts.newTextStyle()`.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setYAxisTitle(title)`

Agrega un título al eje vertical. El título está centrado y aparece a la izquierda de las etiquetas de valor.

// Creates a line chart builder and sets the Y-axis title.
var builder = Charts.newLineChart();
builder.setYAxisTitle('Y-axis Title')

Parámetros

Nombre	Tipo	Descripción
`title`	`String`	El título del eje Y.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.

`setYAxisTitleTextStyle(textStyle)`

Establece el estilo del texto del título del eje vertical.

// Creates a line chart builder and sets the Y-axis title text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setYAxisTitleTextStyle(textStyle);

Parámetros

Nombre	Tipo	Descripción
`textStyle`	`TextStyle`	El estilo de texto que se usará para el título del eje horizontal. Puedes crear un objeto `TextStyleBuilder` llamando a `Charts.newTextStyle()`.

Volver

ScatterChartBuilder: Este compilador, útil para encadenar.