Opciones de configuración del gráfico

Tipos de gráficos

Opciones de configuración del gráfico de anotaciones

Nombre
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
displayRangeSelector

Indica si se debe mostrar el área de selección del rango de zoom (el área en la parte inferior del gráfico). false significa que no.

El contorno del selector de zoom es una versión de escala logarítmica de la primera serie del gráfico, ajustada para adaptarse a la altura del selector de zoom.

Tipo: boolean
Predeterminado: true
displayZoomButtons

Indica si se deben mostrar los botones de zoom ("1d 5d 1m", etcétera), donde false significa no.

Tipo: boolean
Predeterminado: true
máx.

Es el valor máximo que se mostrará en el eje Y. Si el valor máximo de los datos supera este valor, se ignora esta configuración y el gráfico se ajusta para mostrar la siguiente marca de verificación principal por encima del valor máximo de los datos. Esto tiene prioridad sobre el máximo del eje Y determinado por scaleType.

Esto es similar a maxValue en los gráficos principales.

Tipo: number
Predeterminado: automático
min

Es el valor mínimo que se mostrará en el eje Y. Si el dato mínimo es inferior a este valor, se ignora este parámetro de configuración y el gráfico se ajusta para mostrar la siguiente marca de graduación principal debajo del dato mínimo. Esto tiene prioridad sobre el mínimo del eje Y determinado por scaleType.

Esto es similar a minValue en los gráficos principales.

Tipo: number
Predeterminado: automático

Opciones de configuración del gráfico de área

Nombre
areaOpacity

Es la opacidad predeterminada del área coloreada debajo de una serie de gráficos de áreas, en la que 0.0 es completamente transparente y 1.0 es completamente opaco. Para especificar la opacidad de una serie individual, establece el valor areaOpacity en la propiedad series.

Tipo: number, 0.0- 1.0
Predeterminado: 0.3
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje horizontal. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
hAxis.gridlines

Es un objeto con propiedades para configurar las líneas de cuadrícula en el eje horizontal. Ten en cuenta que las líneas de cuadrícula del eje horizontal se dibujan verticalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.gridlines.color

Es el color de las líneas de cuadrícula horizontales dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
hAxis.gridlines.count

Es la cantidad aproximada de líneas de cuadrícula horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
hAxis.logScale

Propiedad hAxis que hace que el eje horizontal sea una escala logarítmica (requiere que todos los valores sean positivos). Se establece en true para indicar que sí.

Esta opción solo es compatible con un eje continuous.

Tipo: boolean
Predeterminado: false
hAxis.maxValue

Mueve el valor máximo del eje horizontal al valor especificado, que estará hacia la derecha en la mayoría de los gráficos. Se ignora si se establece en un valor inferior al valor máximo de X de los datos. hAxis.viewWindow.max anula esta propiedad.

Tipo: number
Valor predeterminado: automático
hAxis.minorGridlines

Un objeto con miembros para configurar las líneas de cuadrícula secundarias en el eje horizontal, similar a la opción hAxis.gridlines.

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.minorGridlines.color

Es el color de las líneas de cuadrícula horizontales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
hAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias ahora depende por completo del intervalo entre las líneas de cuadrícula principales (consulta hAxis.gridlines.interval) y el espacio mínimo requerido (consulta hAxis.minorGridlines.minSpacing).

Tipo: number
Predeterminado: 1
hAxis.minValue

Mueve el valor mínimo del eje horizontal al valor especificado, que estará a la izquierda en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de X de los datos. hAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: automático
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
interpolateNulls

Indica si se debe adivinar el valor de los puntos faltantes. Si es true, adivinará el valor de los datos faltantes en función de los puntos vecinos. Si es false, dejará una pausa en la línea en el punto desconocido.

Los gráficos Area con la opción isStacked: true/'percent'/'relative'/'absolute' no son compatibles con esta función.

Tipo: boolean
Predeterminado: false
isStacked

Si se establece en true, apila los elementos de todas las series en cada valor de dominio. Nota: En los gráficos Columna, Área y SteppedArea, Google Charts invierte el orden de los elementos de la leyenda para que coincidan mejor con el apilamiento de los elementos de la serie (p.ej., la serie 0 será el elemento de leyenda más bajo). Esto no se aplica a los gráficos de barras.

La opción isStacked también admite el apilamiento del 100%, en el que las pilas de elementos en cada valor de dominio se vuelven a escalar para sumar un 100%.

Las opciones para isStacked son las siguientes:

  • false: Los elementos no se apilan. Esta es la opción predeterminada.
  • true: Apila elementos para todas las series en cada valor de dominio.
  • 'percent': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen un 100%, con el valor de cada elemento calculado como un porcentaje del 100%.
  • 'relative': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen 1, con el valor de cada elemento calculado como una fracción de 1.
  • 'absolute': Funciona de la misma manera que isStacked: true.

Para el apilamiento del 100%, el valor calculado de cada elemento aparecerá en la información sobre herramientas después de su valor real.

El eje objetivo tendrá de forma predeterminada valores de marcas basados en la escala relativa de 0 a 1 como fracciones de 1 para 'relative' y de 0 a 100% para 'percent' (Nota: Cuando se usa la opción 'percent', los valores del eje o las marcas se muestran como porcentajes, sin embargo, los valores reales son los valores de escala relativa de 0 a 1. Esto se debe a que las marcas del eje de porcentaje son el resultado de aplicar un formato de “#.##%” a los valores de escala relativa de 0 a 1. Cuando uses isStacked: 'percent', asegúrate de especificar las marcas o líneas de cuadrícula con los valores de escala relativos de 0 a 1. Puedes personalizar las líneas de cuadrícula, los valores de marcas y el formato con las opciones hAxis/vAxis adecuadas.

El apilamiento del 100% solo admite valores de datos del tipo number y debe tener un modelo de referencia de cero.

Tipo: boolean/string
Predeterminado: false
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga un series asociado. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
lineWidth

Es el ancho de la línea de datos en píxeles. Usa cero para ocultar todas las líneas y mostrar solo los puntos. Puedes anular los valores de series individuales con la propiedad series.

Tipo: number
Predeterminado: 2
pointShape

Es la forma de los elementos de datos individuales: 'circle', 'triangle', 'square', 'diamond', 'star' o 'polygon'. Consulta la documentación de puntos para ver ejemplos.

Tipo: string
Predeterminado: 'circle'
pointSize

Es el diámetro de los puntos que se muestran en píxeles. Usa cero para ocultar todos los puntos. Puedes anular los valores de series individuales con la propiedad series.

Tipo: number
Predeterminado: 0
reverseCategories

Si se establece en true, dibuja series de derecha a izquierda. La opción predeterminada es dibujar de izquierda a derecha.

Esta opción solo es compatible con un eje discrete major.

Tipo: boolean
Predeterminado: false
serie

Es un array de objetos, cada uno de los cuales describe el formato de la serie correspondiente en el gráfico. Para usar valores predeterminados para una serie, especifica un objeto {} vacío. Si no se especifica una serie o un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • annotations: Es un objeto que se aplicará a las anotaciones de esta serie. Esto se puede usar para controlar, por ejemplo, el textStyle de la serie:

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    Consulta las diferentes opciones de annotations para obtener una lista más completa de lo que se puede personalizar.

  • areaOpacity: Anula el areaOpacity global de esta serie.
  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • labelInLegend: Es la descripción de la serie que aparecerá en la leyenda del gráfico.
  • lineDashStyle: Anula el valor global de lineDashStyle para esta serie.
  • lineWidth: Anula el valor global de lineWidth para esta serie.
  • pointShape: Anula el valor global de pointShape para esta serie.
  • pointSize: Anula el valor global de pointSize para esta serie.
  • pointsVisible: Anula el valor global de pointsVisible para esta serie.
  • targetAxisIndex: Es el eje al que se asignará esta serie, en el que 0 es el eje predeterminado y 1 es el eje opuesto. El valor predeterminado es 0. Establece 1 para definir un gráfico en el que se rendericen diferentes series en diferentes ejes. Se debe asignar al menos una serie al eje predeterminado. Puedes definir una escala diferente para diferentes ejes.
  • visibleInLegend: Es un valor boolean, en el que true significa que la serie debe tener una entrada de leyenda y false significa que no debe tenerla. La cantidad predeterminada es true.

Puedes especificar un array de objetos, cada uno de los cuales se aplica a la serie en el orden indicado, o puedes especificar un objeto en el que cada elemento secundario tenga una clave numérica que indique a qué serie se aplica. Por ejemplo, las siguientes dos declaraciones son idénticas y declaran la primera serie como negra y ausente de la leyenda, y la cuarta como roja y ausente de la leyenda:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
Tipo: Array de objetos o objeto con objetos anidados
Predeterminado: {}
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

Si se establece en true, el gráfico tratará la columna como una columna de texto.

Tipo: boolean
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxes

Especifica propiedades para ejes verticales individuales, si el gráfico tiene varios ejes verticales. Cada objeto secundario es un objeto vAxis y puede contener todas las propiedades que admite vAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes verticales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con vAxes. En el siguiente ejemplo, se asigna la serie 2 al eje derecho y se especifica un título y un estilo de texto personalizados para ella:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto vAxis que se muestra arriba:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Predeterminado: auto

Opciones de configuración del gráfico de barras

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo:string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: número o string
Predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
hAxes

Especifica propiedades para ejes horizontales individuales, si el gráfico tiene varios ejes horizontales. Cada objeto secundario es un objeto hAxis y puede contener todas las propiedades que admite hAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes horizontales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con hAxes. En el siguiente ejemplo, se asigna la serie 1 al eje inferior y se especifica un título y un estilo de texto personalizados para ella:

series:{1:{targetAxisIndex:1}}, hAxes:{1:{title:'Losses', textStyle:{color: 'red'}}}

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto hAxis que se muestra arriba:

hAxes: {
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {
      color: 'red'
    }
  } // Axis 1
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje horizontal. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
hAxis.gridlines

Es un objeto con propiedades para configurar las líneas de cuadrícula en el eje horizontal. Ten en cuenta que las líneas de cuadrícula del eje horizontal se dibujan verticalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.gridlines.color

Es el color de las líneas de cuadrícula horizontales dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
hAxis.gridlines.count

Es la cantidad aproximada de líneas de cuadrícula horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
hAxis.logScale

Propiedad hAxis que hace que el eje horizontal sea una escala logarítmica (requiere que todos los valores sean positivos). Se establece en true para indicar que sí.

Esta opción solo es compatible con un eje continuous.

Tipo: boolean
Predeterminado: false
hAxis.maxValue

Mueve el valor máximo del eje horizontal al valor especificado, que estará hacia la derecha en la mayoría de los gráficos. Se ignora si se establece en un valor inferior al valor máximo de X de los datos. hAxis.viewWindow.max anula esta propiedad.

Tipo: number
Valor predeterminado: automático
hAxis.minorGridlines

Un objeto con miembros para configurar las líneas de cuadrícula secundarias en el eje horizontal, similar a la opción hAxis.gridlines.

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.minorGridlines.color

Es el color de las líneas de cuadrícula horizontales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
hAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias ahora depende por completo del intervalo entre las líneas de cuadrícula principales (consulta hAxis.gridlines.interval) y el espacio mínimo requerido (consulta hAxis.minorGridlines.minSpacing).

Tipo: number
Predeterminado: 1
hAxis.minValue

Mueve el valor mínimo del eje horizontal al valor especificado, que estará a la izquierda en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de X de los datos. hAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: automático
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
isStacked

Si se establece en true, apila los elementos de todas las series en cada valor de dominio. Nota: En los gráficos Columna, Área y SteppedArea, Google Charts invierte el orden de los elementos de la leyenda para que coincidan mejor con el apilamiento de los elementos de la serie (p.ej., la serie 0 será el elemento de leyenda más bajo). Esto no se aplica a los gráficos de barras.

La opción isStacked también admite el apilamiento del 100%, en el que las pilas de elementos en cada valor de dominio se vuelven a escalar para sumar un 100%.

Las opciones para isStacked son las siguientes:

  • false: Los elementos no se apilan. Esta es la opción predeterminada.
  • true: Apila elementos para todas las series en cada valor de dominio.
  • 'percent': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen un 100%, con el valor de cada elemento calculado como un porcentaje del 100%.
  • 'relative': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen 1, con el valor de cada elemento calculado como una fracción de 1.
  • 'absolute': Funciona de la misma manera que isStacked: true.

Para el apilamiento del 100%, el valor calculado de cada elemento aparecerá en la información sobre herramientas después de su valor real.

El eje objetivo tendrá de forma predeterminada valores de marcas basados en la escala relativa de 0 a 1 como fracciones de 1 para 'relative' y de 0 a 100% para 'percent' (Nota: Cuando se usa la opción 'percent', los valores del eje o las marcas se muestran como porcentajes, sin embargo, los valores reales son los valores de escala relativa de 0 a 1. Esto se debe a que las marcas del eje de porcentaje son el resultado de aplicar un formato de “#.##%” a los valores de escala relativa de 0 a 1. Cuando uses isStacked: 'percent', asegúrate de especificar las marcas o líneas de cuadrícula con los valores de escala relativos de 0 a 1. Puedes personalizar las líneas de cuadrícula, los valores de marcas y el formato con las opciones hAxis/vAxis adecuadas.

El apilamiento del 100% solo admite valores de datos del tipo number y debe tener un modelo de referencia de cero.

Tipo: boolean/string
Predeterminado: false
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

Si se establece en true, dibuja series de derecha a izquierda. La opción predeterminada es dibujar de izquierda a derecha.

Esta opción solo es compatible con un eje major discrete.

Tipo: boolean
Predeterminado: false
serie

Es un array de objetos, cada uno de los cuales describe el formato de la serie correspondiente en el gráfico. Para usar valores predeterminados para una serie, especifica un objeto {} vacío. Si no se especifica una serie ni un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • annotations: Es un objeto que se aplicará a las anotaciones de esta serie. Esto se puede usar para controlar, por ejemplo, el textStyle de la serie:

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    Consulta las diferentes opciones de annotations para obtener una lista más completa de lo que se puede personalizar.

  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • labelInLegend: Es la descripción de la serie que aparecerá en la leyenda del gráfico.
  • targetAxisIndex: Es el eje al que se asignará esta serie, en el que 0 es el eje predeterminado y 1 es el eje opuesto. El valor predeterminado es 0. Establece 1 para definir un gráfico en el que se rendericen diferentes series en diferentes ejes. Se debe asignar al menos una serie al eje predeterminado. Puedes definir una escala diferente para diferentes ejes.
  • visibleInLegend: Es un valor boolean, en el que true significa que la serie debe tener una entrada de leyenda y false significa que no debe tenerla. La cantidad predeterminada es true.

Puedes especificar un array de objetos, cada uno de los cuales se aplica a la serie en el orden indicado, o puedes especificar un objeto en el que cada elemento secundario tenga una clave numérica que indique a qué serie se aplica. Por ejemplo, las siguientes dos declaraciones son idénticas y declaran la primera serie como negra y ausente de la leyenda, y la cuarta como roja y ausente de la leyenda:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
Tipo: Array de objetos o objeto con objetos anidados
Predeterminado: {}
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
líneas de tendencia

Muestra las líneas de tendencia en los gráficos que las admiten. De forma predeterminada, se usan líneas de tendencia linear, pero se pueden personalizar con la opción trendlines.n.type.

Las líneas de tendencia se especifican por serie, por lo que, la mayoría de las veces, tus opciones se verán así:

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      visibleInLegend: true
    }
  }
}
    
