Gráficos de Google-O-Meter

   Google-o-Meter con colores del arcoíris

En este documento, se describe cómo crear un gráfico de tipo de marcación denominado gráfico de medidor de Google.

Índice

Descripción general

Un Google-o-Meter es un indicador que apunta hacia un único valor en un rango. El rango tiene una gradación de color que puedes especificar si así lo deseas. También puedes especificar texto personalizado sobre el puntero. El rango de dial va del valor mínimo del formato de datos al valor máximo. Especifica un valor de datos en tu parámetro chd para que la flecha apunte.

Puedes especificar varias flechas en el mismo gráfico y diseñar el cuerpo de la flecha y el tamaño del punto de manera diferente en cada una. Si quieres que todas las flechas tengan el mismo estilo, especifica los datos como valores de la misma serie. Si deseas aplicar diferentes diseños a distintas flechas, agrupa todas las flechas con el mismo diseño en la misma serie.

Especifica un gráfico de Google-O-Meter con la siguiente sintaxis:

Sintaxis

cht=gom

 

Ejemplos

Descripción Ejemplo

De esta manera, se demuestra el uso de chxl para especificar etiquetas personalizadas tanto debajo como sobre el dial.

Línea única en un gráfico con sombreado en azul desde la parte inferior del gráfico hasta la línea
chxt=x,y
chxl=0:|Groovy|1:|slow|faster|crazy

Puedes especificar varias flechas con múltiples puntos de datos.
chd=t:20,40,60
chdl=1|2|3

Para aplicar un estilo a las flechas, usa el parámetro chls. Cada descripción de chls se aplica a todas las flechas de la serie de datos correspondiente.

chls tiene una sintaxis avanzada para Google-o-meters. Cada conjunto de valores dentro de un conjunto de canalizaciones describe la serie de datos correspondiente. De forma opcional, puedes agregar un conjunto de valores delimitados por barras verticales que describan el tamaño de la punta de flecha en puntos, de 0 a 15; el valor predeterminado es 15.

Examinemos el valor chls en este gráfico: chls=3|3,5,5|15|10

  • 3: Un solo valor especifica el grosor de la línea. Esto se aplica a todas las flechas de la primera serie.
  • 3,5,5: La segunda serie tiene descritos el grosor, la longitud del guion y la longitud de espacio.
  • 15: Es el tamaño de la punta de la flecha para las flechas de la primera serie.
  • 10: Es el tamaño de la punta de la flecha de la segunda serie.

 


chd=t:20,40|60
chls=3|3,5,5|15|10

 

Colores de la serie chco

De manera opcional, puedes especificar los colores del dial con el parámetro chco. Si no se especifica, se usa un gradiente predeterminado.

Sintaxis

chco=<color_1>,...,<color_n>
<color>
Especifica dos o más colores en formato hexadecimal RRRGGBB. Los colores se aplican en un gradiente de izquierda a derecha, con el primer color a la izquierda y el último a la derecha.
Descripción Ejemplo
En este gráfico, se muestra un gradiente simple, de blanco (FFFFFF) a negro (000000) Google-o-Meter con colores del arcoíris
chco=FFFFFF,000000
Este gráfico muestra varios colores asignados al dial. Google-o-Meter con colores del arcoíris
chco=FF0000,FF8040,FFFF00,
00FF00,00FFFF,
0000FF,800080

Volver al principio

Etiquetas de Google-o-Meter chl

De manera opcional, puedes especificar una etiqueta personalizada para que se muestre arriba de la flecha.

Nota sobre los valores de string: Solo se permiten caracteres seguros para URL en las strings de etiquetas. Para estar seguro, debes codificar en formato URL las strings que contengan caracteres que no se encuentren en el grupo de caracteres 0-9a-zA-Z. Puedes encontrar un codificador de URL aquí.

Sintaxis

chl=<label>
<etiqueta>
Texto de la etiqueta

 

Ejemplo

Descripción Ejemplo
Aquí tienes un ejemplo de un Google-o-Meter con una etiqueta.

Google-o-meter con color rojo a verde predeterminado
chl=Nearly+There

Volver al principio

Funciones estándares

El resto de las funciones de esta página son funciones estándar del gráfico.

Formato de color

Especifica colores con una string de 6 caracteres de valores hexadecimales, más dos valores de transparencia opcionales, en el formato RRGGBB[AA]. Por ejemplo:

  • FF0000 = Rojo
  • 00FF00 = Verde
  • 0000FF = Azul
  • 000000 = Negro
  • FFFFFF = Blanco

AA es un valor de transparencia opcional, en el que 00 es completamente transparente y FF es completamente opaco. Por ejemplo:

  • 0000FFFF = Luz azul continua
  • 0000FF66 = Azul transparente

Volver al principio

Título del gráfico chtt, chts [Todos los gráficos]

Puedes especificar el texto, el color y el tamaño de fuente del título para tu gráfico.

Sintaxis

chtt=<chart_title>
chts=<color>,<font_size>,<opt_alignment>

 

chtt: Especifica el título del gráfico.

<chart_title>
Título que se mostrará para el gráfico. No puedes especificar dónde aparece esta opción, pero sí puedes especificar el tamaño y el color de la fuente. Usa el signo + para indicar los espacios y un carácter de barra vertical ( |) para indicar los saltos de línea.

 

chts (opcional): Colores y tamaño de fuente del parámetro chtt.

<color>
Es el color del título, en formato hexadecimal RRRGGBB. El color predeterminado es el negro.
<font_size>
Es el tamaño de la fuente del título, en puntos.
<opt_alignment>
[Opcional] Alineación del título Elige uno de los siguientes valores de cadena que distinguen mayúsculas de minúsculas: "l" (izquierda), "c" (centrado) "r" (derecha). La configuración predeterminada es “c”.

 

Ejemplos

Descripción Ejemplo

Un gráfico con un título, con el color y el tamaño de fuente predeterminados.

Especifica un espacio con un signo más (+).

Usa un carácter de barra vertical (|) para forzar un salto de línea.

chts no se especifica aquí.

Gráfico de barras verticales con título
chtt=Site+visitors+by+month|
January+to+July

Un gráfico con un título azul de 20 puntos alineado a la derecha.

Gráfico de barras verticales con azul, 20 píxeles, título
chtt=Site+visitors
chts=FF0000,20,r

Volver al principio

Estilo y texto de la leyenda del gráfico chdl, chdlp, chdls [Todos los gráficos]

La leyenda es una sección lateral del gráfico que ofrece una pequeña descripción de texto de cada serie. Puedes especificar el texto asociado con cada serie de esta leyenda y especificar en qué lugar del gráfico debe aparecer.

