Web+Latex=MathJax

Primera entrada del blog. Ya que para hacerlo he tenido que buscar la forma de meter ecuaciones, voy a hablar un poco de cómo lo he hecho.

El tema de poner ecuaciones en páginas web nunca ha estado muy claro. Supuestamente hay un estándar (MathML), pero creo que sólo lo ha implementado, como siempre, FireFox; y aún así no sé hasta qué punto.

El caso es que MathML es XML, lo que siempre significa un montón de texto para hacer cualquier cosa, y lo que es peor, no parece haber muchas herramientas para generarlo. Pongo un ejemplo sencillo: la solución de una ecuación de segundo grado.

<math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
  <mrow>
    <mi>x</mi>
    <mo>=</mo>
    <mfrac>
      <mrow>
        <mo>&#x2212;</mo>
        <mi>b</mi>
        <mo>&#xB1;</mo>
        <msqrt>
          <mrow>
            <msup>
              <mi>b</mi>
              <mn>2</mn>
            </msup>
            <mo>&#x2212;</mo>
            <mn>4</mn>
            <mi>a</mi>
            <mi>c</mi>
          </mrow>
        </msqrt>
      </mrow>
      <mrow>
        <mn>2</mn>
        <mi>a</mi>
      </mrow>
    </mfrac>
  </mrow>
</math>

Puesto que el estándar parece que no lo sigue nadie, busqué formas de hacer lo que hace Wikipedia, generar una imagen a partir de una especificación de la fórmula. Algo que no me entusiasmaba, pero que parecía la única solución.

El caso es que buscando encontré MathJax. Es un código en Javascript que transforma una fórmula en Latex en un código HTML con CSS (o algo así, me pierdo en los detalles) que la representa. A continuación podéis ver cómo queda la misma ecuación de segundo grado, que en latex se escribe así:

x=\frac {-b\pm\sqrt{b^2-4ac}} {2a}

\begin{aligned}x=\frac {-b\pm\sqrt{b^2-4ac}} {2a}\end{aligned}

Es decir, la fórmula sale perfecta, y no es una imagen, así que escala bien y puede imprimirse. Además, tiene un menú contextual que permite copiarla.

Para meter una fórmula centrada, como la anterior hay que escribir el código latex entre  \begin{aligned} y \end{aligned}, y para que la fórmula aparezca entre el texto, como esta: \( \nabla^2 \phi = 0 \), hay que ponerla entre  \( y \) (mejor si se hace desde la edición de HTML).

Para los que no dominéis \(\LaTeX\), hay varios editores online.

Si esto no os "pone", como a mí, me da que este blog no os va a gustar.