Com afegir MathJax a blogger


Blogger és una eina de Google bastant flexible que permet introduir codi JavaScript fàcilment. Es pot afegir suport mitjançant els blocs anomenats "widgets" o bé inserint el codi JavaScript en la vista HTML a l'hora d'editar una entrada del blog. També es pot modificar la plantilla de Blogger que l'autor utilitzi en el seu blog. Aquesta última opció porta més treball i no garanteix compatibilitat amb futures versions de la plantilla.

He optat per afegir el codi en el post. Més endavant ficaré el codi en la plantilla de Blogger que faig servir. El script que cal afegir en la vista HTML és el següent:


<script type="text/x-mathjax-config"> MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}}); </script> <script src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML" type="text/javascript"> </script>

Aquest fragment de codi permet utilitzar MathJax. MathJax es una biblioteca JavaScript per poder mostrar expressions matemàtiques utilitzant TeX. TeX és un llenguatge de marcatge emprat per maquetar documents.

<editat> El codi es pot introduir en la secció <head> del HTML de la plantilla de Blogger. Un cop fet login a Blogger, en el menú del blog on surten les opcions d'entrades, estadístiques, comentaris ... cal fer clic en Tema i seguidament en "Editar HTML". La secció és al principi, així doncs no cal fer cap scroll. Imatge a sota mostrant la inserció.


Inserció de secció JavaScript en la capçalera de l'HTML de la plantilla de Blogger.

Queda patent que si utilitzeu cap bloquejador de JavaScript o anuncis, cal donar permís per que el domini del blog pugui connectar al domini de MathJax i també al de Cloudflare.</fi d'edició>

Un cop s'ha inserit el JavaScript a la capçalera ja no cal ficar-lo en cadascuna de les entrades del blog.


Sense dubte és més pràctic tenir el text escrit amb TeX i convertir-lo. Per obtenir el codi de MathJax es pot fer servir la comanda "pandoc codi.tex -s --mathjax -o mathjax.html". codi.tex és el fitxer font de Latex i mathjax.html és el fitxer destí HTML del qual copiar l'HTML a l'entrada del blog. Per descomptat, es pot fer servir els noms de fitxer que un vulgui. pandoc està disponible als repositoris d'Ubuntu.

Com a exemple de MathJax he volgut penjar un model de programació lineal. El PLE de sota descriu una serie d'equacions que permeten trobar una ruta òptima entre una serie de llocs de servei de tal manera que s'utilitzi el mínim nombre de vehicles possible i en el menor temps possible. Aquest és un problema d'optimització combinatòria. Essent una versió del "Traveller Salesman Problem" (concretament, TSP amb Time Windows), té un cost exponencial i pertany a la classe de problemes NP-Complet. És millor resoldre una instància d'aquest problema amb una heurística que no pas amb un algorisme exacte com la tornada enrere amb poda (backtracking amb branch and bound).

Model de Programa Lineal d'Enters

Els conjunts i les constants són:
\(C\) Conjunt de localitzacions o ciutats, incloent \(ls\).
\(L\) El conjunt d'enllaços o arcs.
\(time\_window_{ij}\) Marc de temps en el qual el lloc \(i\) està disponible per al vehicle. L'índex \(j \in \{1,2\}\) permet escollir el temps inicial i final de la finestra de temps.
\(task\_duration_{i}\) El temps requerit per servir la localització \(i\).
\(distance_{ij}\) Distància, en temps, entre els llocs \(i\) i \(j\).
Les variables de decisió del model són:
\(links_{ij}\) Una variable binària (\(links_{ij} \in \{0,1\}\)). Pren el valor 1 si existeix una ruta d'un \(i \in C\) cap a un \(j \in C\). 0 en cas contrari.
\(num\_vehicles\) És un enter positiu. Indica el nombre de vehicles utilitzats.
\(start\_time_{i}\) Enter positiu. Marca el temps en el que una localització és atesa per un vehicle.
La variable (\(z\)) és definida com
\[\label{eq.1} z = num\_vehicles + start\_time_{ls}\]
\(start\_time_{ls}\) es refereix al temps d'arribada a la localització d'inici de la ruta.
Les equacions que descriuen el model de programació lineal són les següents:
\[\begin{aligned} &\text{minimitza } z \label{eq.2} \\ &\text{subjecte a:}\nonumber \\ &num\_vehicles &\geq 1 \label{eq.3} \\ &\sum_{j\in C} links_{ls,j} &= num\_vehicles &\quad ls\in C \label{eq.4} \\ &\sum_{i\in C} links_{i,ls} &= num\_vehicles &\quad ls\in C \label{eq.5} \\ &\sum_{i\in C} links_{i,k} &= 1 &\quad \forall k\in C, k \neq ls, i \neq k \label{eq.6} \\ &\sum_{j\in C} links_{k,j} &= 1 &\quad \forall k\in C, k \neq ls, j \neq k \label{eq.7} \\ &start\_time_{i} &\leq time\_window_{i,2} &\quad \forall i\in C \label{eq.8} \\ &start\_time_{i} &\geq time\_window_{i,1} &\quad \forall i\in C \label{eq.9} \\\end{aligned}\]
\[\begin{gathered} start\_time_{ls} \geq distance_{i,ls} + task\_duration_{i} + \\ \quad start\_time_{i} \quad \forall\, i\in C, i\neq ls \label{eq.10} \\\end{gathered}\]
\[\begin{gathered} start\_time_{i} + distance_{i,j} + task\_duration_{i} \leq start\_time_{j} + \\ (time\_window_{ls,2}-time\_window_{ls,1})\cdot (1-links_{i,j}) \quad \forall\, i,j\in C,\, i,j\neq ls, i\neq j \label{eq.11}\end{gathered}\]

Comentarios

  1. No sé si estará relacionado, pero este blog se ve como una página en negro en mi FireFox (en chrome se ve bien). Probado en Win7 + FireFox 57.0.2 y 57.0.3, con javascript enabled y sin ningún tipo de JavaScript addon.

    ResponderEliminar
  2. En aquesta entrada del blog hi ha una possible solució si utilitzes uBlock Origin amb Firefox: https://aguasmenores.blogspot.com.es/2017/12/ublock-origin-deshabilita-el-filtrado.html

    ResponderEliminar

Publicar un comentario