Consulta también chma para aprender a establecer los márgenes en tu leyenda.

Nota sobre los valores de cadena: Solo se permiten caracteres seguros para URL en las cadenas de etiquetas. Para estar seguro, debes codificar en formato URL las strings que contengan caracteres que no se encuentren en el grupo de caracteres 0-9a-zA-Z. Puedes encontrar un codificador de URL en la documentación de visualización de Google.

Sintaxis

chdl=<data_series_1_label>|...|<data_series_n_label>
chdlp=<opt_position>|<opt_label_order>
chdls=<color>,<size>

 

chdl: Es el texto de cada serie que se mostrará en la leyenda.

<data_series_label>
Es el texto de las entradas de la leyenda. Cada etiqueta se aplica a la serie correspondiente en el array chd. Usa el signo + para agregar un espacio. Si no especificas este parámetro, el gráfico no tendrá una leyenda. No hay forma de especificar un salto de línea en una etiqueta. Por lo general, la leyenda se expandirá para conservar el texto de la leyenda, y el área del gráfico se reducirá para acomodar la leyenda.

chdlp : [Opcional] La posición de la leyenda y el orden de las entradas de la leyenda. Puedes especificar <position> o <label_order>. Si especificas ambas, sepáralas con un carácter de barra. Puedes agregar una “s” a cualquier valor si deseas que las entradas de leyenda vacías de chdl se omitan en la leyenda. Ejemplos: chdlp=bv, chdlp=r, chdlp=bv|r, chdlp=bvs|r

<opt_position>
[Opcional] Especifica la posición de la leyenda en el gráfico. Para especificar un padding adicional entre la leyenda y el área del gráfico o el borde de la imagen, usa el parámetro chma. Elige uno de los siguientes valores:
  • b: Leyenda en la parte inferior del gráfico, entradas de leyenda en una fila horizontal.
  • bv: Leyenda en la parte inferior del gráfico, entradas de leyenda en una columna vertical.
  • t: Leyenda en la parte superior del gráfico, entradas de leyenda en una fila horizontal.
  • tv: Leyenda en la parte superior del gráfico, entradas de leyenda en una columna vertical.
  • r: [Predeterminado] Leyenda a la derecha del gráfico; entradas de leyenda en una columna vertical.
  • l: Leyenda a la izquierda del gráfico, entradas de leyenda en una columna vertical.
<opt_label_order>
(opcional) Es el orden en el que se muestran las etiquetas en la leyenda. Elige uno de los siguientes valores:
  • l - [Predeterminado para leyendas verticales] Muestra las etiquetas en el orden asignado a chdl.
  • r: Muestra las etiquetas en el orden inverso, como se indica en chdl. Esto es útil en los gráficos de barras apiladas para mostrar la leyenda
    en el mismo orden en que aparecen las barras.
  • a: [Predeterminado para leyendas horizontales] Orden automático: Significa ordenar por longitud (el más corto primero), según la medición en bloques de 10 píxeles. Cuando dos elementos tienen la misma longitud (divididos en bloques de 10 píxeles), aparecerá primero el de la lista.
  • 0,1,2...: Orden de etiquetas personalizado. Esta es una lista de índices de etiquetas basados en cero de chdl, separados por comas.

chdls: [opcional] especifica el color y el tamaño de la fuente del texto de la leyenda.

<color>
El color del texto de la leyenda, en formato hexadecimal RRRGGBB.
<size>
El tamaño de punto del texto de la leyenda.

 

Ejemplos

Descripción Ejemplo

Dos ejemplos de leyendas. Especifica el texto de la leyenda en el mismo orden que tus series de datos.

Gráfico de líneas rojo, azul y verde con leyendas que coinciden

chdl=NASDAQ|FTSE100|DOW
chco=FF0000,00FF00,0000FF

Diagrama de Venn con dos círculos más pequeños delimitados por un círculo más grande


chdl=First|Second|Third
chco=ff0000,00ff00,0000ff

En el primer gráfico, se muestran las entradas de leyenda horizontales (chdlp=t, el diseño predeterminado es horizontal) y, en el segundo, las entradas de leyenda verticales inferiores (chdlp=bv).

Diagrama de Venn con dos círculos más pequeños delimitados por un círculo más grande
chdl=First|Second|Third
chco=ff0000,00ff00,0000ff
chdlp=t


Diagrama de Venn con dos círculos más pequeños delimitados por un círculo más grande
chdl=First|Second|Third
chco=ff0000,00ff00,0000ff
chdlp=bv

En este ejemplo, se muestra cómo cambiar el tamaño de fuente.

Diagrama de Venn con dos círculos más pequeños delimitados por un círculo más grande
chdls=0000CC,14

Volver al principio

Márgenes de gráficos chma [todos los gráficos]

Puedes especificar el tamaño en píxeles de los márgenes del gráfico. Los márgenes se calculan a partir del tamaño del gráfico especificado (chs). Aumentar el tamaño del margen no aumenta el tamaño total del gráfico, sino que reduce el área del gráfico, si es necesario.

De forma predeterminada, los márgenes son los que quedan después de calcular el tamaño del gráfico. Este valor predeterminado varía según el tipo de gráfico. Los márgenes que especificas son un valor mínimo. Si el área del gráfico deja lugar para los márgenes, el tamaño del margen será el que quede. No puedes apretar los márgenes más pequeños de lo necesario para cualquier leyenda o etiqueta. A continuación, se incluye un diagrama en el que se muestran las partes básicas de un gráfico:

Margen del gráfico, área de la leyenda y área del gráfico

Los márgenes del gráfico incluyen las etiquetas de ejes y el área de la leyenda. El área de la leyenda cambia su tamaño automáticamente para ajustarse al texto con exactitud, a menos que especifiques un ancho mayor con chma, en cuyo caso se expandirá el tamaño del margen y se reducirá el área del gráfico. No puedes recortar una leyenda mediante la especificación de un tamaño demasiado pequeño, pero puedes hacer que ocupe más espacio del necesario.

Sugerencia: En un gráfico de barras, si las barras tienen un tamaño fijo (el valor predeterminado), no se puede reducir el ancho del área del gráfico. Debes especificar un tamaño de barra más pequeño o que se pueda cambiar de tamaño con chbh.

 

Sintaxis

chma=
  <left_margin>,<right_margin>,<top_margin>,<bottom_margin>|<opt_legend_width>,<opt_legend_height>
