MediaWiki and TeX

edit

MediaWiki uses a subset of TeX markup (including some extensions from LaTeX and AMSLaTeX) for mathematical formulae. It generates either PNG images or simple HTML markup, depending on user preferences and the complexity of the expression. In the future, as more browsers are smarter, it will be able to generate enhanced HTML or even MathML in many cases.

More precisely, MediaWiki filters the markup through Texvc, which in turn passes the commands to TeX for the actual rendering. Thus, only a limited part of the full TeX language is supported; see below for details.

Syntax

edit

Math markup goes inside <math> ... </math>. The edit toolbar has a button for this.

Similarly to HTML, in TeX extra spaces and newlines are ignored.

MediaWiki templates, variables and parameters cannot be used within math tags, see m:Template talk:Demo of attempt to use parameters within TeX.

Rendering

edit

The PNG images are black on white (not transparent). These colors, as well as font sizes and types, are independent of browser settings or CSS. Font sizes and types will often deviate from what HTML renders. Vertical alignment with the surrounding text can also be a problem. The css selector of the images is img.tex.

It should be pointed out that most of these shortcomings have been addressed by Maynard Handley, but have not been released yet.

The alt attribute of the PNG images (the text that is displayed if your browser can't display images; Internet Explorer shows it up in the hover box) is the wikitext that produced them, excluding the <math> and </math>.

Apart from function and operator names, as is customary in mathematics for variables, letters are in italics; digits are not. For other text, (like variable labels) to avoid being rendered in italics like variables, use \mbox or \mathrm. For example, <math>\mbox{abc}</math> gives  .

TeX vs HTML

edit

Before introducing TeX markup for producing special characters, it should be noted that, as this comparison table shows, sometimes similar results can be achieved in HTML (see Help:Special characters).

TeX Syntax (forcing PNG) TeX Rendering HTML Syntax HTML Rendering
<math>\alpha\,</math>   &alpha; α
<math>\sqrt{2}</math>   &radic;2 √2
<math>\sqrt{1-e^2}</math>   &radic;(1-''e''&sup2;) √(1-e²)

The use of HTML instead of TeX is still under discussion. The arguments either way can be summarised as follows.

Pros of HTML

edit
  1. In-line HTML formulae always align properly with the rest of the HTML text.
  2. The formula's background, font size and face match the rest of HTML contents and the appearence respects CSS and browser settings.

Pros of TeX

edit
  1. TeX is semantically superior to HTML. In TeX, "<math>x</math>" means "mathematical variable  ", whereas in HTML "x" could mean anything. Information has irremediably been lost.
  2. TeX has been specifically designed for typesetting formulae, so input is easier and more natural, and output is more aesthetically pleasing. Also anybody who has written mathematics at a professional level is already familiar with TeX.
  3. One consequence of point 1 is that TeX can be transformed in HTML, but not vice-versa. This means that on the server side we can always transform a formula, based on its complexity and location within the text, user preferences, type of browser, etc. Therefore, where possible, all the benefits of HTML can be retained, together with the benefits of TeX. It's true that the current situation is not ideal, but that's not a good reason to drop information/contents. It's more a reason to help improve the situation.
  4. When writing in TeX, editors need not worry about whether this or that version of this or that browser supports this or that HTML entity. The burden of these decisions is put on the server. This doesn't hold for HTML formulae, which can easily end up being rendered wrongly or differently from the editor's intentions on a different browser.

Functions, symbols, special characters

edit
Feature Syntax How it looks rendered
Accents/Diacritics
\acute{a} \quad \grave{a} \quad \breve{a}
\check{a} \quad \tilde{a} \quad \hat{a}
 

 

Std. functions (good)
\sin x + \ln y +\operatorname{sgn} z
\sin a \ \cos b \ \tan c
\cot d \ \sec e \ \csc f
\sinh g \ \cosh h \ \tanh i \ \coth j
\arcsin k \ \arccos l \ \arctan m
\lim n \ \limsup o \ \liminf p
\min q \ \max r \ \inf s \ \sup t
\exp u \ \lg v \ \log w
\ker x \ \deg x \gcd x \Pr x
\det x \hom x \ \arg x \dim x
 

 
 
 
 
 
 
 
 
 

Std. functions (wrong)
sin x + ln y + sgn z
 
Modular arithmetic
s_k \equiv 0 \pmod{m}
a \bmod b
 

 

Derivatives
\nabla \; \partial x \; dx \; \dot x \; \ddot y
 
Sets

(Square symbols may not work for some wikis)

\forall \; \exists \; \empty \; \emptyset \; \varnothing
\in \ni \not\in \notin \subset \subseteq
\supset \supseteq \cap \bigcap \cup \bigcup \biguplus
 

 
 

\sqsubset \sqsubseteq \sqsupset \sqsupseteq
\sqcap \sqcup \bigsqcup
 

 

Logic
p \land \wedge \; \bigwedge \; \bar{q} \to p
\lor \; \vee \; \bigvee \; \lnot \; \neg q
\setminus \; \smallsetminus
 

 
 

Root
\sqrt{2}\approx 1.4
 
\sqrt[n]{x}
 
Relations
\sim \; \approx \; \simeq \; \cong
\le \; < \; \ll \; \gg \; \ge >
\equiv \; \not\equiv \; \ne \; \propto
\pm \; \mp
 

 
 
 

Geometric
\Diamond \; \Box \; \triangle \; \angle \; \perp 
\; \mid \; \nmid \; \| \; 45^\circ
 
Arrows

(Harpoons may not work for some wikis)

\leftarrow \; \gets \; \rightarrow \; \to
\leftrightarrow \; \longleftarrow \; \longrightarrow
\mapsto \; \longmapsto
\hookrightarrow \; \hookleftarrow
\nearrow \; \searrow \; \swarrow \; \nwarrow
\uparrow \; \downarrow \; \updownarrow
 

 
 
 
 
 

\rightharpoonup \; \rightharpoondown 
\; \leftharpoonup \; \leftharpoondown 
\; \upharpoonleft \; \upharpoonright 
\; \downharpoonleft \; \downharpoonright
 
\Leftarrow \; \Rightarrow \; \Leftrightarrow
\Longleftarrow \; \Longrightarrow
\Longleftrightarrow (or \iff)
\Uparrow \; \Downarrow \; \Updownarrow
 

 
 
 

Special
\eth \; \S \; \P \; \% \; \dagger \; \ddagger
\star \; * \; \ldots \smile \frown \wr
 

 

\oplus \bigoplus \otimes \bigotimes
\times \cdot \circ \bullet \bigodot
 

 

\triangleleft \triangleright \infty \bot \top
\vdash \vDash \Vdash \models \lVert \rVert
 

 

\imath \; \hbar \; \ell \; \mho \; \Finv
\Re \; \Im \; \wp \; \complement
 

 

\diamondsuit \; \heartsuit \; \clubsuit \; \spadesuit
\Game \; \flat \; \natural \; \sharp
 

 

Lowercase \mathcal has some extras
\mathcal {45abcdenpqs}
 

Subscripts, superscripts, integrals

edit
Feature Syntax How it looks rendered
HTML PNG
Superscript
a^2
   
Subscript
a_2
   
Grouping
a^{2+2}
   
a_{i,j}
   
Combining sub & super
x_2^3
 
Preceding sub & super
{}_1^2\!X_3^4
 
Derivative (forced PNG)
x', y'', f', f''\!
   
Derivative (f in italics may overlap primes in HTML)
x', y'', f', f''
   
Derivative (wrong in HTML)
x^\prime, y^{\prime\prime}
   
Derivative (wrong in PNG)
x\prime, y\prime\prime
   
Derivative dots
\dot{x}, \ddot{x}
 
Underlines, overlines, vectors
\hat a \ \bar b \ \vec c
 
\overrightarrow{a b} \ \overleftarrow{c d} \ \widehat{d e f}
 
\overline{g h i} \ \underline{j k l}
 
Overbraces
\begin{matrix} 5050 \ \overbrace{ 1+2+\cdots+100 } \end{matrix}
 
Underbraces
\begin{matrix} \underbrace{ a+b+\cdots+z } \ 26 \end{matrix}
 
Sum
\sum_{k=1}^N k^2
 
Sum (force \textstyle)
\begin{matrix} \sum_{k=1}^N k^2 \end{matrix}
 
Product
\prod_{i=1}^N x_i
 
Product (force \textstyle)
\begin{matrix} \prod_{i=1}^N x_i \end{matrix}
 
Coproduct
\coprod_{i=1}^N x_i
 
Coproduct (force \textstyle)
\begin{matrix} \coprod_{i=1}^N x_i \end{matrix}
 
Limit
\lim_{n \to \infty}x_n
 
Limit (force \textstyle)
\begin{matrix} \lim_{n \to \infty}x_n \end{matrix}
 
Integral
\int_{-N}^{N} e^x\, dx
 
Integral (force \textstyle)
\begin{matrix} \int_{-N}^{N} e^x\, dx \end{matrix}
 
Double integral
\iint_{D}^{W} \, dx\,dy
 
Triple integral
\iiint_{E}^{V} \, dx\,dy\,dz
 
Quadruple integral
\iiiint_{F}^{U} \, dx\,dy\,dz\,dt
 
Path integral
\oint_{C} x^3\, dx + 4y^2\, dy
 
Intersections
\bigcap_1^{n} p
 
Unions
\bigcup_1^{k} p
 

Fractions, matrices, multilines

edit
Feature Syntax How it looks rendered
Fractions \frac{2}{4}=0.5 or {2 \over 4}=0.5  
Small Fractions (force \textstyle) \begin{matrix} \frac{2}{4} \end{matrix} = 0.5  
Binomial coefficients {n \choose k}  
Matrices \begin{matrix} x & y \\ z & v \end{matrix}  
\begin{vmatrix} x & y \\ z & v \end{vmatrix}  
\begin{Vmatrix} x & y \\ z & v \end{Vmatrix}  
\begin{bmatrix} 0 & \cdots & 0 \\ \vdots &

\ddots & \vdots \\ 0 & \cdots &

0\end{bmatrix}
 
\begin{Bmatrix} x & y \\ z & v \end{Bmatrix}  
\begin{pmatrix} x & y \\ z & v \end{pmatrix}  
Case distinctions f(n) = \begin{cases} n/2, & \mbox{if }n\mbox{ is even} \\ 3n+1, & \mbox{if }n\mbox{ is odd} \end{cases}  
Multiline equations \begin{matrix}f(n+1) & = & (n+1)^2 \\ \ & = & n^2 + 2n + 1 \end{matrix}  
Alternative multiline equations (using tables)

{|
|-
|<math>f(n+1)</math>
|<math>=(n+1)^2</math>
|-
|
|<math>=n^2 + 2n + 1</math>
|}

   
 

Fonts

edit
Feature Syntax How it looks rendered
Greek alphabet
(Note the lack of omicron; note also that several upper case Greek letters are rendered identically to the corresponding Roman ones)

\Alpha\ \Beta\ \Gamma\ \Delta\ \Epsilon\ \Zeta\ \Eta\ \Theta\ \Iota\ \Kappa\ \Lambda\ \Mu\ \Nu\ \Xi\ \Pi\ \Rho\ \Sigma\ \Tau\ \Upsilon\ \Phi\ \Chi\ \Psi\ \Omega

\alpha\ \beta\ \gamma\ \delta\ \epsilon\ \zeta\ \eta\ \theta\ \iota\ \kappa\ \lambda\ \mu\ \nu\ \xi\ \pi\ \rho\ \sigma\ \tau\ \upsilon\ \phi\ \chi\ \psi\ \omega

\varepsilon\ \digamma\ \vartheta\ \varkappa\ \varpi\ \varrho\ \varsigma\ \varphi

 

 

 

blackboard bold \mathbb{N}\ \mathbb{Z}\ \mathbb{Q}\ \mathbb{R}\ \mathbb{C}  
boldface (vectors) \mathbf{x}\cdot\mathbf{y} = 0  
boldface (greek) \boldsymbol{\alpha} + \boldsymbol{\beta} + \boldsymbol{\gamma}  
italics \mathit{ABCDE abcde 1234}  
Roman typeface \mathrm{ABCDE abcde 1234}  
Fraktur typeface \mathfrak{ABCDE abcde 1234}  
Calligraphy/Script \mathcal{ABCDE abcde 1234}  
Hebrew \aleph \beth \gimel \daleth  
non-italicised characters \mbox{abc}    
mixed italics (bad) \mbox{if} n \mbox{is even}    
mixed italics (good) \mbox{if }n\mbox{ is even}    

Parenthesizing big expressions, brackets, bars

edit
Feature Syntax How it looks rendered
Bad ( \frac{1}{2} )  
Good \left ( \frac{1}{2} \right )  

You can use various delimiters with \left and \right:

Feature Syntax How it looks rendered
Parentheses \left ( \frac{a}{b} \right )  
Brackets \left [ \frac{a}{b} \right ] \quad \left \lbrack \frac{a}{b} \right \rbrack  
Braces \left \{ \frac{a}{b} \right \} \quad \left \lbrace \frac{a}{b} \right \rbrace  
Angle brackets \left \langle \frac{a}{b} \right \rangle  
Bars and double bars \left | \frac{a}{b} \right \vert \left \Vert \frac{c}{d} \right \|  
Floor and ceiling functions: \left \lfloor \frac{a}{b} \right \rfloor \left \lceil \frac{c}{d} \right \rceil  
Slashes and backslashes \left / \frac{a}{b} \right \backslash  
Up, down and up-down arrows \left \uparrow \frac{a}{b} \right \downarrow \quad \left \Uparrow \frac{a}{b} \right \Downarrow \quad \left \updownarrow \frac{a}{b} \right \Updownarrow  

Delimiters can be mixed,
as long as \left and \right match

\left [ 0,1 \right )
\left \langle \psi \right |

 
 

Use \left. and \right. if you don't
want a delimiter to appear:
\left . \frac{A}{B} \right \} \to X  
Size of the delimiters \big( \Big( \bigg( \Bigg( ... \Bigg] \bigg] \Big] \big]

 