Tipo: object
Predeterminado: null
trendlines.n.color

Es el color de la línea de tendencia , expresado como un nombre de color en inglés o una cadena hexadecimal.

Tipo: string
Predeterminado: Es el color predeterminado de la serie.
trendlines.n.degree

Para las líneas de tendencia de type: 'polynomial', el grado del polinomio (2 para cuadrático, 3 para cúbico, etcétera).

Tipo: number
Predeterminado: 3
trendlines.n.labelInLegend

Si se establece, la línea de tendencia aparecerá en la leyenda como esta cadena.

Tipo: string
Predeterminado: null
trendlines.n.lineWidth

Es el ancho de la línea de la línea de tendencia, en píxeles.

Tipo: number
Predeterminado: 2
trendlines.n.type

Indica si las líneas de tendencia son 'linear' (predeterminado), 'exponential' o 'polynomial'.

Tipo: string
Predeterminado: linear
trendlines.n.visibleInLegend

Indica si la ecuación de la línea de tendencia aparece en la leyenda. Aparecerá en la información sobre la herramienta de la línea de tendencia.

Tipo: boolean
Predeterminado: false
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Predeterminado: auto

Opciones de configuración del diagrama de burbujas

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
cuadro de ayuda

Es un objeto con miembros para configurar las propiedades visuales de las burbujas.

Tipo: object
Predeterminado: null
bubble.opacity

Es la opacidad de las burbujas, en la que 0 es completamente transparente y 1 es completamente opaco.

Tipo: Número entre 0.0 y 1.0
Predeterminado: 0.8
bubble.stroke

Es el color del trazo de las burbujas.

Tipo: string
Predeterminado: '#ccc'
bubble.textStyle

Es un objeto que especifica el estilo de texto de la burbuja. El objeto tiene el siguiente formato:

{color: <string>, fontName: <string>, fontSize: <number>}

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
chartArea

Un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje horizontal. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
hAxis.gridlines

Es un objeto con propiedades para configurar las líneas de cuadrícula en el eje horizontal. Ten en cuenta que las líneas de cuadrícula del eje horizontal se dibujan verticalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.gridlines.color

Es el color de las líneas de cuadrícula horizontales dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
hAxis.gridlines.count

Es la cantidad aproximada de líneas de cuadrícula horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
hAxis.logScale

Propiedad hAxis que hace que el eje horizontal sea una escala logarítmica (requiere que todos los valores sean positivos). Se establece en true para indicar que sí.

Esta opción solo es compatible con un eje continuous.

Tipo: boolean
Predeterminado: false
hAxis.maxValue

Mueve el valor máximo del eje horizontal al valor especificado, que estará hacia la derecha en la mayoría de los gráficos. Se ignora si se establece en un valor inferior al valor máximo de X de los datos. hAxis.viewWindow.max anula esta propiedad.

Tipo: number
Valor predeterminado: automático
hAxis.minorGridlines

Un objeto con miembros para configurar las líneas de cuadrícula secundarias en el eje horizontal, similar a la opción hAxis.gridlines.

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.minorGridlines.color

Es el color de las líneas de cuadrícula horizontales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
hAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias ahora depende por completo del intervalo entre las líneas de cuadrícula principales (consulta hAxis.gridlines.interval) y el espacio mínimo requerido (consulta hAxis.minorGridlines.minSpacing).

Tipo: number
Predeterminado: 1
hAxis.minValue

Mueve el valor mínimo del eje horizontal al valor especificado, que estará a la izquierda en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de X de los datos. hAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: automático
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
serie

Un objeto de objetos, en el que las claves son nombres de series (los valores de la columna Color) y cada objeto describe el formato de la serie correspondiente en el gráfico. Si no se especifica una serie ni un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • visibleInLegend: Es un valor boolean, en el que true significa que la serie debe tener una entrada de leyenda y false significa que no debe tenerla. La cantidad predeterminada es true.
Ejemplo:
series: {'Europe': {color: 'green'}}
Tipo: Objeto con objetos anidados
Predeterminado: {}
sizeAxis

Es un objeto con miembros para configurar cómo se asocian los valores con el tamaño de la burbuja. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

 {minValue: 0,  maxSize: 20}
Tipo: object
Predeterminado: null
sizeAxis.maxSize

Es el radio máximo de la burbuja más grande posible, en píxeles.

Tipo: number
Predeterminado: 30
sizeAxis.minSize

Es el radio mínimo de la burbuja más pequeña posible, en píxeles.

Tipo: number
Predeterminado: 5
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

Si se establece en true, el gráfico tratará la columna como una columna de texto.

Tipo: boolean
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxes

Especifica propiedades para ejes verticales individuales, si el gráfico tiene varios ejes verticales. Cada objeto secundario es un objeto vAxis y puede contener todas las propiedades que admite vAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes verticales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con vAxes. En el siguiente ejemplo, se asigna la serie 2 al eje derecho y se especifica un título y un estilo de texto personalizados para ella:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto vAxis que se muestra arriba:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Predeterminado: auto

Opciones de configuración del calendario

Nombre
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
ancho

Es el ancho del gráfico en píxeles.

Tipo: number
Predeterminado: Ancho del elemento contenedor

Opciones de configuración del gráfico de velas

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje horizontal. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
hAxis.gridlines

Es un objeto con propiedades para configurar las líneas de cuadrícula en el eje horizontal. Ten en cuenta que las líneas de cuadrícula del eje horizontal se dibujan verticalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.gridlines.color

Es el color de las líneas de cuadrícula horizontales dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
hAxis.gridlines.count

Es la cantidad aproximada de líneas de cuadrícula horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
hAxis.logScale

Propiedad hAxis que hace que el eje horizontal sea una escala logarítmica (requiere que todos los valores sean positivos). Se establece en true para indicar que sí.