<left_margin>, <right_margin>, <top_margin> y <bottom_margin>
Tamaño de margen mínimo alrededor del área del gráfico, en píxeles Aumenta este valor para incluir algo de padding y evitar que las etiquetas de los ejes profundicen en los bordes del gráfico.
<opt_legend_width>, <opt_legend_height>
[Opcional] Es el ancho del margen alrededor de la leyenda, en píxeles. Usa esta opción para evitar que la leyenda aparezca sobre el área del gráfico o los bordes de la imagen.

 

Ejemplos

Descripción Ejemplo

En este ejemplo, el gráfico tiene un margen mínimo de 30 píxeles por cada lado. Debido a que la leyenda del gráfico tiene más de 30 píxeles de ancho, el margen del lado derecho se establece en el ancho de la leyenda del gráfico y es diferente de los demás márgenes.

Las etiquetas de los ejes están fuera del área de trazado y, por lo tanto, se dibujan dentro del espacio del margen.

Gráfico de líneas con fondo gris y márgenes en cada lado.
chma=30,30,30,30

Para agregar un margen alrededor de la leyenda, establece un valor para los parámetros <opt_legend_width> y <opt_legend_height>.

En este ejemplo, la leyenda tiene aproximadamente 60 píxeles de ancho. Si estableces <opt_legend_width> en 80 píxeles, el margen se extiende a 20 píxeles fuera de la leyenda.

Gráfico de líneas con fondo gris y márgenes en cada lado.
chma=20,20,20,30|80,20

Volver al principio

Estilos y etiquetas de ejes [línea, barra, Google-o-meter, radar, dispersión]

Puedes especificar qué ejes mostrar en el gráfico y asignarles etiquetas y posiciones personalizadas, rangos y estilos.

No todos los gráficos muestran las líneas de los ejes de forma predeterminada. Puedes especificar exactamente qué ejes debe mostrar tu gráfico mediante el parámetro chxt. Las líneas del eje predeterminadas no muestran números. Debes especificar un eje en el parámetro chxt para que se muestren los números.

Puedes elegir que tus ejes muestren números que reflejen los valores de datos, o bien puedes especificar ejes personalizados. La configuración predeterminada muestra valores numéricos, con valores escalados en un rango de 0 a 100. Sin embargo, puedes cambiar ese rango usando chxr para mostrar cualquier rango y puedes aplicar diseño a los valores (por ejemplo, para mostrar símbolos de moneda o decimales) con chxs.

Si eliges usar valores personalizados, por ejemplo, "Lun, Mar, Mié", puedes usar el parámetro chxl. Para colocar estas etiquetas en ubicaciones específicas a lo largo del eje, usa el parámetro chxp.

Por último, puedes usar los parámetros chxs y chxtc para especificar el color, el tamaño, la alineación y otras propiedades de las etiquetas de eje personalizadas y numéricas.

Nota sobre los valores de cadena: Solo se permiten caracteres seguros para URL en las cadenas de etiquetas. Para estar seguro, debes codificar en formato URL las strings que contengan caracteres que no se encuentren en el grupo de caracteres 0-9a-zA-Z. Puedes encontrar un codificador de URL en la documentación de visualización de Google.

En esta sección, se abarcan los siguientes temas:


Ejes visibles chxt

Los diagramas de barras, líneas, radares y dispersión muestran una o dos líneas de eje de forma predeterminada, pero estas líneas no incluyen valores. Para mostrar valores en las líneas de tus ejes o cambiar los ejes que se muestran, debes usar el parámetro chxt. De forma predeterminada, los valores de los ejes varían de 0 a 100, a menos que los escales de forma explícita con la propiedad chxr. Para ocultar todas las líneas del eje en un gráfico de líneas, especifica :nda después del valor del tipo de gráfico en el parámetro cht (por ejemplo: cht=lc:nda).

De forma predeterminada, los ejes inferior y superior no muestran las marcas de los valores, mientras que los ejes izquierdo y derecho sí las muestran. Puedes cambiar este comportamiento con el parámetro chxs.

Sintaxis

chxt=
  <axis_1>
    ,...,
  <axis_n>
<axis>
Un eje que se mostrará en el gráfico. Los ejes disponibles son los siguientes:
  • x - Eje X inferior
  • t: Eje x superior [no compatible con Google-o-Meter]
  • y Eje Y izquierdo
  • r: Eje Y derecho [no compatible con Google-o-Meter]

Puedes especificar varios ejes del mismo tipo, por ejemplo: cht=x,x,y. Esto apilará dos conjuntos de ejes X en la parte inferior del gráfico. Esto es útil cuando se agregan etiquetas personalizadas en un eje que muestra valores numéricos (consulta el siguiente ejemplo). Los ejes se dibujan de adentro hacia afuera, por lo tanto, si tienes x,x, la primera x se refiere a la copia más interna, la siguiente x se refiere a la siguiente copia hacia afuera, y así sucesivamente.

 

Ejemplos

Descripción Ejemplo

En este ejemplo, se muestra un gráfico de líneas con un eje X, un eje Y, un eje superior (t) y un eje derecho (r).

Debido a que no se especifican etiquetas, el gráfico se establece de forma predeterminada en un rango de 0 a 100 para todos los ejes.

Ten en cuenta que, de forma predeterminada, los ejes inferior y superior no muestran marcas junto a las etiquetas.

Gráfico de líneas con las etiquetas 0, 20, 40, 60, 80 y 100 a la izquierda y a la derecha, y etiquetas: 0, 25, 50, 75 y 100 arriba y abajo
chxt=x,y,r,t

Puedes incluir varios conjuntos de etiquetas para cada eje si incluyes el mismo valor más de una vez. En este ejemplo, se muestran dos conjuntos de x y dos conjuntos de ejes Y. Esto no es muy útil cuando se usan solo las etiquetas de eje predeterminadas, como se muestra aquí. Sin embargo, puedes especificar etiquetas personalizadas para cada copia de cada eje mediante el parámetro chxl.

<img <code="" dir="ltr" src="/static/chart/image/images/chart_41.png" title="chxt=x,x,y,y&cht=lc&chd=s:cEAELFJHHHKUju9uuXUc&chco=76A4FB&chls=2.0&chs=200x1"translate="nox2"





En este ejemplo, se muestra un gráfico de barras horizontales con un eje X, un eje Y, un eje T superior y un eje R derecho.

Las etiquetas de los ejes se omiten, por lo que la API de Chart muestra un rango de 0 a 100 para el eje x y el t.

El rango del eje y y del eje r está determinado por el número de barras. En este caso, hay cinco barras, por lo que la API de gráficos muestra un rango de 0 a 4. La primera etiqueta se centra en la base de la primera barra, la segunda etiqueta se centra en la base de la segunda barra y así sucesivamente.

