Breu tutorial de MATHJAX (i de pàgines web)


Jordi Lagares Roset - INS Pla de l'Estany (Banyoles)



Mathjax és un script fàcil (de fet és moltes i més importants coses) que permet escriure fórmules matemàtiques en una pàgina web. Com per exemple:


`x = (-b \pm sqrt(b^2-4ac))/(2a)`


Per escriure-ho cal tenir una pàgina web que al principi hi hagi el següent script (per exemple després del <BODY>):

<script type="text/javascript"src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=AM_HTMLorMML-full"></script>

A continuació per excriure les fórmules cal escriure-les amb la sintaxi que es mostra a sota entre dos accents oberts ` `:

Així per exemple si voleu escriure la fórmula de les solucions de l'equació de segon grau de dalt cal escriure:

`x = (-b \pm sqrt(b^2-4ac))/(2a)`




quocient `(3+x)/2` (3+x)/2

potència `5^x` 5^x

arrel quadrada `sqrt(2)` sqrt(2)

arrel `root(3){x}` root(3){x}

Antislash `\setminus` \setminus

pi `\pi` \pi

decimal periòdic `1'\2overline{34}` 1'\2overline{34}

més menys `\pm` \pm

infinit `\infty` \infty

aproximat `\approx` \approx

pertany `\in` \in

no pertany `\notin` \notin

unió `\cup` \cup

intersecció `\cap` \cap

està contingut `\subset` \subset

conjunt vuit `\emptyset` \emptyset

per a tot `\forall` \forall

existeix `\exists` \exists

epsilon `\epsilon` \epsilon

delta `\delta` \delta

implica `=>` =>

si i només si `<=>` <=>

més gran o igual `>=` >=

més petit o igual `<=` <=

límit `\lim_{x\to 0}` \lim_{x\to 0}

sumatori `\sum_{i=0}^\infty` \sum_{i=0}^\infty

integral `\int_a^\b` \int_a^b

subscript `x_i` x_i

superscript `x^2` x^2

sub i superscript `x_i^2` x_i^2

logaritmes `\log_2 x` \log_2 x





Referència




Què és una pàgina web?

És un arxiu de text que normalment té l'extensió . htm o .html, per exemple aquest arxiu es diu, webformulesmatematiques.htm.

Es pot editar amb un processador de text pla com el notepad de Windows. Nota: Blogger, facebook, twitter, en cert sentit són editors de pàgines web per facilitar la tasca d'edició i sobretot de pujar-ho al núbol (web 2.0). Nosaltres farem servir el Notepad per coneixer la base de tot plegat.


Perquè sigui un fitxer HTML, que sàpiguen interpretar els navegadors, cal que comenci amb l'etiqueta <HTML> i acabi amb l'etiqueta </HTML>

De fet la mínima estructura que ha de tenir una pàgina web és la següent. Fem l'exemple d'un HOLA MUNDO web:

<HTML>
<HEAD>
<TITLE>HOLA MUNDO</TITLE>
</HEAD>
<BODY>
HOLA MUNDO
</BODY>
</HTML>

Si obriu el notepad i hi copieu aquest text i el deseu, per exemple, en el fitxer holamundo.htm i li feu doble clic veureu com el navegador, Firefox, Chrome, ... us l'obrirà.

Si hi copieu el següent codi i el deseu, per exemple, amb el nom segongrau.htm.


<HTML>
<HEAD>
<TITLE>Equació de segon grau</TITLE>
</HEAD>
<BODY>
<script type="text/javascript"src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=AM_HTMLorMML-full"></script> <BR>
<BR>
<CENTER>Equació de segon grau:</CENTER><BR>
<BR>
<BR>
<CENTER>`x = (-b \pm sqrt(b^2-4ac))/(2a)`</CENTER>
<BR>
<BR>
</BODY>
</HTML>

I ho deseu, per exemple, amb el nom segongrau.htm i ho obriu amb el navegador hauria de sortir l'equació de dalt. Aquí hi surten codis HTML com <BR> que serveixen per fer més coses, en aquest cas és un salt de línia.


NOTA 1: Si obriu aquest fitxer amb el notepad veure-ho un fitxer HTML més complex, de moment no el mireu gaire ja que hi ha una recurrència ja que hi ha escrit HTML normal i d'extrany perquè es pugui veure a aquesta mateixa web. Al principi no us hi trenqueu el tarro ;-)

NOTA 2: A mesura que vagi descobrim com escriure altres fórmules les hi afegiré.

NOTA 3. Jo no ho edito amb el Notepad, ho faig amb un processador de textos que em vaig fabricar que m'automatitza les tasques d'escriure el codi HTML, però el resultat és el que veieu.
https://youtu.be/djV11Xbc914