Esta opción solo es compatible con un eje continuous.

Tipo: boolean
Predeterminado: false
hAxis.maxValue

Mueve el valor máximo del eje horizontal al valor especificado, que estará hacia la derecha en la mayoría de los gráficos. Se ignora si se establece en un valor inferior al valor máximo de X de los datos. hAxis.viewWindow.max anula esta propiedad.

Tipo: number
Valor predeterminado: automático
hAxis.minorGridlines

Un objeto con miembros para configurar las líneas de cuadrícula secundarias en el eje horizontal, similar a la opción hAxis.gridlines.

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.minorGridlines.color

Es el color de las líneas de cuadrícula horizontales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
hAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias ahora depende por completo del intervalo entre las líneas de cuadrícula principales (consulta hAxis.gridlines.interval) y el espacio mínimo requerido (consulta hAxis.minorGridlines.minSpacing).

Tipo: number
Predeterminado: 1
hAxis.minValue

Mueve el valor mínimo del eje horizontal al valor especificado, que estará a la izquierda en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de X de los datos. hAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: automático
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

Si se establece en true, dibuja series de derecha a izquierda. La opción predeterminada es dibujar de izquierda a derecha.

Esta opción solo es compatible con un eje discrete major.

Tipo: boolean
Predeterminado: false
serie

Es un array de objetos, cada uno de los cuales describe el formato de la serie correspondiente en el gráfico. Para usar valores predeterminados para una serie, especifica un objeto {} vacío. Si no se especifica una serie o un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • fallingColor.fill: Anula el valor candlestick.fallingColor.fill global para esta serie.
  • fallingColor.stroke: Anula el valor candlestick.fallingColor.stroke global para esta serie.
  • fallingColor.strokeWidth: Anula el valor candlestick.fallingColor.strokeWidth global para esta serie.
  • labelInLegend: Es la descripción de la serie que aparecerá en la leyenda del gráfico.
  • risingColor.fill: Anula el valor candlestick.risingColor.fill global para esta serie.
  • risingColor.stroke: Anula el valor candlestick.risingColor.stroke global para esta serie.
  • risingColor.strokeWidth: Anula el valor candlestick.risingColor.strokeWidth global para esta serie.
  • targetAxisIndex: Es el eje al que se asignará esta serie, en el que 0 es el eje predeterminado y 1 es el eje opuesto. El valor predeterminado es 0. Establece 1 para definir un gráfico en el que se rendericen diferentes series en diferentes ejes. Se debe asignar al menos una serie al eje predeterminado. Puedes definir una escala diferente para diferentes ejes.
  • visibleInLegend: Es un valor boolean, en el que true significa que la serie debe tener una entrada de leyenda y false significa que no debe tenerla. La cantidad predeterminada es true.

Puedes especificar un array de objetos, cada uno de los cuales se aplica a la serie en el orden indicado, o puedes especificar un objeto en el que cada elemento secundario tenga una clave numérica que indique a qué serie se aplica. Por ejemplo, las siguientes dos declaraciones son idénticas y declaran la primera serie como negra y ausente de la leyenda, y la cuarta como roja y ausente de la leyenda:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
Tipo: Array de objetos o objeto con objetos anidados
Predeterminado: {}
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxes

Especifica propiedades para ejes verticales individuales, si el gráfico tiene varios ejes verticales. Cada objeto secundario es un objeto vAxis y puede contener todas las propiedades que admite vAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes verticales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con vAxes. En el siguiente ejemplo, se asigna la serie 2 al eje derecho y se especifica un título y un estilo de texto personalizados para ella:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto vAxis que se muestra arriba:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Predeterminado: auto

Opciones de configuración del gráfico de columnas

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje horizontal. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
hAxis.gridlines

Es un objeto con propiedades para configurar las líneas de cuadrícula en el eje horizontal. Ten en cuenta que las líneas de cuadrícula del eje horizontal se dibujan verticalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.gridlines.color

Es el color de las líneas de cuadrícula horizontales dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
hAxis.gridlines.count

Es la cantidad aproximada de líneas de cuadrícula horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
hAxis.logScale

Propiedad hAxis que hace que el eje horizontal sea una escala logarítmica (requiere que todos los valores sean positivos). Se establece en true para indicar que sí.

Esta opción solo es compatible con un eje continuous.

Tipo: boolean
Predeterminado: false
hAxis.maxValue

Mueve el valor máximo del eje horizontal al valor especificado, que estará hacia la derecha en la mayoría de los gráficos. Se ignora si se establece en un valor inferior al valor máximo de X de los datos. hAxis.viewWindow.max anula esta propiedad.

Tipo: number
Valor predeterminado: automático
hAxis.minorGridlines

Un objeto con miembros para configurar las líneas de cuadrícula secundarias en el eje horizontal, similar a la opción hAxis.gridlines.

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.minorGridlines.color

Es el color de las líneas de cuadrícula horizontales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
hAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias ahora depende por completo del intervalo entre las líneas de cuadrícula principales (consulta hAxis.gridlines.interval) y el espacio mínimo requerido (consulta hAxis.minorGridlines.minSpacing).

Tipo: number
Predeterminado: 1
hAxis.minValue

Mueve el valor mínimo del eje horizontal al valor especificado, que estará a la izquierda en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de X de los datos. hAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: automático
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
isStacked

Si se establece en true, apila los elementos de todas las series en cada valor de dominio. Nota: En los gráficos Columna, Área y SteppedArea, Google Charts invierte el orden de los elementos de la leyenda para que coincidan mejor con el apilamiento de los elementos de la serie (p.ej., la serie 0 será el elemento de leyenda más bajo). Esto no se aplica a los gráficos de barras.

La opción isStacked también admite el apilamiento del 100%, en el que las pilas de elementos en cada valor de dominio se vuelven a escalar para sumar un 100%.

Las opciones para isStacked son las siguientes:

  • false: Los elementos no se apilan. Esta es la opción predeterminada.
  • true: Apila elementos para todas las series en cada valor de dominio.
  • 'percent': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen un 100%, con el valor de cada elemento calculado como un porcentaje del 100%.
  • 'relative': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen 1, con el valor de cada elemento calculado como una fracción de 1.
  • 'absolute': Funciona de la misma manera que isStacked: true.

Para el apilamiento del 100%, el valor calculado de cada elemento aparecerá en la información sobre herramientas después de su valor real.

El eje objetivo tendrá de forma predeterminada valores de marcas basados en la escala relativa de 0 a 1 como fracciones de 1 para 'relative' y de 0 a 100% para 'percent' (Nota: Cuando se usa la opción 'percent', los valores del eje o las marcas se muestran como porcentajes, sin embargo, los valores reales son los valores de escala relativa de 0 a 1. Esto se debe a que las marcas del eje de porcentaje son el resultado de aplicar un formato de “#.##%” a los valores de escala relativa de 0 a 1. Cuando uses isStacked: 'percent', asegúrate de especificar las marcas o líneas de cuadrícula con los valores de escala relativos de 0 a 1. Puedes personalizar las líneas de cuadrícula, los valores de marcas y el formato con las opciones hAxis/vAxis adecuadas.

El apilamiento del 100% solo admite valores de datos del tipo number y debe tener un modelo de referencia de cero.

Tipo: boolean/string
Predeterminado: false
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

Si se establece en true, dibuja series de derecha a izquierda. La opción predeterminada es dibujar de izquierda a derecha.

Esta opción solo es compatible con un eje discrete major.

Tipo: boolean
Predeterminado: false
serie

Es un array de objetos, cada uno de los cuales describe el formato de la serie correspondiente en el gráfico. Para usar valores predeterminados para una serie, especifica un objeto {} vacío. Si no se especifica una serie o un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • annotations: Es un objeto que se aplicará a las anotaciones de esta serie. Esto se puede usar para controlar, por ejemplo, el textStyle de la serie:

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    Consulta las diferentes opciones de annotations para obtener una lista más completa de lo que se puede personalizar.

  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • labelInLegend: Es la descripción de la serie que aparecerá en la leyenda del gráfico.
  • targetAxisIndex: Es el eje al que se asignará esta serie, en el que 0 es el eje predeterminado y 1 es el eje opuesto. El valor predeterminado es 0. Establece 1 para definir un gráfico en el que se rendericen diferentes series en diferentes ejes. Se debe asignar al menos una serie al eje predeterminado. Puedes definir una escala diferente para diferentes ejes.

Puedes especificar un array de objetos, cada uno de los cuales se aplica a la serie en el orden indicado, o puedes especificar un objeto en el que cada elemento secundario tenga una clave numérica que indique a qué serie se aplica. Por ejemplo, las siguientes dos declaraciones son idénticas y declaran la primera serie como negra y ausente de la leyenda, y la cuarta como roja y ausente de la leyenda:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
Tipo: Array de objetos o objeto con objetos anidados
Predeterminado: {}
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
líneas de tendencia

Muestra las líneas de tendencia en los gráficos que las admiten. De forma predeterminada, se usan líneas de tendencia linear, pero se pueden personalizar con la opción trendlines.n.type.

Las líneas de tendencia se especifican por serie, por lo que, la mayoría de las veces, tus opciones se verán así:

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      visibleInLegend: true
    }
  }
}
    
Tipo: object
Predeterminado: null
trendlines.n.color

Es el color de la línea de tendencia , expresado como un nombre de color en inglés o una cadena hexadecimal.

Tipo: string
Predeterminado: Es el color predeterminado de la serie.
trendlines.n.degree

Para las líneas de tendencia de type: 'polynomial', el grado del polinomio (2 para cuadrático, 3 para cúbico, etcétera).

Tipo: number
Predeterminado: 3
trendlines.n.labelInLegend

Si se establece, la línea de tendencia aparecerá en la leyenda como esta cadena.

Tipo: string
Predeterminado: null
trendlines.n.lineWidth

Es el ancho de la línea de la línea de tendencia, en píxeles.

Tipo: number
Predeterminado: 2
trendlines.n.type

Indica si las líneas de tendencia son 'linear' (predeterminado), 'exponential' o 'polynomial'.

Tipo: string
Predeterminado: linear
trendlines.n.visibleInLegend

Indica si la ecuación de la línea de tendencia aparece en la leyenda. Aparecerá en la información sobre la herramienta de la línea de tendencia.

Tipo: boolean
Predeterminado: false
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxes

Especifica propiedades para ejes verticales individuales, si el gráfico tiene varios ejes verticales. Cada objeto secundario es un objeto vAxis y puede contener todas las propiedades que admite vAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes verticales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con vAxes. En el siguiente ejemplo, se asigna la serie 2 al eje derecho y se especifica un título y un estilo de texto personalizados para ella:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto vAxis que se muestra arriba:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto

Opciones de configuración del gráfico combinado

Nombre
areaOpacity

Es la opacidad predeterminada del área coloreada debajo de una serie de gráficos de áreas, en la que 0.0 es completamente transparente y 1.0 es completamente opaco. Para especificar la opacidad de una serie individual, establece el valor areaOpacity en la propiedad series.

Tipo: number, 0.0- 1.0
Predeterminado: 0.3
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
curveType

Controla la curva de las líneas cuando el ancho de línea no es cero. Puede ser una de las siguientes:

  • 'none': Líneas rectas sin curvas.
  • 'function': Se suavizarán los ángulos de la línea.
Tipo:string
Valor predeterminado: "none"
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje horizontal. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
hAxis.gridlines

Es un objeto con propiedades para configurar las líneas de cuadrícula en el eje horizontal. Ten en cuenta que las líneas de cuadrícula del eje horizontal se dibujan verticalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.gridlines.color

Es el color de las líneas de cuadrícula horizontales dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
hAxis.gridlines.count

Es la cantidad aproximada de líneas de cuadrícula horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
hAxis.logScale

Propiedad hAxis que hace que el eje horizontal sea una escala logarítmica (requiere que todos los valores sean positivos). Se establece en true para indicar que sí.

Esta opción solo es compatible con un eje continuous.

Tipo: boolean
Predeterminado: false
hAxis.maxValue

Mueve el valor máximo del eje horizontal al valor especificado, que estará hacia la derecha en la mayoría de los gráficos. Se ignora si se establece en un valor inferior al valor máximo de X de los datos. hAxis.viewWindow.max anula esta propiedad.

Tipo: number
Valor predeterminado: automático
hAxis.minorGridlines

Un objeto con miembros para configurar las líneas de cuadrícula secundarias en el eje horizontal, similar a la opción hAxis.gridlines.

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.minorGridlines.color

Es el color de las líneas de cuadrícula horizontales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
hAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias ahora depende por completo del intervalo entre las líneas de cuadrícula principales (consulta hAxis.gridlines.interval) y el espacio mínimo requerido (consulta hAxis.minorGridlines.minSpacing).

Tipo: number
Predeterminado: 1
hAxis.minValue

Mueve el valor mínimo del eje horizontal al valor especificado, que estará a la izquierda en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de X de los datos. hAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: automático
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
interpolateNulls

Indica si se debe adivinar el valor de los puntos faltantes. Si es true, adivinará el valor de los datos faltantes en función de los puntos vecinos. Si es false, dejará una pausa en la línea en el punto desconocido.

Los gráficos Area con la opción isStacked: true/'percent'/'relative'/'absolute' no son compatibles con esta función.

Tipo: boolean
Predeterminado: false
isStacked

Si se establece en true, apila los elementos de todas las series en cada valor de dominio. Nota: En los gráficos Columna, Área y SteppedArea, Google Charts invierte el orden de los elementos de la leyenda para que coincidan mejor con el apilamiento de los elementos de la serie (p.ej., la serie 0 será el elemento de leyenda más bajo). Esto no se aplica a los gráficos de barras.

La opción isStacked también admite el apilamiento del 100%, en el que las pilas de elementos en cada valor de dominio se vuelven a escalar para sumar un 100%.

Las opciones para isStacked son las siguientes:

  • false: Los elementos no se apilan. Esta es la opción predeterminada.
  • true: Apila elementos para todas las series en cada valor de dominio.
  • 'percent': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen un 100%, con el valor de cada elemento calculado como un porcentaje del 100%.
  • 'relative': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen 1, con el valor de cada elemento calculado como una fracción de 1.
  • 'absolute': Funciona de la misma manera que isStacked: true.

Para el apilamiento del 100%, el valor calculado de cada elemento aparecerá en la información sobre herramientas después de su valor real.