Gráfico de líneas con las etiquetas 0, 20, 40, 60, 80 y 100 a la izquierda y a la derecha, y etiquetas: 0, 25, 50, 75 y 100 arriba y abajo
chxt=x,y,r,t

Para suprimir los ejes predeterminados en un gráfico de líneas, especifica :nda después del tipo de gráfico. Gráfico de líneas con ejes ocultos
cht=lc:nda

Volver al principio

Rango del eje chxr

Puedes especificar el rango de valores que aparecen en cada eje de forma independiente, mediante el parámetro chxr. Ten en cuenta que esto no cambia la escala de los elementos del gráfico, solo la escala de las etiquetas del eje. Si deseas que los números de los ejes describan los valores de datos reales, configura <start_val> y <end_val> en los valores inferior y superior de tu rango de formato de datos, respectivamente. Consulta Escalamiento de eje para obtener más información.

Debes hacer que un eje sea visible con el parámetro chxt si deseas especificar su rango.

Para especificar los valores del eje personalizado, usa el parámetro chxl.

Sintaxis

Separa los rangos de etiquetas de varios ejes con el carácter de barra vertical ( |).

chxr=
  <axis_index>,<start_val>,<end_val>,<opt_step>
    |...|
  <axis_index>,<start_val>,<end_val>,<opt_step>
<axis_índice>
Eje al que se aplicarán las etiquetas. Este es un índice basado en cero en el array de eje que especifica chxt. Por ejemplo, el eje r sería 1 en chxt=x,r,y.
<start_val>
Es un número que define el valor bajo para este eje.
<end_val>
Es un número que define el valor alto para este eje.
<opt_step>
[Opcional] Es el paso de recuento entre las marcas del eje. No hay un valor de paso predeterminado; el paso se calcula para intentar mostrar un conjunto de etiquetas bien espaciadas.

 

Ejemplos

Descripción Ejemplo

En este ejemplo, se muestran los ejes Y izquierdo y derecho (y y r) y un eje X (x).

Cada eje tiene un rango definido. Debido a que no se especifican etiquetas ni posiciones, los valores se toman del rango especificado y se separan de forma uniforme dentro de ese rango. En el gráfico de líneas, los valores se extienden de manera uniforme a lo largo del eje X.

La dirección del eje se invierte para el eje r (índice 2), porque el primer valor (1000) es mayor que el último valor (0).


chxt=x,y,r
chxr=
  0,0,500|
  1,0,200|
  2,1000,0

En este ejemplo, se especifican los valores para el eje X.

Las etiquetas de los ejes están espaciadas uniformemente a lo largo del eje. Se especifica un valor de cinco (5) para el parámetro <opt_step>.

Gráfico de barras con 200, 300 y 400 en el eje X chxt=x
chxr=0,10,50,5

Volver al principio

Etiquetas personalizadas de los ejes chxl

Puedes especificar etiquetas de eje de string personalizadas en cualquier eje con el parámetro chxl. Puedes especificar tantas etiquetas como desees. Si muestras un eje (con el parámetro chxt) y no especificas etiquetas personalizadas, se aplicarán las etiquetas numéricas estándar. Para especificar un rango numérico personalizado, usa el parámetro chxr.

Para establecer ubicaciones específicas a lo largo del eje para tus etiquetas, usa el parámetro chxp.

Sintaxis

Especifica un conjunto de parámetros para cada eje que deseas etiquetar. Separa varios conjuntos de etiquetas con el carácter de barra vertical (|).

chxl=
  <axis_index>:|<label_1>|...|<label_n>
    |...|
  <axis_index>:|<label_1>|...|<label_n>
<axis_índice>
Eje al que se aplicarán las etiquetas. Este es un índice en el array de parámetros chxt. Por ejemplo, si tienes chxt=x,x,y,y, el índice 0 sería el primer eje X, 1 sería el segundo eje X.
<label_1>| ... |<label_n>
Una o más etiquetas para colocar a lo largo de este eje. Pueden ser valores numéricos o de cadena; no es necesario que las cadenas estén entre comillas. label_1 se muestra en la posición más baja del eje, y label_n se muestra en la posición más alta. Las etiquetas adicionales se separan de forma uniforme entre ellas. Indica los espacios con un signo +. No hay forma de especificar un salto de línea en una etiqueta. Separa las etiquetas con un carácter de barra vertical. Nota: No coloques una canalización después de la etiqueta final en el parámetro chxl.

 

Ejemplos

Descripción Ejemplo

En este gráfico, se muestra cómo agregar etiquetas personalizadas a dos ejes. Observa cómo los valores están espaciados de manera uniforme y que el último valor chxl no termina con una canalización.

Gráfico de líneas con 0 y 100 a la izquierda, A, B y C a la derecha, enero, julio, enero, julio y enero en el eje X, y 2005, 2006 y 2007 debajo
chxt=x,y
chxl=
0:|Jan|Feb|March|April|May|
1:|Min|Mid|Max

En este ejemplo, se incluyen etiquetas de eje en los ejes Y izquierdo y derecho (y y r). También incluye dos conjuntos de valores para el eje x (x). Puedes considerar agregar marcas de verificación en el eje Y con chxs.

Gráfico de líneas con 0 y 100 a la izquierda, A, B y C a la derecha, enero, julio, enero, julio y enero en el eje X, y 2005, 2006 y 2007 debajo
chxt=x,y,r,x
chxl=
0:|Jan|July|Jan|July|Jan|
1:|0|50|100|
2:|A|B|C|
3:|2005|2006|2007

En este ejemplo, se incluyen etiquetas de eje en los ejes Y izquierdo y derecho (y y r). También incluye dos conjuntos de valores para el eje x (x). Ten en cuenta las etiquetas vacías del conjunto del eje x inferior, que se usan para separar los valores.

En este ejemplo, se usan valores predeterminados para las etiquetas del eje del eje Y de la izquierda.

Gráfico de barras con 0 y 100 a la izquierda, A, B y C a la derecha, enero, julio, enero, julio y enero en el eje X, y 2005, 2006 y 2007 debajo
chxt=x,y,r,x
chxl=
0:|Jan|July|Jan|July|Jan|
2:|A|B|C|
3:|2005||2006||2007

Si deseas agregar una etiqueta genérica para describir un eje completo (por ejemplo, para etiquetar un eje como "costo" y otro "estudiante"), usa la propiedad chxt para agregar un eje adicional en cada lado y, luego, usa chxl para agregar una sola etiqueta personalizada a cada lado y chxp para separarla en el medio del eje.


