![cht=tx&chl=x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}](https://developers-dot-devsite-v2-prod.appspot.com/static/chart/infographics/images/chart_528.png?authuser=3&hl=es)
Puedes generar una imagen que muestre una fórmula matemática con el lenguaje TeX.
Descripción general
Puedes generar una imagen de una fórmula matemática con el lenguaje TeX (se pronuncia "tek" o "tech"). Esto resulta útil para mostrar fórmulas complejas en tu página web. Estos son algunos ejemplos de fórmulas procesadas sobre la marcha:
Copia y pega las URLs de las imágenes en un navegador para ver la URL que genera cada imagen.
Especifica tu fórmula con el lenguaje TeX en la propiedad src y una etiqueta <img>
, y la fórmula se mostrará como un archivo PNG. Si lo prefieres, también puedes enviar una solicitud GET de manera programática para recuperar un archivo PNG de fórmula.
Sintaxis
URL raíz: https://chart.googleapis.com/chart?
Las solicitudes de imágenes de fórmula admiten los siguientes parámetros de consulta de URL después del signo "? en la URL raíz:
Parámetro de URL | Obligatorio u opcional | Descripción |
---|---|---|
cht=tx |
Obligatorio | Especifica que se trata de una imagen de tipo de fórmula. |
chl=<data> |
Obligatorio | La fórmula para renderizar, en el idioma TeX. Debe codificar la fórmula en formato URL; consulte a continuación los detalles. |
chs=<width>x<height> |
Opcional | Tamaño de la imagen en píxeles Si no especificas esta opción, el tamaño se calculará automáticamente. Si especificas un solo valor, este será la altura y el ancho se calculará por ti. |
chf |
Opcional | Se admiten todos los tipos de relleno de fondo. Consulta Rellenos de fondo. |
chco |
Opcional | Especifica el color del texto. El color predeterminado es el negro. |
Codificación URL de los datos de chl
Recuerda que debes codificar en formato URL todos los caracteres que no sean seguros para URL que se usen en la fórmula. Puedes encontrar un codificador de URL aquí.
El error más común es usar + en una fórmula en lugar de %2B, como se muestra a continuación:
Sin codificación URL | Codificado para URL |
---|---|
![]() cht=tx&chl=a^2+b^2=c^2 |
![]() cht=tx&chl=a^2%2Bb^2=c^2 |
Rellenos de fondo (chf
)
Puedes especificar rellenos sólidos, con gradientes o a rayas para la imagen. Todos los rellenos se especifican con un parámetro chf
y puedes mezclar diferentes tipos de relleno (sólidos, rayas, gradientes) en la misma imagen separando los valores con el carácter de barra vertical ( | ).
Rellenos sólidos
Puedes especificar un relleno de color sólido, con o sin transparencia, o hacer que toda la imagen sea transparente.
Sintaxis
chf=<fill_type>,s,<color>|...
- <fill_type>
- Especifica uno de los siguientes valores:
bg
: Relleno de fondo. El fondo puede volverse transparente si especificas un valor alfa en el parámetro <color>.a
: Transparencia de la imagen. Se ignoran los primeros seis dígitos de<color>
y solo se aplican los dos últimos (el valor de transparencia).
- s
- Especifica un relleno sólido.
- <color>
- Es el color de relleno, en formato hexadecimal RRGGBB[AA], en el que AA es un valor de transparencia opcional (alfa).
Ejemplos
Descripción | Ejemplo |
---|---|
Una fórmula con un fondo azul. |
|
Igual que antes, pero el fondo se hace ligeramente transparente mediante el uso de dos dígitos alfa, el 80, lo que corresponde a una transparencia del 50% aproximadamente. Observa que el fondo de la fórmula es transparente, pero no el texto. |
|
En este ejemplo, se aplica una transparencia a toda la imagen. Observa cómo se ve el fondo de la celda de la tabla a través del texto y del fondo. En la imagen, se combinan dos fondos con un carácter de barra vertical:
|
|
Rellenos de gradientes
Puedes aplicar uno o más rellenos de gradientes a la fórmula. Los rellenos de gradientes son fundidos de un color a otro.
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=bg,lg,<angle>,<color_1>,<color_centerpoint_1> ,..., <color_n>,<color_centerpoint_n>
- bg
- Relleno de fondo
- 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 |
---|---|
La fórmula tiene un gradiente lineal horizontal, especificado con un ángulo de cero grados (
|
|
Igual que el ejemplo anterior, pero con un gradiente de 45 grados. |
|
Rellenos a rayas
Puedes especificar un relleno de fondo a rayas para la fórmula.
Sintaxis
chf= bg,ls,<angle>,<color_1>,<width_1> ,..., <color_n>,<width_n>
- bg
- Relleno de fondo
- ls
- Especifica un 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 o90
para las horizontales. - <color>
- Es el color de esta franja, en formato hexadecimal RRGGBB. Repite los valores <color> y <width> para cada línea adicional. Debes tener al menos dos rayas. Las rayas se alternan hasta que se rellena la imagen.
- <width>
- Es el ancho de esta franja, de
0
a1
, donde1
es el ancho completo de la imagen. Las rayas se repiten hasta que se rellena la imagen. Repite los valores <color> y <width> para cada franja adicional. Debes tener al menos dos rayas. Las rayas se alternan hasta que se rellena la imagen.
Ejemplos
Descripción | Ejemplo |
---|---|
|
![]() chf=bg,ls,0,CCCCCC,0.15,FFFFFF,0.1 |
|
![]() chf=bg,ls,90,999999,0.25,CCCCCC,0.25,FFFFFF,0.25 |