El eje objetivo tendrá de forma predeterminada valores de marcas basados en la escala relativa de 0 a 1 como fracciones de 1 para 'relative' y de 0 a 100% para 'percent' (Nota: Cuando se usa la opción 'percent', los valores del eje o las marcas se muestran como porcentajes, sin embargo, los valores reales son los valores de escala relativa de 0 a 1. Esto se debe a que las marcas del eje de porcentaje son el resultado de aplicar un formato de “#.##%” a los valores de escala relativa de 0 a 1. Cuando uses isStacked: 'percent', asegúrate de especificar las marcas o líneas de cuadrícula con los valores de escala relativos de 0 a 1. Puedes personalizar las líneas de cuadrícula, los valores de marcas y el formato con las opciones hAxis/vAxis adecuadas.

El apilamiento del 100% solo admite valores de datos del tipo number y debe tener un modelo de referencia de cero.

Tipo: boolean/string
Predeterminado: false
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
lineWidth

Es el ancho de la línea de datos en píxeles. Usa cero para ocultar todas las líneas y mostrar solo los puntos. Puedes anular los valores de series individuales con la propiedad series.

Tipo: number
Predeterminado: 2
pointShape

Es la forma de los elementos de datos individuales: 'circle', 'triangle', 'square', 'diamond', 'star' o 'polygon'. Consulta la documentación de puntos para ver ejemplos.

Tipo: string
Predeterminado: 'circle'
pointSize

Es el diámetro de los puntos que se muestran en píxeles. Usa cero para ocultar todos los puntos. Puedes anular los valores de series individuales con la propiedad series. Si usas una línea de tendencia, la opción pointSize afectará el ancho de la línea de tendencia, a menos que la anules con la opción trendlines.n.pointsize.

Tipo: number
Predeterminado: 0
reverseCategories

Si se establece en true, dibuja series de derecha a izquierda. La opción predeterminada es dibujar de izquierda a derecha.

Esta opción solo es compatible con un eje discrete major.

Tipo: boolean
Predeterminado: false
serie

Es un array de objetos, cada uno de los cuales describe el formato de la serie correspondiente en el gráfico. Para usar valores predeterminados para una serie, especifica un objeto {} vacío. Si no se especifica una serie o un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • annotations: Es un objeto que se aplicará a las anotaciones de esta serie. Esto se puede usar para controlar, por ejemplo, el textStyle de la serie:

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    Consulta las diferentes opciones de annotations para obtener una lista más completa de lo que se puede personalizar.

  • areaOpacity: Anula el areaOpacity global de esta serie.
  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • curveType: Anula el valor global de curveType para esta serie.
  • fallingColor.fill: Anula el valor candlestick.fallingColor.fill global para esta serie.
  • fallingColor.stroke: Anula el valor candlestick.fallingColor.stroke global para esta serie.
  • fallingColor.strokeWidth: Anula el valor candlestick.fallingColor.strokeWidth global para esta serie.
  • labelInLegend: Es la descripción de la serie que aparecerá en la leyenda del gráfico.
  • lineDashStyle: Anula el valor global de lineDashStyle para esta serie.
  • lineWidth: Anula el valor global de lineWidth para esta serie.
  • pointShape: Anula el valor global de pointShape para esta serie.
  • pointSize: Anula el valor global de pointSize para esta serie.
  • pointsVisible: Anula el valor global de pointsVisible para esta serie.
  • risingColor.fill: Anula el valor candlestick.risingColor.fill global para esta serie.
  • risingColor.stroke: Anula el valor candlestick.risingColor.stroke global para esta serie.
  • risingColor.strokeWidth: Anula el valor candlestick.risingColor.strokeWidth global para esta serie.
  • targetAxisIndex: Es el eje al que se asignará esta serie, en el que 0 es el eje predeterminado y 1 es el eje opuesto. El valor predeterminado es 0. Establece 1 para definir un gráfico en el que se rendericen diferentes series en diferentes ejes. Se debe asignar al menos una serie al eje predeterminado. Puedes definir una escala diferente para diferentes ejes.
  • type: Es el tipo de marcador de esta serie. Los valores válidos son "line", "area", "bars" y "steppedArea". Ten en cuenta que las barras son, en realidad, barras verticales (columnas). El valor predeterminado se especifica con la opción seriesType del gráfico.
  • visibleInLegend: Es un valor boolean, en el que true significa que la serie debe tener una entrada de leyenda y false significa que no debe tenerla. La cantidad predeterminada es true.

Puedes especificar un array de objetos, cada uno de los cuales se aplica a la serie en el orden indicado, o puedes especificar un objeto en el que cada elemento secundario tenga una clave numérica que indique a qué serie se aplica. Por ejemplo, las siguientes dos declaraciones son idénticas y declaran la primera serie como negra y ausente de la leyenda, y la cuarta como roja y ausente de la leyenda:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
Tipo: Array de objetos o objeto con objetos anidados
Predeterminado: {}
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxes

Especifica propiedades para ejes verticales individuales, si el gráfico tiene varios ejes verticales. Cada objeto secundario es un objeto vAxis y puede contener todas las propiedades que admite vAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes verticales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con vAxes. En el siguiente ejemplo, se asigna la serie 2 al eje derecho y se especifica un título y un estilo de texto personalizados para ella:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto vAxis que se muestra arriba:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto

Opciones de configuración del medidor

Nombre
greenColor

Es el color que se usará para la sección verde en la notación de colores HTML.

Tipo: string
Predeterminado: '#109618'
greenFrom

Es el valor más bajo de un rango marcado con un color verde.

Tipo: number
Valor predeterminado: Ninguno
greenTo

Es el valor más alto de un rango marcado con un color verde.

Tipo: number
Valor predeterminado: Ninguno
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminado: Ancho del contenedor
máx.

Es el valor máximo que se mostrará en el eje Y. Si el valor máximo de los datos supera este valor, se ignora esta configuración y el gráfico se ajusta para mostrar la siguiente marca de verificación principal por encima del valor máximo de los datos. Esto tiene prioridad sobre el máximo del eje Y determinado por scaleType.

Esto es similar a maxValue en los gráficos principales.

Tipo: number
Predeterminado: automático
min

Es el valor mínimo que se mostrará en el eje Y. Si el dato mínimo es inferior a este valor, se ignora este parámetro de configuración y el gráfico se ajusta para mostrar la siguiente marca de graduación principal debajo del dato mínimo. Esto tiene prioridad sobre el mínimo del eje Y determinado por scaleType.

Esto es similar a minValue en los gráficos principales.

Tipo: number
Predeterminado: automático
redColor

Es el color que se usará para la sección roja en la notación de colores HTML.

Tipo: string
Predeterminado: '#DC3912'
redFrom

Es el valor más bajo de un rango marcado con un color rojo.

Tipo: number
Valor predeterminado: Ninguno
redTo

Es el valor más alto de un rango marcado con un color rojo.

Tipo: number
Valor predeterminado: Ninguno
ancho

Es el ancho del gráfico en píxeles.

Tipo: number
Predeterminado: Ancho del contenedor
yellowColor

Es el color que se usará para la sección amarilla en la notación de colores HTML.

Tipo: string
Predeterminado: '#FF9900'
yellowFrom

Es el valor más bajo de un rango marcado con un color amarillo.

Tipo: number
Valor predeterminado: Ninguno
yellowTo

Es el valor más alto de un rango marcado con un color amarillo.

Tipo: number
Valor predeterminado: Ninguno

Opciones de configuración del gráfico geográfico

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
datalessRegionColor

Es el color que se asignará a las regiones sin datos asociados.

Tipo: string
Predeterminado: '#F5F5F5'
defaultColor

Es el color que se usará para los datos en un diagrama geográfico cuando la ubicación (p.ej., 'US' ) está presente, pero el valor es null o no se especifica. Esto es diferente de datalessRegionColor, que es el color que se usa cuando faltan datos.

Tipo: string
Predeterminado: '#267114'
displayMode

Indica qué tipo de geográfico es. El formato de DataTable debe coincidir con el valor especificado. Se admiten los siguientes valores:

  • 'auto': Elige según el formato de la DataTable.
  • 'regions': Colorea las regiones del mapa geográfico.
  • 'markers': Coloca marcadores en las regiones.
  • 'text': Etiqueta las regiones con texto de la tabla DataTable.
Tipo: string
Valor predeterminado: "auto"
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
región

Es el área que se mostrará en el diagrama geográfico. También se muestran las áreas circundantes. Puede ser una de las siguientes opciones:

  • 'world': Es un geodiagrama de todo el mundo.
  • Un continente o un subcontinente, especificado por su código de 3 dígitos, p.ej., '011' para África Occidental.
  • Es un país, especificado por su código ISO 3166-1 alpha-2, p.ej., 'AU' para Australia.
  • Un estado de Estados Unidos, especificado por su código ISO 3166-2:US, p.ej., 'US-AL' para Alabama. Ten en cuenta que la opción resolution debe establecerse en 'provinces' o 'metros'.
Tipo: string
Predeterminado: "world"
ancho

Es el ancho del gráfico en píxeles.

Tipo: number
Predeterminado: Ancho del elemento contenedor

Opciones de configuración del histograma

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object/div>
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.gridlines

Es un objeto con propiedades para configurar las líneas de cuadrícula en el eje horizontal. Ten en cuenta que las líneas de cuadrícula del eje horizontal se dibujan verticalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.gridlines.color

Es el color de las líneas de cuadrícula horizontales dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
hAxis.gridlines.count

Es la cantidad aproximada de líneas de cuadrícula horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
hAxis.minorGridlines

Un objeto con miembros para configurar las líneas de cuadrícula secundarias en el eje horizontal, similar a la opción hAxis.gridlines.

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.minorGridlines.color

Es el color de las líneas de cuadrícula horizontales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
hAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias ahora depende por completo del intervalo entre las líneas de cuadrícula principales (consulta hAxis.gridlines.interval) y el espacio mínimo requerido (consulta hAxis.minorGridlines.minSpacing).

Tipo: number
Predeterminado: 1
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
histogram.bucketSize

Configura de forma fija el tamaño de cada barra del histograma, en lugar de permitir que se determine de forma algorítmica.

Tipo: number
Predeterminado: auto
histogram.hideBucketItems

Omite las divisiones delgadas entre los bloques del histograma, lo que lo convierte en una serie de barras sólidas.

Tipo: boolean
Predeterminado: false
histogram.lastBucketPercentile

Cuando calcules el tamaño del bucket del histograma, ignora los porcentajes superior e inferior de lastBucketPercentile. Los valores aún se incluyen en el histograma, pero no afectan el agrupamiento.

Tipo: number
Predeterminado: 0
interpolateNulls

Indica si se debe adivinar el valor de los puntos faltantes. Si es true, adivinará el valor de los datos faltantes en función de los puntos vecinos. Si es false, dejará una pausa en la línea en el punto desconocido.

Los gráficos Area con la opción isStacked: true/'percent'/'relative'/'absolute' no son compatibles con esta función.

Tipo: boolean
Predeterminado: false
isStacked

Si se establece en true, apila los elementos de todas las series en cada valor de dominio. Nota: En los gráficos Columna, Área y SteppedArea, Google Charts invierte el orden de los elementos de la leyenda para que coincidan mejor con el apilamiento de los elementos de la serie (p.ej., la serie 0 será el elemento de leyenda más bajo). Esto no se aplica a los gráficos de barras.

La opción isStacked también admite el apilamiento del 100%, en el que las pilas de elementos en cada valor de dominio se vuelven a escalar para sumar un 100%.

Las opciones para isStacked son las siguientes:

  • false: Los elementos no se apilan. Esta es la opción predeterminada.
  • true: Apila elementos para todas las series en cada valor de dominio.
  • 'percent': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen un 100%, con el valor de cada elemento calculado como un porcentaje del 100%.
  • 'relative': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen 1, con el valor de cada elemento calculado como una fracción de 1.
  • 'absolute': Funciona de la misma manera que isStacked: true.

Para el apilamiento del 100%, el valor calculado de cada elemento aparecerá en la información sobre herramientas después de su valor real.

El eje objetivo tendrá de forma predeterminada valores de marcas basados en la escala relativa de 0 a 1 como fracciones de 1 para 'relative' y de 0 a 100% para 'percent' (Nota: Cuando se usa la opción 'percent', los valores del eje o las marcas se muestran como porcentajes, sin embargo, los valores reales son los valores de escala relativa de 0 a 1. Esto se debe a que las marcas del eje de porcentaje son el resultado de aplicar un formato de “#.##%” a los valores de escala relativa de 0 a 1. Cuando uses isStacked: 'percent', asegúrate de especificar las marcas o líneas de cuadrícula con los valores de escala relativos de 0 a 1. Puedes personalizar las líneas de cuadrícula, los valores de marcas y el formato con las opciones hAxis/vAxis adecuadas.

El apilamiento del 100% solo admite valores de datos del tipo number y debe tener un modelo de referencia de cero.

Tipo: boolean/string
Predeterminado: false
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

Si se establece en true, dibuja series de derecha a izquierda. La opción predeterminada es dibujar de izquierda a derecha.

Esta opción solo es compatible con un eje discrete major.

Tipo: boolean
Predeterminado: false
serie

Es un array de objetos, cada uno de los cuales describe el formato de la serie correspondiente en el gráfico. Para usar valores predeterminados para una serie, especifica un objeto {} vacío. Si no se especifica una serie o un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • labelInLegend: Es la descripción de la serie que aparecerá en la leyenda del gráfico.
  • targetAxisIndex: Es el eje al que se asignará esta serie, en el que 0 es el eje predeterminado y 1 es el eje opuesto. El valor predeterminado es 0. Establece 1 para definir un gráfico en el que se rendericen diferentes series en diferentes ejes. Se debe asignar al menos una serie al eje predeterminado. Puedes definir una escala diferente para diferentes ejes.
  • visibleInLegend: Es un valor boolean, en el que true significa que la serie debe tener una entrada de leyenda y false significa que no debe tenerla. La cantidad predeterminada es true.

Puedes especificar un array de objetos, cada uno de los cuales se aplica a la serie en el orden indicado, o bien puedes especificar un objeto en el que cada elemento secundario tenga una clave numérica que indique a qué serie se aplica. Por ejemplo, las siguientes dos declaraciones son idénticas y declaran la primera serie como negra y ausente de la leyenda, y la cuarta como roja y ausente de la leyenda:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
Tipo: Array de objetos o objeto con objetos anidados
Predeterminado: {}
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxes

Especifica propiedades para ejes verticales individuales, si el gráfico tiene varios ejes verticales. Cada objeto secundario es un objeto vAxis y puede contener todas las propiedades que admite vAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes verticales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con vAxes. En el siguiente ejemplo, se asigna la serie 2 al eje derecho y se especifica un título y un estilo de texto personalizados para ella:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto vAxis que se muestra arriba:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Predeterminado: auto
ancho

Es el ancho del gráfico en píxeles.

Tipo: number
Predeterminado: Ancho del elemento contenedor

Opciones de configuración del gráfico de líneas

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
curveType

Controla la curva de las líneas cuando el ancho de línea no es cero. Puede ser una de las siguientes:

  • 'none': Líneas rectas sin curvas.
  • 'function': Se suavizarán los ángulos de la línea.
Tipo: string
Valor predeterminado: "none"
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje horizontal. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
hAxis.gridlines

Es un objeto con propiedades para configurar las líneas de cuadrícula en el eje horizontal. Ten en cuenta que las líneas de cuadrícula del eje horizontal se dibujan verticalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.gridlines.color

Es el color de las líneas de cuadrícula horizontales dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
hAxis.gridlines.count

Es la cantidad aproximada de líneas de cuadrícula horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
hAxis.logScale

Propiedad hAxis que hace que el eje horizontal sea una escala logarítmica (requiere que todos los valores sean positivos). Se establece en true para indicar que sí.

Esta opción solo es compatible con un eje continuous.

Tipo: boolean
Predeterminado: false
hAxis.maxValue

Mueve el valor máximo del eje horizontal al valor especificado, que estará hacia la derecha en la mayoría de los gráficos. Se ignora si se establece en un valor inferior al valor máximo de X de los datos. hAxis.viewWindow.max anula esta propiedad.

Tipo: number
Valor predeterminado: automático
hAxis.minorGridlines

Un objeto con miembros para configurar las líneas de cuadrícula secundarias en el eje horizontal, similar a la opción hAxis.gridlines.

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.minorGridlines.color

Es el color de las líneas de cuadrícula horizontales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo:string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
hAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias ahora depende por completo del intervalo entre las líneas de cuadrícula principales (consulta hAxis.gridlines.interval) y el espacio mínimo requerido (consulta hAxis.minorGridlines.minSpacing).

Tipo: number
Predeterminado: 1
hAxis.minValue

Mueve el valor mínimo del eje horizontal al valor especificado, que estará a la izquierda en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de X de los datos. hAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: automático
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
interpolateNulls

Indica si se debe adivinar el valor de los puntos faltantes. Si es true, adivinará el valor de los datos faltantes en función de los puntos vecinos. Si es false, dejará una pausa en la línea en el punto desconocido.

Los gráficos Area con la opción isStacked: true/'percent'/'relative'/'absolute' no son compatibles con esta función.

Tipo: boolean
Predeterminado: false
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
lineWidth

Es el ancho de la línea de datos en píxeles. Usa cero para ocultar todas las líneas y mostrar solo los puntos. Puedes anular los valores de series individuales con la propiedad series.

Tipo: number
Predeterminado: 2
pointShape

Es la forma de los elementos de datos individuales: 'circle', 'triangle', 'square', 'diamond', 'star' o 'polygon'. Consulta la documentación de puntos para ver ejemplos.

Tipo: string
Predeterminado: 'circle'
pointSize

Es el diámetro de los puntos que se muestran en píxeles. Usa cero para ocultar todos los puntos. Puedes anular los valores de series individuales con la propiedad series. Si usas una línea de tendencia, la opción pointSize afectará el ancho de la línea de tendencia, a menos que la anules con la opción trendlines.n.pointsize.

Tipo: number
Predeterminado: 0
reverseCategories

Si se establece en true, dibuja series de derecha a izquierda. La opción predeterminada es dibujar de izquierda a derecha.

Esta opción solo es compatible con un eje discrete major.

Tipo: boolean
Predeterminado: false
serie

Es un array de objetos, cada uno de los cuales describe el formato de la serie correspondiente en el gráfico. Para usar valores predeterminados para una serie, especifica un objeto {} vacío. Si no se especifica una serie o un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • annotations: Es un objeto que se aplicará a las anotaciones de esta serie. Esto se puede usar para controlar, por ejemplo, el textStyle de la serie:

    series: {
      0: {
        annotations: {
          textStyle: {fontSize: 12, color: 'red' }
        }
      }
    }
              

    Consulta las diferentes opciones de annotations para obtener una lista más completa de lo que se puede personalizar.

  • type: Es el tipo de marcador de esta serie. Los valores válidos son "line", "area", "bars" y "steppedArea". Ten en cuenta que las barras son, en realidad, barras verticales (columnas). El valor predeterminado se especifica con la opción seriesType del gráfico.
  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • curveType: Anula el valor global de curveType para esta serie.
  • labelInLegend: Es la descripción de la serie que aparecerá en la leyenda del gráfico.
  • lineDashStyle: Anula el valor global de lineDashStyle para esta serie.
  • lineWidth: Anula el valor global de lineWidth para esta serie.
  • pointShape: Anula el valor global de pointShape para esta serie.
  • pointSize: Anula el valor global de pointSize para esta serie.
  • pointsVisible: Anula el valor global de pointsVisible para esta serie.
  • targetAxisIndex: Es el eje al que se asignará esta serie, en el que 0 es el eje predeterminado y 1 es el eje opuesto. El valor predeterminado es 0. Establece 1 para definir un gráfico en el que se rendericen diferentes series en diferentes ejes. Se debe asignar al menos una serie al eje predeterminado. Puedes definir una escala diferente para diferentes ejes.
  • visibleInLegend: Es un valor boolean, en el que true significa que la serie debe tener una entrada de leyenda y false significa que no debe tenerla. La cantidad predeterminada es true.

Puedes especificar un array de objetos, cada uno de los cuales se aplica a la serie en el orden indicado, o puedes especificar un objeto en el que cada elemento secundario tenga una clave numérica que indique a qué serie se aplica. Por ejemplo, las siguientes dos declaraciones son idénticas y declaran la primera serie como negra y ausente de la leyenda, y la cuarta como roja y ausente de la leyenda:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
Tipo: Array de objetos o objeto con objetos anidados
Predeterminado: {}
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

Si se establece en true, el gráfico tratará la columna como una columna de texto.

Tipo: boolean
líneas de tendencia

Muestra las líneas de tendencia en los gráficos que las admiten. De forma predeterminada, se usan líneas de tendencia linear, pero se pueden personalizar con la opción trendlines.n.type.

Las líneas de tendencia se especifican por serie, por lo que, la mayoría de las veces, tus opciones se verán así:

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      visibleInLegend: true
    }
  }
}
    