chxt=x,x,y,y
chxl=1:|Martinis|3:|Score
chxp=1,50|3,50

Volver al principio

Posiciones de la etiqueta de eje chxp

Puedes especificar qué etiquetas de eje se mostrarán, ya sea con las etiquetas predeterminadas o las personalizadas especificadas con chxl. Si no especificas posiciones exactas con este parámetro, las etiquetas se espacarán de manera uniforme y se establecerán en un valor de paso predeterminado a lo largo de los ejes. Si no especificas chxl, las etiquetas de marca de verificación serán los valores predeterminados (por lo general, valores de datos o números de barras en los gráficos de barras).

Sintaxis

Separa varios conjuntos de posicionamiento con el carácter de barra vertical (|).

chxp=
  <axis_1_index>,<label_1_position>,...,<label_n_position>
    |...|
  <axis_m_index>,<label_1_position>,...,<label_n_position>
<axis_índice>
Es el eje para el que especificas las posiciones. Este es un índice del array de parámetros chxt. Por ejemplo, si tienes chxt=x,x,y,y, el índice 0 sería el primer eje X, 1 sería el segundo eje X, y así sucesivamente.
<label_1_position>,...,<label_n_position>
: Es la posición de la etiqueta en el eje. Esta es una lista de valores numéricos separada por comas, en la que cada valor establece la posición de la etiqueta correspondiente en el array chxl: la primera entrada se aplica a la primera etiqueta y así sucesivamente. La posición es un valor en el rango de ese eje. Ten en cuenta que este valor siempre será de 0 a 100, a menos que hayas especificado un rango personalizado con chxr. Debes tener tantas posiciones como etiquetas para ese eje.

 

Ejemplos

Descripción Ejemplo

En este ejemplo, se incluyen etiquetas del eje R en posiciones especificadas del gráfico. El texto de la etiqueta se especifica con el parámetro chxl.

Las etiquetas con una posición especificada de 0 se colocan en la parte inferior del eje y o r, o a la izquierda de los ejes X o T.

Las etiquetas con una posición especificada de 100 se colocan en la parte superior del eje y o r, o a la derecha de los ejes X o T.

Line chart with min, average, and max on the right, 20, 40, 60, 80, and 100 on the left, and 0, 25, 50, 75, and 100 along the x-axis
chxt=x,y,r
chxl=2:|min|average|max
chxp=2,10,35,75

En este ejemplo, se muestra cómo mostrar los valores predeterminados de las etiquetas, pero solo en ubicaciones específicas.

chxp=1,10,35,75: El eje y debe mostrar solo tres etiquetas: 10, 35 y 75. Debido a que no se especifica ningún texto de etiqueta personalizada, se muestran estos valores de los ejes. Ten en cuenta que no tienes que espaciar las etiquetas de manera uniforme cuando usas chxp. Si no se especificara chxp aquí, la distancia del valor predeterminado de la etiqueta en el eje y sería cada 20 unidades, como se muestra en el segundo gráfico.

Line chart with 10, 35, and 75 on the left, and 0, 25, 50, 75, and 100 along the x-axis
chxt=x,y
chxp=1,10,35,75

Gráfico de líneas con posiciones de ejes predeterminadas.
chxt=x,y
chxp no especificado

Volver al principio

Estilos de etiqueta de eje chxs

Puedes especificar el tamaño, el color y la alineación de la fuente para las etiquetas de ejes, tanto personalizadas como predeterminados. Todas las etiquetas en el mismo eje tienen el mismo formato. Si tienes varias copias de un eje, puedes formatear cada una de manera diferente. También puedes especificar el formato de una cadena de etiqueta, por ejemplo, para mostrar símbolos de moneda o ceros finales.

De forma predeterminada, los ejes inferior y superior no muestran las marcas de los valores, mientras que los ejes izquierdo y derecho sí las muestran.

Sintaxis

Los valores de varios ejes se deben separar con un carácter de barra vertical (|).

chxs=
 <axis_index><opt_format_string>,<opt_label_color>,<opt_font_size>,<opt_alignment>,<opt_axis_or_tick>,<opt_tick_color>,<opt_axis_color>
   |...|
 <axis_index><opt_format_string>,<opt_label_color>,<opt_font_size>,<opt_alignment>,<opt_axis_or_tick>,<opt_tick_color>,<opt_axis_color>
<axis_index>
El eje al que se aplica esto. Este es un índice basado en cero en el parámetro chxt.
<opt_format_string>
[Opcional] Esta es una string de formato opcional que, si se usa, sigue inmediatamente después del número de índice del eje sin una coma intermedia. Comienza con una letra N literal seguida de los siguientes valores (opcional): La sintaxis de la string de formato es la siguiente:
       N<preceding_text>*<number_type><decimal_places>zs<x or y>*<following_text>
Este es el significado de cada elemento:
  • <preceding_text>: Texto literal que antecede a cada valor.
  • *...*: Es un bloque opcional unido a asteriscos literales, en el que puedes especificar los detalles de formato de los números. Se admiten los siguientes valores y son opcionales:
    • <number_type>: Es el formato de número, para valores numéricos. Elige una de estas opciones:
      • f: Es el formato de punto flotante (predeterminado). Considera especificar también la precisión con el valor <decimal_places>.
      • p: formato de porcentaje. Se agregará un signo % automáticamente. Nota: Cuando usas este formato, los valores de los datos entre 0.0 y 1.0 se asignan a 0 - 100% (por ejemplo, 0.43 se mostrará como 43%).
      • e: formato de notación científica.
      • c<CUR>: Aplica al número el formato de la moneda especificada con el marcador de moneda correspondiente. Reemplaza <CUR> por un código de moneda de tres letras. Ejemplo: cEUR para euros Puedes encontrar una lista de códigos en el sitio web ISO, aunque no todos los símbolos son compatibles.
    • <decimal_places>: Es un número entero que especifica cuántos decimales se mostrarán. El valor se redondea (no truncado) a esta longitud. El valor predeterminado es 2.
    • z: Muestra ceros finales. La configuración predeterminada es no.
    • s: Muestra separadores de grupo. La configuración predeterminada es no.
    • x o y: Muestran los datos de las coordenadas X o Y, según lo especificado. El significado de los datos x varía según el tipo de gráfico: experimenta con tu gráfico para determinar qué significa. El valor predeterminado es "y".
  • <following_text>: Texto literal que sigue a cada valor.