\big\{ \Big\{ \bigg\{ \Bigg\{ ... \Bigg\rangle \bigg\rangle \Big\rangle \big\rangle

 

\big\| \Big\| \bigg\| \Bigg\| ... \Bigg| \bigg| \Big| \big|  
\big\lfloor \Big\lfloor \bigg\lfloor \Bigg\lfloor ... \Bigg\rceil \bigg\rceil \Big\rceil \big\rceil

 

\big\uparrow \Big\uparrow \bigg\uparrow \Bigg\uparrow ... \Bigg\Downarrow \bigg\Downarrow \Big\Downarrow \big\Downarrow

 

\big\updownarrow \Big\updownarrow \bigg\updownarrow \Bigg\updownarrow ... \Bigg\Updownarrow \bigg\Updownarrow \Big\Updownarrow \big\Updownarrow

 

\big / \Big / \bigg / \Bigg / ... \Bigg\backslash \bigg\backslash \Big\backslash \big\backslash

 

Spacing

edit

Note that TeX handles most spacing automatically, but you may sometimes want manual control.

Feature Syntax How it looks rendered
double quad space a \qquad b  
quad space a \quad b  
text space a\ b  
text space without PNG conversion a \mbox{ } b  
large space a\;b  
medium space a\>b [not supported]
small space a\,b  
no space ab  
small negative space a\!b  

Align with normal text flow

edit

Due to the default css

img.tex { vertical-align: middle; }

an inline expression like   should look good.

If you need to align it otherwise, use <span style="vertical-align:-100%;"><math>...</math></span>> and play with the vertical-align argument until you get it right; however, how it looks may depend on the browser and the browser settings.

Also note that if you rely on this workaround, if/when the rendering on the server gets fixed in future releases, as a result of this extra manual offset your formulae will suddenly be aligned incorrectly. So use it sparingly, if at all.

Forced PNG rendering

edit

To force the formula to render as PNG, add \, (small space) at the end of the formula (where it is not rendered). This will force PNG if the user is in "HTML if simple" mode, but not for "HTML if possible" mode (math rendering settings in preferences).

You can also use \,\! (small space and negative space, which cancel out) anywhere inside the math tags. This does force PNG even in "HTML if possible" mode, unlike \,.

This could be useful to keep the rendering of formulae in a proof consistent, for example, or to fix formulae that render incorrectly in HTML (at one time, a^{2+2} rendered with an extra underscore), or to demonstrate how something is rendered when it would normally show up as HTML (as in the examples above).

For instance:

Syntax How it looks rendered
a^{c+2}  
a^{c+2} \,  
a^{\,\!c+2}  
a^{b^{c+2}}   (WRONG with option "HTML if possible or else PNG"!)
a^{b^{c+2}} \,   (WRONG with option "HTML if possible or else PNG"!)
a^{b^{c+2}}\approx 5   (due to " " correctly displayed, no code "\,\!" needed)
a^{b^{\,\!c+2}}  
\int_{-N}^{N} e^x\, dx  


This has been tested with most of the formulae on this page, and seems to work perfectly.

You might want to include a comment in the HTML so people don't "correct" the formula by removing it:

<!-- The \,\! is to keep the formula rendered as PNG instead of HTML. Please don't remove it.-->

Examples

edit

Quadratic Polynomial

edit
 

<math>ax^2 + bx + c = 0</math>

Quadratic Polynomial (Force PNG Rendering)

edit
 

<math>ax^2 + bx + c = 0\,</math>

Quadratic Formula

edit
 

<math>x_{1,2}=\frac{-b\pm\sqrt{b^2-4ac}}{2a}</math>

Tall Parentheses and Fractions

edit
 

<math>2 = \left( \frac{\left(3-x\right) \times 2}{3-x} \right)</math>

Integrals

edit
 

<math>\int_a^x \int_a^s f(y)\,dy\,ds = \int_a^x f(y)(x-y)\,dy</math>

Summation

edit
 

<math>\sum_{m=1}^\infty\sum_{n=1}^\infty\frac{m^2\,n}
{3^m\left(m\,3^n+n\,3^m\right)}</math>

Differential Equation

edit
 

<math>u'' + p(x)u' + q(x)u=f(x),\quad x>a</math>

Complex numbers

edit
 

<math>|\bar{z}| = |z|, |(\bar{z})^n| = |z|^n, \arg(z^n) = n \arg(z)\,</math>

Limits

edit
 

<math>\lim_{z\rightarrow z_0} f(z)=f(z_0)\,</math>

Integral Equation

edit
 

<math>\phi_n(\kappa) = \frac{1}{4\pi^2\kappa^2} \int_0^\infty
\frac{\sin(\kappa R)}{\kappa R} \frac{\partial}{\partial R}\left[R^2\frac{\partial
D_n(R)}{\partial R}\right]\,dR</math>

Example

edit
 

<math>\phi_n(\kappa) = 
0.033C_n^2\kappa^{-11/3},\quad \frac{1}{L_0}\ll\kappa\ll\frac{1}{l_0}\,</math>

Continuation and cases

edit
 

<math>f(x) = \begin{cases}1 & -1 \le x < 0\\
\frac{1}{2} & x = 0\\x&0<x\le 1\end{cases}</math>

Prefixed subscript

edit
 

 <math>{}_pF_q(a_1,...,a_p;c_1,...,c_q;z) = \sum_{n=0}^\infty
\frac{(a_1)_n\cdot\cdot\cdot(a_p)_n}{(c_1)_n\cdot\cdot\cdot(c_q)_n}\frac{z^n}{n!}\,</math>

Bug reports

edit

Discussions, bug reports and feature requests should go to the Wikitech-l mailing list. These can also be filed on Mediazilla under MediaWiki extensions.

See also

edit
edit