Tipo: object
Predeterminado: null
trendlines.n.color

Es el color de la línea de tendencia , expresado como un nombre de color en inglés o una cadena hexadecimal.

Tipo: string
Predeterminado: Es el color predeterminado de la serie.
trendlines.n.degree

Para las líneas de tendencia de type: 'polynomial', el grado del polinomio (2 para cuadrático, 3 para cúbico, etcétera).

Tipo: number
Predeterminado: 3
trendlines.n.labelInLegend

Si se establece, la línea de tendencia aparecerá en la leyenda como esta cadena.

Tipo: string
Predeterminado: null
trendlines.n.lineWidth

Es el ancho de la línea de la línea de tendencia , en píxeles.

Tipo: number
Predeterminado: 2
trendlines.n.type

Indica si las líneas de tendencia son 'linear' (predeterminado), 'exponential' o 'polynomial'.

Tipo: string
Predeterminado: linear
trendlines.n.visibleInLegend

Indica si la ecuación de la línea de tendencia aparece en la leyenda. Aparecerá en la información sobre la herramienta de la línea de tendencia.

Tipo: boolean
Predeterminado: false
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxes

Especifica propiedades para ejes verticales individuales, si el gráfico tiene varios ejes verticales. Cada objeto secundario es un objeto vAxis y puede contener todas las propiedades que admite vAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes verticales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con vAxes. En el siguiente ejemplo, se asigna la serie 2 al eje derecho y se especifica un título y un estilo de texto personalizados para ella:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto vAxis que se muestra arriba:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto

Opciones de configuración del organigrama

Nombre
color

Es el color de fondo de los elementos del organigrama.

Tipo: string
Predeterminado: '#edf7ff'
selectionColor

Es el color de fondo de los elementos del organigrama seleccionados.

Tipo: string
Predeterminado: '#d6e9f8'
tamaño

Es el tamaño general del gráfico. Las opciones incluyen 'small', 'medium' o 'large'.

Tipo: string
Predeterminado: 'medium'

Opciones de configuración del gráfico circular

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
is3D

Si es true, muestra un gráfico tridimensional.

Tipo: boolean
Predeterminado: false
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
pieHole

Si está entre 0 y 1, se muestra un gráfico de anillo. El orificio tiene un radio igual a number por el radio del gráfico.

Tipo: number
Predeterminado: 0
pieSliceBorderColor

Es el color de los bordes de la porción. Solo se aplica cuando el gráfico es bidimensional.

Tipo: string
Predeterminado: 'white'
pieSliceText

Es el contenido del texto que se muestra en la porción. Puede ser una de las siguientes:

  • 'percentage': Es el porcentaje del tamaño de la porción del total.
  • 'value': Es el valor cuantitativo del corte.
  • 'label': Es el nombre de la porción.
  • 'none': No se muestra texto.
Tipo: string
Predeterminado: 'percentage'
pieSliceTextStyle

Es un objeto que especifica el estilo de texto de la porción. El objeto tiene el siguiente formato:

{color: <string>, fontName: <string>, fontSize: <number>}

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

Si se establece en true, dibuja series de derecha a izquierda. La opción predeterminada es dibujar de izquierda a derecha.

Esta opción solo es compatible con un eje discrete major.

Tipo: boolean
Predeterminado: false
slices.color

Es el color que se usará para esta porción.

Tipo: string
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}

Opciones de configuración del gráfico de dispersión

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo:string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
curveType

Controla la curva de las líneas cuando el ancho de línea no es cero. Puede ser una de las siguientes:

  • 'none': Líneas rectas sin curvas.
  • 'function': Se suavizarán los ángulos de la línea.
Tipo:string
Valor predeterminado: "none"
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje horizontal. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
hAxis.gridlines

Es un objeto con propiedades para configurar las líneas de cuadrícula en el eje horizontal. Ten en cuenta que las líneas de cuadrícula del eje horizontal se dibujan verticalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.gridlines.color

Es el color de las líneas de cuadrícula horizontales dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
hAxis.gridlines.count

Es la cantidad aproximada de líneas de cuadrícula horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
hAxis.logScale

Propiedad hAxis que hace que el eje horizontal sea una escala logarítmica (requiere que todos los valores sean positivos). Se establece en true para indicar que sí.

Esta opción solo es compatible con un eje continuous.

Tipo: boolean
Predeterminado: false
hAxis.maxValue

Mueve el valor máximo del eje horizontal al valor especificado, que estará hacia la derecha en la mayoría de los gráficos. Se ignora si se establece en un valor inferior al valor máximo de X de los datos. hAxis.viewWindow.max anula esta propiedad.

Tipo: number
Valor predeterminado: automático
hAxis.minorGridlines

Un objeto con miembros para configurar las líneas de cuadrícula secundarias en el eje horizontal, similar a la opción hAxis.gridlines.

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
hAxis.minorGridlines.color

Es el color de las líneas de cuadrícula horizontales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
hAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias ahora depende por completo del intervalo entre las líneas de cuadrícula principales (consulta hAxis.gridlines.interval) y el espacio mínimo requerido (consulta hAxis.minorGridlines.minSpacing).

Tipo: number
Predeterminado: 1
hAxis.minValue

Mueve el valor mínimo del eje horizontal al valor especificado, que estará a la izquierda en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de X de los datos. hAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: automático
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
lineWidth

Es el ancho de la línea de datos en píxeles. Usa cero para ocultar todas las líneas y mostrar solo los puntos. Puedes anular los valores de series individuales con la propiedad series.

Tipo: number
Predeterminado: 2
pointShape

La forma de los elementos de datos individuales: 'circle', 'triangle', 'square', 'diamond', 'star' o 'polygon'. Consulta la documentación de puntos para ver ejemplos.

Tipo: string
Predeterminado: 'circle'
pointSize

Es el diámetro de los puntos que se muestran en píxeles. Usa cero para ocultar todos los puntos. Puedes anular los valores de series individuales con la propiedad series. Si usas una línea de tendencia, la opción pointSize afectará el ancho de la línea de tendencia, a menos que la anules con la opción trendlines.n.pointsize.

Tipo: number
Predeterminado: 0
serie

Es un array de objetos, cada uno de los cuales describe el formato de la serie correspondiente en el gráfico. Para usar valores predeterminados para una serie, especifica un objeto {} vacío. Si no se especifica una serie o un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • labelInLegend: Es la descripción de la serie que aparecerá en la leyenda del gráfico.
  • lineWidth: Anula el valor global de lineWidth para esta serie.
  • pointShape: Anula el valor global de pointShape para esta serie.
  • pointSize: Anula el valor global de pointSize para esta serie.
  • pointsVisible: Anula el valor global de pointsVisible para esta serie.
  • visibleInLegend: Es un valor boolean, en el que true significa que la serie debe tener una entrada de leyenda y false significa que no debe tenerla. La cantidad predeterminada es true.

Puedes especificar un array de objetos, cada uno de los cuales se aplica a la serie en el orden indicado,o bien puedes especificar un objeto en el que cada elemento secundario tenga una clave numérica que indique a qué serie se aplica. Por ejemplo, las siguientes dos declaraciones son idénticas y declaran la primera serie como negra y ausente de la leyenda, y la cuarta como roja y ausente de la leyenda:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
Tipo: Array de objetos o objeto con objetos anidados
Predeterminado: {}
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