<opt_label_color>
Es el color que se aplica al texto del eje (pero no al de la línea del eje), en formato hexadecimal RRRGGBB. El color de la línea del eje se especifica por separado con opt_axis_color. La configuración predeterminada es el gris.
<opt_font_size>
[Opcional] especifica el tamaño de la fuente en píxeles. Este parámetro es opcional.
<opt_alignment>
[Opcional] Alineación de la etiqueta. En el caso de los ejes superior e inferior, esto describe cómo se alinea la etiqueta con la marca de verificación que está por encima o por debajo. Para los ejes izquierdo o derecho, esto describe cómo se alinea dentro de su cuadro delimitador, que toca el eje. Especifica uno de los siguientes números:
  • -1: Parte superior o inferior: Las etiquetas están a la derecha de las marcas; izquierda o derecha: Las etiquetas están alineadas a la izquierda en su área. Predeterminado para etiquetas del eje r.
  • 0: Parte superior o inferior: Las etiquetas están centradas en las marcas. Izquierda o derecha: Las etiquetas están centradas en su área. Predeterminado para etiquetas del eje x y t.
  • 1: Parte superior o inferior: Las etiquetas están a la izquierda de las marcas; izquierda o derecha: Las etiquetas están alineadas a la derecha en su área. Predeterminado para etiquetas del eje y.
<opt_axis_or_tick>
[Opcional; no admitido en Google-o-meter] Indica si se deben mostrar marcas o líneas de eje para este eje. Las comillas simples y las líneas de los ejes solo están disponibles para los ejes más internos (por ejemplo, no se admiten para el exterior de dos ejes X). Usa uno de los siguientes valores:
  • l (“L” minúscula): Dibuja solo la línea del eje.
  • t: Dibuja solo marcas. Las marcas de tilde son las pequeñas líneas que están junto a las etiquetas de eje.
  • lt: [Predeterminado] Dibuja una línea de eje y las marcas de verificación de todas las etiquetas.
  • _: (guion bajo) no dibuja ninguna línea de eje ni marcas de verificación. Si deseas ocultar una línea de eje, usa este valor.
<tick_color>
[Opcional; no se admite en Google-o-meter] Es el color de la marca de verificación, en formato hexadecimal RRGGBB. La configuración predeterminada es el gris.
<opt_axis_color>
[Opcional] Es el color de esta línea del eje, en formato hexadecimal RRGGBB. La configuración predeterminada es el gris.

 

Ejemplos

Descripción Ejemplo

El tamaño y el color de la fuente se especifican para el segundo eje x (enero, febrero y mar).

Gráfico de líneas con el mínimo, el promedio y el máximo a la izquierda, 0, 1, 2, 3 y 4 a la derecha, del 0 al 100 en el eje X, y ene, feb y mar en azul debajo

chxt=x,y,r,x
chxr=2,0,4
chxl=3:|Jan|Feb|Mar|
     1:|min|average|max
chxp=1,10,35,75
chxs=3,0000DD,13,0,t

El tamaño, el color y la alineación de la fuente se especifican para el eje Y derecho. Se dibujan las marcas de marca, pero no la línea de eje.

Gráfico de líneas en el que se muestran los números del 0 al 100 en el eje X; en el eje X, enero, febrero, marzo; el 0 al 4, en el eje Y; y marcas de verificación rojas con texto azul para el mínimo, el promedio y el máximo a la derecha.

chxt=x,y,r,x
chxl=3:|Jan|Feb|Mar|
     2:|min|average|max
chxp=2,10,35,95
chxs=2,0000DD,13,-1,t,FF0000

En este gráfico, se incluyen tres conjuntos de datos y se muestran tres conjuntos de etiquetas de eje, uno por serie. Cada conjunto de etiquetas se formatea con una cadena de formato personalizado, como se describe a continuación:

  • 0N*e,000000|
    • 0 significa la primera serie de datos.
    • N significa una cadena de formato.
    • * significa el inicio de los especificadores de formato.
    • e significa notación científica.
    • * significa el final de los especificadores de formato.
    • 000000 significa texto negro.
  • 1N*cUSD*Mil,FF0000|
    • 1 significa que la segunda serie
    • N significa una cadena de formato.
    • * significa el inicio de los especificadores de formato.
    • c significa un marcador de moneda.
    • USD especifica el dólar estadounidense como el marcador de moneda que se debe usar.
    • * significa el final de los especificadores de formato.
    • Mil es una string literal que sigue a
    • FF0000 significa texto rojo.
  • 2N*sz2*,0000FF
    • 2 significa que la tercera serie
    • N significa una cadena de formato.
    • * significa el inicio de los especificadores de formato.
    • s significa mostrar especificadores de agrupación (en la configuración regional de inglés de EE.UU., que es una coma cada tres ceros).
    • z2 significa que se muestran dos ceros finales.
    • 0000FF significa texto azul.

Los rangos de etiquetas de eje se establecen usando el parámetro chxr (axis_index, start, end y step). Si no se hubiera establecido, habrían sido de 0 a 100 de forma predeterminada.


chd=s:
  984sttvuvkQIBLKNCAIi,
  DEJPgq0uov17zwopQODS,
  AFLPTXaflptx159gsDrn
chxr=
  0,0,1000000,250000|
  1,0,60|
  2,0,5000
chxs=
  0N*e,000000|
  1N*cUSD*Mil,FF0000|
  2N*sz2*,0000FF

Volver al principio

Estilos de marca de verificación de eje chxtc

Puedes especificar marcas largas para ejes específicos. Por lo general, se usa para extender una marca de verificación a lo largo de la longitud de un gráfico. Usa el parámetro chxs para cambiar el color de la marca.

Los valores de varios ejes se deben separar con un carácter de barra vertical (|). Los valores dentro de una serie deben separarse con una coma.

Sintaxis

chxtc=
  <axis_index_1>,<tick_length_1>,...,<tick_length_n>
    |...|
  <axis_index_m>,<tick_length_1>,...,<tick_length_n>
<axis_index>
El eje al que se aplica esto. Este es un índice basado en cero en el parámetro chxt. Separa los valores para diferentes ejes con un delimitador de barras.
<tick_length_1>,...,<tick_length_n>
La longitud de las marcas de ese eje, en píxeles. Si se proporciona un solo valor, se aplicará a todos los valores. Si se proporciona más de un valor, las marcas de verificación del eje rotarán por la lista de valores para ese eje. Los valores positivos se dibujan fuera del área del gráfico y se recortan según los bordes del gráfico. El máximo valor positivo es 25. Los valores negativos se dibujan dentro del área del gráfico y se recortan según los bordes del área.

 

Ejemplos

Descripción Ejemplo

Ejemplo del uso de chxtc para crear marcas rojas largas. La longitud de la marca de verificación supera el ancho del área del gráfico, pero se recorta para adaptarse al gráfico.

  • chxt=x,y,r,x: Muestra un eje izquierdo, un eje derecho y dos ejes inferiores.
  • chxl=2:|min|average|max|3:|Jan|Feb|Mar: Es el texto de la etiqueta asignado al eje "r" (lado derecho) y los ejes X externos.
  • chxp=2,10,35,95: Posiciones de las etiquetas personalizadas a lo largo del eje r (índice=2) para las tres etiquetas.
  • chxs=2,0000dd,13,-1,t,FF0000: Estilos de etiqueta del eje r para el eje r: color y tamaño del texto, alineado a la izquierda y con marcas de verificación rojas.
  • chxtc=1,10|2,-180: Longitudes de las marcas del eje para los ejes y y r. El primer valor especifica marcas de 10 píxeles de longitud, fuera del eje. El segundo valor especifica marcas de 180 píxeles de largo dentro del eje; el número negativo significa que la marca va dentro del eje y se recorta para ajustarse al gráfico.

Gráfico de líneas con 0 a 100 en el eje X, ene, feb y mar debajo, 0 a 4 en el eje Y, y marcas de verificación largas rojas con texto azul para el mínimo, el promedio y el máximo a la derecha.

chxt=x,y,r,x
chxl=
  2:|min|average|max|
  3:|Jan|Feb|Mar
chxp=2,10,35,95
chxs=
  2,0000dd,13,-1,t,FF0000
chxtc=1,10|2,-180

En este gráfico, se muestran longitudes de marcas alternas. chxtc especifica dos valores de longitud de marca para el eje y (5 y 15), y las marcas dibujadas en el gráfico alternan entre los dos valores.
chxt=x,y
chxtc=
  1,5,15

Volver al principio

Estilos de línea chls [Línea, radar]

Puedes especificar el grosor de las líneas y un diseño sólido o discontinuo con el parámetro chls. Este parámetro solo se puede usar para aplicar diseño a gráficos de líneas o de radar. No se puede usar para diseñar líneas de gráficos compuestos, a menos que el tipo de base sea uno de líneas.

Sintaxis

Separa varios diseños de línea con el carácter de barra vertical ( |); el primer estilo se aplica a la primera línea, el segundo a la siguiente, y así sucesivamente. Si tienes menos diseños que líneas, el diseño predeterminado se aplica a todas las líneas no especificadas.

chls=
  <line_1_thickness>,<opt_dash_length>,<opt_space_length>
    |...|
  <line_n_thickness>,<opt_dash_length>,<opt_space_length>
<line_1_thickness>
Espesor de la línea, en píxeles
<opt_dash_length>, <opt_space_length>
[Opcional] Se usa para definir líneas de cuadrícula punteadas. El primer parámetro es la longitud de cada línea punteada, en píxeles. El segundo parámetro es el espaciado entre guiones, en píxeles. Para una línea continua, no especifiques ninguno de los valores. Si solo especificas <opt_dash_length>, entonces <opt_space_length> se establecerá en <opt_dash_length>. El valor predeterminado es 1,0 (una línea continua).

 

Ejemplos

Descripción Ejemplo

Aquí, la línea punteada se especifica mediante 3,6,3, y la línea continua más gruesa se especifica con 5.

Gráfico de líneas con una línea sólida y una línea punteada
chls=3,6,3|5

Volver al principio

El fondo rellena chf [todos los gráficos]

Puedes especificar colores de relleno y estilos para el área de datos o todo el fondo del gráfico. Los tipos de relleno incluyen rellenos sólidos, rellenos a rayas y gradientes. Puedes especificar diferentes rellenos para distintas áreas (por ejemplo, toda el área del gráfico o solo el área de datos). El relleno del área del gráfico reemplaza el relleno del fondo. Todos los rellenos se especifican con el parámetro chf y puedes mezclar diferentes tipos de relleno (sólidos, rayas, gradientes) en el mismo gráfico separando los valores con el carácter de barra vertical ( | ). Los rellenos del área del gráfico reemplazan los rellenos del fondo del gráfico.

Rellenos sólidos chf [Todos los gráficos]

Puedes especificar un relleno sólido para el fondo o el área del gráfico, o bien asignar un valor de transparencia a todo el gráfico. Puedes especificar varios rellenos con el carácter de barra vertical (|). (Maps: solo en segundo plano).

Sintaxis

chf=<fill_type>,s,<color>|...
<fill_type>
La parte del gráfico que se rellena. Especifica uno de los siguientes valores:
  • bg: Relleno de fondo
  • c: Relleno del área del gráfico. No es compatible con los gráficos de mapas.
  • a: Haz que todo el gráfico (incluidos los fondos) sea transparente. Los primeros seis dígitos de <color> se ignoran y solo los dos últimos (el valor de transparencia) se aplican a todo el gráfico y a todos los rellenos.
  • b<index>: Rellenos sólidos de barras (solo gráficos de barras). Reemplaza <index> por el índice de serie de las barras para rellenar con un color sólido. El efecto es similar al de especificar chco en un gráfico de barras. Consulta Colores de la serie del gráfico de barras para ver un ejemplo.
s
Indica un relleno sólido o de transparencia.
<color>
Es el color de relleno, en formato hexadecimal RRRGGBB. En el caso de las transparencias, los primeros seis dígitos se ignoran, pero deben incluirse de todos modos.

 

Ejemplos

Descripción Ejemplo

En este ejemplo, se rellena el fondo del gráfico con gris pálido (EFEFEF).

Gráfico de líneas roja con relleno de área negro.

chf=bg,s,EFEFEF

En este ejemplo, se rellena el fondo del gráfico con gris pálido (EFEFEF) y el área del gráfico con negro (000000).

Gráfico de líneas rojo con un área del gráfico negra y fondo gris pálido.

chf=c,s,000000|
bg,s,EFEFEF

En este ejemplo, se aplica una transparencia del 50% a todo el gráfico (80 en hexadecimal es 128, o alrededor del 50% de transparencia). Observa el fondo de celda de la tabla que se muestra a través del gráfico.

Diagrama de dispersión con puntos en azul y una transparencia del 50%.

chf=a,s,00000080

Volver al principio

Rellenos de gradientes chf [línea, barra, Google-o-meter, radar, dispersión,Venn]

Puedes aplicar uno o más rellenos de gradientes a áreas o fondos del gráfico. Los rellenos de gradientes son fundidos de un color a otro. (Gráficos circulares de Google-o-Meter: solo fondo).