Si se establece en true, el gráfico tratará la columna como una columna de texto.

Tipo: boolean
líneas de tendencia

Muestra las líneas de tendencia en los gráficos que las admiten. De forma predeterminada, se usan líneas de tendencia linear, pero se pueden personalizar con la opción trendlines.n.type.

Las líneas de tendencia se especifican por serie, por lo que, la mayoría de las veces, tus opciones se verán así:

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      visibleInLegend: true
    }
  }
}
    
Tipo: object
Predeterminado: null
trendlines.n.color

Es el color de la línea de tendencia , expresado como un nombre de color en inglés o una cadena hexadecimal.

Tipo: string
Predeterminado: Es el color predeterminado de la serie.
trendlines.n.degree

Para las líneas de tendencia de type: 'polynomial', el grado del polinomio (2 para cuadrático, 3 para cúbico, etcétera).

Tipo: number
Predeterminado: 3
trendlines.n.labelInLegend

Si se establece, la línea de tendencia aparecerá en la leyenda como esta cadena.

Tipo: string
Predeterminado: null
trendlines.n.lineWidth

Es el ancho de la línea de la línea de tendencia , en píxeles.

Tipo: number
Predeterminado: 2
trendlines.n.type

Indica si las líneas de tendencia son 'linear' (predeterminado), 'exponential' o 'polynomial'.

Tipo: string
Predeterminado: linear
trendlines.n.visibleInLegend

Indica si la ecuación de la línea de tendencia aparece en la leyenda. Aparecerá en la información sobre la herramienta de la línea de tendencia.

Tipo: boolean
Predeterminado: false
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxes

Especifica propiedades para ejes verticales individuales, si el gráfico tiene varios ejes verticales. Cada objeto secundario es un objeto vAxis y puede contener todas las propiedades que admite vAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes verticales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con vAxes. En el siguiente ejemplo, se asigna la serie 2 al eje derecho y se especifica un título y un estilo de texto personalizados para ella:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto vAxis que se muestra arriba:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Predeterminado: auto

Opciones de configuración del gráfico de áreas escalonado

Nombre
areaOpacity

Es la opacidad predeterminada del área coloreada debajo de una serie de gráficos de áreas, en la que 0.0 es completamente transparente y 1.0 es completamente opaco. Para especificar la opacidad de una serie individual, establece el valor areaOpacity en la propiedad series.

Tipo: number, 0.0- 1.0
Predeterminado: 0.3
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
backgroundColor.fill

Es el color de relleno del gráfico, como una cadena de color HTML.

Tipo: string
Predeterminado: 'white'
chartArea

Es un objeto con miembros para configurar la posición y el tamaño del área del gráfico (donde se dibuja el gráfico, sin incluir el eje ni las leyendas). Se admiten dos formatos: un número o un número seguido de %. Un número simple es un valor en píxeles; un número seguido de % es un porcentaje. Ejemplo: chartArea:{left:20,top:0,width:'50%',height:'75%'}

Tipo: object
Predeterminado: null
chartArea.backgroundColor
Es el color de fondo del área del gráfico. Cuando se usa una cadena, puede ser una cadena hexadecimal (p.ej., '#fdc') o un nombre de color en inglés. Cuando se usa un objeto, se pueden proporcionar las siguientes propiedades:
  • stroke: Es el color, que se proporciona como una cadena hexadecimal o un nombre de color en inglés.
  • strokeWidth: Si se proporciona, dibuja un borde alrededor del área del gráfico del ancho determinado (y con el color de stroke).
Tipo: string o object
Predeterminado: 'white'
chartArea.height

Es la altura del área del gráfico.

Tipo: number o string
Predeterminado: auto
chartArea.left

Es la distancia a la que se dibujará el gráfico desde el borde izquierdo.

Tipo: number o string
Valor predeterminado: auto
chartArea.top

La distancia a la que se dibujará el gráfico desde el borde superior.

Tipo: number o string
Predeterminado: auto
chartArea.width

Ancho del área del gráfico.

Tipo: number o string
Valor predeterminado: auto
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
hAxis

Es un objeto con miembros para configurar varios elementos del eje horizontal. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    
Tipo: object
Predeterminado: null
hAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje horizontal. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
hAxis.textPosition

Es la posición del texto del eje horizontal en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
hAxis.textStyle

Es un objeto que especifica el estilo de texto del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.title

Es una propiedad hAxis que especifica el título del eje horizontal.

Tipo: string
Predeterminado: null
hAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje horizontal. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.viewWindow

Especifica el rango de recorte del eje horizontal.

Tipo: object
Predeterminado: null
hAxis.viewWindow.max

Es el valor máximo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
hAxis.viewWindow.min

Es el valor mínimo de datos horizontales que se renderizará.

Se ignora cuando hAxis.viewWindowMode es 'pretty' o 'maximized'.

Tipo: number
Predeterminado: auto
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
isStacked

Si se establece en true, apila los elementos de todas las series en cada valor de dominio. Nota: En los gráficos Columna, Área y SteppedArea, Google Charts invierte el orden de los elementos de la leyenda para que coincidan mejor con el apilamiento de los elementos de la serie (p.ej., la serie 0 será el elemento de leyenda más bajo). Esto no se aplica a los gráficos de barras.

La opción isStacked también admite el apilamiento del 100%, en el que las pilas de elementos en cada valor de dominio se vuelven a escalar para sumar un 100%.

Las opciones para isStacked son las siguientes:

  • false: Los elementos no se apilan. Esta es la opción predeterminada.
  • true: Apila elementos para todas las series en cada valor de dominio.
  • 'percent': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen un 100%, con el valor de cada elemento calculado como un porcentaje del 100%.
  • 'relative': Apila elementos para todas las series en cada valor de dominio y los vuelve a escalar de modo que sumen 1, con el valor de cada elemento calculado como una fracción de 1.
  • 'absolute': Funciona de la misma manera que isStacked: true.

Para el apilamiento del 100%, el valor calculado de cada elemento aparecerá en la información sobre herramientas después de su valor real.

El eje objetivo tendrá de forma predeterminada valores de marcas basados en la escala relativa de 0 a 1 como fracciones de 1 para 'relative' y de 0 a 100% para 'percent' (Nota: Cuando se usa la opción 'percent', los valores del eje o las marcas se muestran como porcentajes, sin embargo, los valores reales son los valores de escala relativa de 0 a 1. Esto se debe a que las marcas del eje de porcentaje son el resultado de aplicar un formato de “#.##%” a los valores de escala relativa de 0 a 1. Cuando uses isStacked: 'percent', asegúrate de especificar las marcas o líneas de cuadrícula con los valores de escala relativos de 0 a 1. Puedes personalizar las líneas de cuadrícula, los valores de marcas y el formato con las opciones hAxis/vAxis adecuadas.

El apilamiento del 100% solo admite valores de datos del tipo number y debe tener un modelo de referencia de cero.

Tipo: boolean/ string
Predeterminado: false
leyenda

Es un objeto con miembros para configurar varios aspectos de la leyenda. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Tipo: object
Predeterminado: null
legend.position

Es la posición de la leyenda. Puede ser una de las siguientes:

  • 'bottom': Debajo del gráfico.
  • 'left': A la izquierda del gráfico, siempre que el eje izquierdo no tenga series asociadas. Por lo tanto, si quieres que la leyenda esté a la izquierda, usa la opción targetAxisIndex: 1.
  • 'in': Dentro del gráfico, en la esquina superior izquierda.
  • 'none': No se muestra ninguna leyenda.
  • 'right': A la derecha del gráfico. No es compatible con la opción vAxes.
  • 'top': Arriba del gráfico.
Tipo: string
Predeterminado: 'right'
legendTextStyle

Es un objeto que especifica el estilo de texto de la leyenda. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
reverseCategories

Si se establece en true, dibuja series de derecha a izquierda. La opción predeterminada es dibujar de izquierda a derecha.

Esta opción solo es compatible con un eje discrete major.

Tipo: boolean
Predeterminado: false
serie

Es un array de objetos, cada uno de los cuales describe el formato de la serie correspondiente en el gráfico. Para usar valores predeterminados para una serie, especifica un objeto {} vacío. Si no se especifica una serie o un valor, se usará el valor global. Cada objeto admite las siguientes propiedades:

  • areaOpacity: Anula el areaOpacity global de esta serie.
  • color: Es el color que se usará para esta serie. Especifica una cadena de color HTML válida.
  • type: Es el tipo de marcador de esta serie. Los valores válidos son "line", "area", "bars" y "steppedArea". Ten en cuenta que las barras son, en realidad, barras verticales (columnas). El valor predeterminado se especifica con la opción seriesType del gráfico.
  • labelInLegend: Es la descripción de la serie que aparecerá en la leyenda del gráfico.
  • lineDashStyle: Anula el valor global de lineDashStyle para esta serie.
  • targetAxisIndex: Es el eje al que se asignará esta serie, en el que 0 es el eje predeterminado y 1 es el eje opuesto. El valor predeterminado es 0. Establece 1 para definir un gráfico en el que se rendericen diferentes series en diferentes ejes. Se debe asignar al menos una serie al eje predeterminado. Puedes definir una escala diferente para cada eje.
  • visibleInLegend: Es un valor boolean, en el que true significa que la serie debe tener una entrada de leyenda y false significa que no debe tenerla. La cantidad predeterminada es true.

Puedes especificar un array de objetos, cada uno de los cuales se aplica a la serie en el orden indicado, o puedes especificar un objeto en el que cada elemento secundario tenga una clave numérica que indique a qué serie se aplica.Por ejemplo, las siguientes dos declaraciones son idénticas y declaran la primera serie como negra y ausente de la leyenda, y la cuarta como roja y ausente de la leyenda:

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
    
Tipo: Array de objetos o objeto con objetos anidados
Predeterminado: {}
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tema

Un tema es un conjunto de valores de opciones predefinidos que funcionan en conjunto para lograr un comportamiento o efecto visual específico del gráfico. Actualmente, solo hay un tema disponible:

  • 'maximized': Maximiza el área del gráfico y dibuja la leyenda y todas las etiquetas dentro del área del gráfico.
Tipo: string
Predeterminado: null
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
treatLabelsAsText

Si se establece en true, el gráfico tratará la columna como una columna de texto.

Tipo: boolean
useFirstColumnAsDomain

Si se establece en true, el gráfico tratará la columna como el dominio.

Tipo: boolean
vAxes

Especifica propiedades para ejes verticales individuales, si el gráfico tiene varios ejes verticales. Cada objeto secundario es un objeto vAxis y puede contener todas las propiedades que admite vAxis. Estos valores de propiedad anulan cualquier configuración global de la misma propiedad.

Para especificar un gráfico con varios ejes verticales, primero define un eje nuevo con series.targetAxisIndex y, luego, configúralo con vAxes. En el siguiente ejemplo, se asigna la serie 2 al eje derecho y se especifica un título y un estilo de texto personalizados para ella:

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}
    