Cada relleno de gradiente especifica un ángulo y, luego, dos o más colores fijados a una ubicación específica. El color varía a medida que se mueve de un ancla a otro. Debes tener al menos dos colores con diferentes valores de <color_centerpoint> para que uno pueda difuminarse en el otro. Cada gradiente adicional se especifica con un par <color>,<color_centerpoint>.

Sintaxis

chf=<fill_type>,lg,<angle>,<color_1>,<color_centerpoint_1>
    ,...,
  <color_n>,<color_centerpoint_n>
<fill_type>
El área del gráfico que se debe completar. Uno de los siguientes:
  • bg: Relleno de fondo
  • c: Relleno del área del gráfico.
  • b<index>: Rellenos de gradientes de barras (solo gráficos de barras). Reemplaza <index> por el índice de serie de las barras para rellenar con un gradiente. Consulta Colores de la serie del gráfico de barras para ver un ejemplo.
lg
Especifica un relleno de gradiente.
<angle>
Es un número que especifica el ángulo del gradiente de 0 (horizontal) a 90 (vertical).
<color>
Es el color del relleno, en formato hexadecimal RRGGBB.
<color_centerpoint>
Especifica el punto de anclaje para el color. El color comenzará a desvanecerse a partir de este punto a medida que se acerque a otro ancla. El rango de valores va de 0.0 (borde inferior o izquierdo) a 1.0 (borde superior o derecho), inclinado en el ángulo especificado por <angle>.

 

Ejemplos

Descripción Ejemplo

El área del gráfico tiene un gradiente lineal horizontal, especificado con un ángulo de cero grados (0).

Los colores son durazno (FFE7C6), centrados en el lado izquierdo (posición 0.0) y azul (76A4FB) centrados en el lado derecho (posición 1.0).

El fondo del gráfico se dibuja en gris (EFEFEF).

Gráfico de líneas gris oscuro con fondo gris pálido y área del gráfico en un gradiente lineal de blanco a azul de izquierda a derecha

chf=
  c,lg,0,
  FFE7C6,0,
(durazno)
  76A4FB,1
(azul)

El área del gráfico tiene un gradiente lineal diagonal (de abajo a la izquierda a arriba a la derecha), especificado con un ángulo de cuarenta y cinco grados (45).

El primer color especificado es el durazno (FFE7C6). La parte inferior izquierda del gráfico es durazno puro.

El azul (6A4FB) es el segundo color especificado. La parte superior derecha del gráfico es de color azul puro. Observa cómo se especifica un desplazamiento de 0.75 para proporcionar un pico de azul que se desvanece hacia la esquina superior derecha.

El fondo del gráfico se dibuja en gris (EFEFEF).

Gráfico de líneas en gris oscuro con fondo gris pálido y área del gráfico en un gradiente lineal diagonal de blanco a azul desde abajo a la izquierda hasta arriba a la derecha

chf=
  c,lg,45,
  FFE7C6,0,
(durazno)
  76A4FB,0.75
(azul)

El área del gráfico tiene un gradiente lineal vertical (de arriba abajo), especificado con un ángulo de noventa grados (90).

El primer color especificado es azul (76A4FB). La parte superior del gráfico es de color azul puro.

El durazno (FFE7C6) es el segundo color especificado. La parte inferior del gráfico es durazno puro.

El fondo del gráfico se dibuja en gris (EFEFEF).

Gráfico de líneas en gris oscuro con fondo gris pálido y área del gráfico en un gradiente lineal vertical de blanco a azul de abajo hacia arriba

chf=
  c,lg,90,
  FFE7C6,0,
(durazno)
  76A4FB,0.5
(azul)

Volver al principio

 

Rellenos a rayas chf [Línea, Barra, Google-o-meter, Radar, Dispersión, Venn]

Puedes especificar un relleno de fondo a rayas para el área de tu gráfico o para todo el gráfico. (Gráficos circulares de Google-o-Meter: solo fondo).

Sintaxis

chf=
  <fill_type>,ls,<angle>,<color_1>,<width_1>
    ,...,
  <color_n>,<width_n>
<fill_type>
El área del gráfico que se debe completar. Uno de los siguientes:
  • bg: Relleno de fondo
  • c: Relleno del área del gráfico
  • b<index>: Rellenos a rayas de barras (solo gráficos de barras). Reemplaza <index> por el índice de serie de las barras para rellenar con rayas. Consulta Colores de la serie del gráfico de barras para ver un ejemplo.
ls
Especifica el relleno de franjas lineales.
<angle>
Es el ángulo de todas las rayas, en relación con el eje Y. Usa 0 para las rayas verticales o 90 para las horizontales.
<color>
Es el color de esta franja, en formato hexadecimal RRRGGBB. Repite los valores <color> y <width> para cada línea adicional. Debes tener al menos dos rayas. Las rayas se alternan hasta que se completa el gráfico.
<width>
El ancho de esta franja, de 0 a 1, donde 1 es el ancho completo del gráfico. Las rayas se repiten hasta que se completa el gráfico. Repite los valores <color> y <width> para cada franja adicional. Debes tener al menos dos rayas. Las rayas se alternan hasta que se completa el gráfico.

 

Ejemplos

Descripción Ejemplo
  • bg,ls,0: Relleno de franjas de fondo con rayas en un ángulo de cero grados con respecto al eje y (paralelo al eje Y). Las rayas cubren el fondo del gráfico y el área del trazado.
  • CCCCCC,0.15: La primera franja es gris oscuro, un 15% más ancha que el gráfico.
  • FFFFFF,0.1: La segunda franja es blanca, un 10% más ancha que el gráfico.
Gráfico de líneas azul con rayas grises y blancas alternadas de izquierda a derecha
chf=
  bg,ls,0,
  CCCCCC,0.15,
  FFFFFF,0.1
  • c,ls,90: Área del gráfico con franjas horizontales en un ángulo de noventa grados desde el eje y. Las rayas cubren el área del diagrama, pero se omite el fondo del gráfico.
  • 999999,0.25: La primera franja es gris oscuro, un 25% más ancha que el gráfico.
  • CCCCCC,0.25: Es igual a la primera franja, pero es de un color gris más claro.
  • FFFFFF,0.25: Igual que la primera franja, pero blanca.
Gráfico de líneas azul con rayas gris oscuro, gris pálido, blanca y gris oscuro de abajo hacia arriba
chf=
  c,ls,90,
  999999,0.25,
  CCCCCC,0.25,
  FFFFFF,0.25

Volver al principio