Esta propiedad puede ser un objeto o un array: el objeto es una colección de objetos, cada uno con una etiqueta numérica que especifica el eje que define (este es el formato que se muestra anteriormente); el array es un array de objetos, uno por eje. Por ejemplo, la siguiente notación de estilo de array es idéntica al objeto vAxis que se muestra arriba:

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
    
Tipo: Array de objetos o objeto con objetos secundarios
Predeterminado: null
vAxis

Es un objeto con miembros para configurar varios elementos del eje vertical. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Tipo: object
Predeterminado: null
vAxis.direction

Es la dirección en la que crecen los valores a lo largo del eje vertical. De forma predeterminada, los valores bajos se encuentran en la parte inferior del gráfico. Especifica -1 para invertir el orden de los valores.

Tipo: 1 o -1
Predeterminado: 1
vAxis.gridlines

Es un objeto con miembros para configurar las líneas de cuadrícula en el eje vertical. Ten en cuenta que las líneas de cuadrícula del eje vertical se dibujan horizontalmente. Para especificar las propiedades de este objeto, puedes usar la notación literal de objetos, como se muestra a continuación:

{color: '#333', minSpacing: 20}

Esta opción solo es compatible con un eje continuous.

Tipo: object
Predeterminado: null
vAxis.gridlines.color

Es el color de las líneas verticales de la cuadrícula dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminado: '#CCC'
vAxis.gridlines.count

Es la cantidad aproximada de líneas horizontales dentro del área del gráfico. Si especificas un número positivo para gridlines.count, se usará para calcular el minSpacing entre las líneas de cuadrícula. Puedes especificar un valor de 1 para dibujar solo una línea de cuadrícula o 0 para no dibujar ninguna. Especifica -1, que es la opción predeterminada, para calcular automáticamente la cantidad de líneas de cuadrícula en función de otras opciones.

Tipo: number
Predeterminado: -1
vAxis.logScale

Si es true, convierte el eje vertical en una escala logarítmica. Nota: Todos los valores deben ser positivos.

Tipo: boolean
Predeterminado: false
vAxis.maxValue

Mueve el valor máximo del eje vertical al valor especificado, que será hacia arriba en la mayoría de los gráficos. Se ignora si se establece en un valor menor que el valor máximo de Y de los datos. vAxis.viewWindow.max anula esta propiedad.

Tipo: number
Predeterminado: automático
vAxis.minorGridlines

Es un objeto con miembros para configurar las líneas de cuadrícula menores en el eje vertical, similar a la opción vAxis.gridlines.

Tipo: object
Predeterminado: null
vAxis.minorGridlines.color

Es el color de las líneas de cuadrícula verticales menores dentro del área del gráfico. Especifica una cadena de color HTML válida.

Tipo: string
Predeterminada: Es una combinación de los colores de la línea de cuadrícula y del fondo.
vAxis.minorGridlines.count

La opción minorGridlines.count dejó de estar disponible en su mayoría, excepto para inhabilitar las líneas de cuadrícula menores configurando el recuento en 0. La cantidad de líneas de cuadrícula secundarias depende del intervalo entre las líneas de cuadrícula principales y el espacio mínimo requerido.

Tipo: number
Predeterminado: 1
vAxis.minValue

Mueve el valor mínimo del eje vertical al valor especificado, que será hacia abajo en la mayoría de los gráficos. Se ignora si se establece en un valor superior al valor mínimo de Y de los datos. vAxis.viewWindow.min anula esta propiedad.

Tipo: number
Predeterminado: null
vAxis.textPosition

Es la posición del texto del eje vertical en relación con el área del gráfico. Valores admitidos: 'out', 'in', 'none'.

Tipo: string
Predeterminado: 'out'
vAxis.textStyle

Es un objeto que especifica el estilo de texto del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.title

Especifica un título para el eje vertical.

Tipo: string
Valor predeterminado: Sin título
vAxis.titleTextStyle

Es un objeto que especifica el estilo de texto del título del eje vertical. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
vAxis.viewWindow

Especifica el rango de recorte del eje vertical.

Tipo: object
Predeterminado: null
vAxis.viewWindow.max

Es el valor máximo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Valor predeterminado: auto
vAxis.viewWindow.min

Es el valor mínimo de datos verticales que se renderizará.

Se ignora cuando vAxis.viewWindowMode es "pretty" o "maximized".

Tipo: number
Predeterminado: auto
ancho

Es el ancho del gráfico en píxeles.

Tipo: number
Predeterminado: Ancho del elemento contenedor

Opciones de configuración del gráfico de tabla

Nombre
alternatingRowStyle

Determina si se asignará un estilo de color alternativo a las filas impares y pares.

Tipo: boolean
Predeterminado: true
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
página

Si se debe habilitar la paginación en los datos y cómo hacerlo Elige uno de los siguientes valores de string:

  • 'enable': La tabla incluirá botones para avanzar y retroceder en la página. Si haces clic en estos botones, se realizará la operación de paginación y se cambiará la página que se muestra. También te recomendamos que configures la opción pageSize.
  • 'event': La tabla incluirá botones para avanzar y retroceder de página, pero hacer clic en ellos activará un evento 'page' y no cambiará la página que se muestra. Esta opción se debe usar cuando el código implementa su propia lógica de cambio de página. Consulta el ejemplo de TableQueryWrapper para ver cómo controlar los eventos de paginación de forma manual.
  • 'disable': [Predeterminado] No se admite el paginado.
  • Tipo: string
    Predeterminado: 'disable'
pageSize

Es la cantidad de filas de cada página cuando la paginación está habilitada con la opción de página.

Tipo: number
Predeterminado: 10
showRowNumber

Si se establece en true, muestra el número de fila como la primera columna de la tabla.

Tipo: boolean
Predeterminado: false
ordenar

Si se ordenan las columnas y cómo hacerlo cuando el usuario hace clic en el encabezado de una columna Si la ordenación está habilitada, considera configurar también las propiedades sortAscending y sortColumn. Elige uno de los siguientes valores de string:

  • 'enable': [Predeterminado] Los usuarios pueden hacer clic en los encabezados de las columnas para ordenarlos según la columna en la que se hizo clic. Cuando los usuarios hacen clic en el encabezado de la columna, las filas se ordenan automáticamente y se activa un evento 'sort'.
  • 'event': Cuando los usuarios hacen clic en el encabezado de la columna, se activa un evento 'sort', pero las filas no se ordenan automáticamente. Esta opción se debe usar cuando la página implementa su propio orden. Consulta el ejemplo de TableQueryWrapper para ver cómo controlar los eventos de ordenamiento de forma manual.
  • 'disable': Hacer clic en el encabezado de una columna no tiene efecto.
Tipo: string
Predeterminado: 'enable'
sortAscending

Es el orden en que se ordena la columna de clasificación inicial. True para ascendente, false para descendente. Se ignora si no se especifica sortColumn.

Tipo: boolean
Predeterminado: true
sortColumn

Es un índice de una columna en la tabla de datos, por el cual se ordena la tabla inicialmente. La columna está marcada con una pequeña flecha que indica el orden de clasificación.

Tipo: number
Predeterminado: -1
ancho

Es el ancho del gráfico en píxeles.

Tipo: number
Predeterminado: Ancho del elemento contenedor

Opciones de configuración de la Ruta

Nombre
Color de fondo

Es el color de fondo del área principal del gráfico. Puede ser una cadena de color HTML simple, por ejemplo, 'red' o '#00cc00', o un objeto con las siguientes propiedades.

Tipo: string o object
Predeterminado: 'white'
colores

Son los colores que se usarán para los elementos del gráfico. Es un array de cadenas, en el que cada elemento es una cadena de color HTML, por ejemplo: colors:['red','#004411'].

Tipo: Array de cadenas
Predeterminado: Colores predeterminados
alto

Es la altura del gráfico en píxeles.

Tipo: number
Predeterminada: Es la altura del elemento contenedor.
ancho

Es el ancho del gráfico en píxeles.

Tipo: number
Predeterminado: Ancho del elemento contenedor

Opciones de configuración del mapa de árbol

Nombre
headerColor

Es el color de la sección del encabezado de cada nodo. Especifica un valor de color HTML.

Tipo: string
Predeterminado: #988f86
maxColor

Es el color de un rectángulo con un valor de columna 3 de maxColorValue. Especifica un valor de color HTML.

Tipo: string
Predeterminado: #00dd00
maxDepth

Es la cantidad máxima de niveles de nodos que se mostrarán en la vista actual. Los niveles se aplanan en el plano actual. Si tu árbol tiene más niveles, debes subir o bajar para verlos. Además, puedes ver los niveles de maxPostDepth debajo de esto como rectángulos sombreados dentro de estos nodos.

Tipo: number
Predeterminado: 1
maxPostDepth

Indica cuántos niveles de nodos más allá de maxDepth se mostrarán de forma "sugerida". Los nodos sugeridos se muestran como rectángulos sombreados dentro de un nodo que se encuentra dentro del límite de maxDepth.

Tipo: number
Predeterminado: 0
midColor

Es el color de un rectángulo con un valor de columna 3 a mitad de camino entre maxColorValue y minColorValue. Especifica un valor de color HTML.

Tipo: string
Predeterminado: #000000
minColor

Es el color de un rectángulo con el valor de la columna 3 de minColorValue. Especifica un valor de color HTML.

Tipo: string
Predeterminado: #dd0000
noColor

Es el color que se debe usar para un rectángulo cuando un nodo no tiene un valor para la columna 3 y ese nodo es una hoja (o solo contiene hojas). Especifica un valor de color HTML.

Tipo: string
Predeterminado: #000000
subtítulo

Es el texto que se muestra debajo del título del gráfico.

Tipo: string
Valor predeterminado: Sin título
subtitleTextStyle

Es un objeto que especifica el estilo de texto del título.

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
textStyle

Es un objeto que especifica el estilo de texto del título. El color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Valor predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
título

Es el texto que se mostrará sobre el gráfico.

Tipo: string
Valor predeterminado: Sin título
titleTextStyle

Es un objeto que especifica el estilo de texto del título. El objeto tiene el siguiente formato:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color puede ser cualquier cadena de color HTML, por ejemplo: 'red' o '#00cc00'. Consulta también fontName y fontSize.

Tipo: object
Predeterminado: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}