Home | Projects | Docs | Jargon

Bugzilla | LXR | Tree Status | Checkins

Feedback | FAQ | Search

MathML Demo: <mtable> - tables and matrices

NOTES:

1. Alternate stylesheets are available from: View → Page Style → STIX | Asana Math | MathJax
2. Right click on a MathML fragment and choose View MathML Source to get its source.
3. In the examples below, the text won't be allowed to decrease pass the scriptminsize or your browser's minimum allowable font size -- this can be set with Tools → Options → Content tab → Fonts & Colors → Advanced button → Minimum font size. To see the effect of the gradual decrease induced by changes in script levels more clearly, you may have to increase your default font size in the menu: Tools → Options → Content tab → Fonts & Colors → Size.
   • Here is how the alphabet looks like at scriptminsize: a, b, c ... x, y, z
   • Here is how greek letters look like at scriptminsize: α, β, γ ..., ψ, ω, ϑ, ϒ, ϖ
   • Here is how numbers look like at scriptminsize: 0, 1, 2, ..., 10, 11, 12, ...
4. You can use View → Zoom → Text Zoom only checked in the usual way to zoom the MathML text along with the other text.
5. The text written that way in the above remarks describes items in the menu bar. If you only see the Firefox menu, you can enable the menu bar with Firefox → Options → Menubar.

As a visual aid, the examples deliberately draw attention to the math axis and the baseline:
----------------------- this is the math axis
..................... this is the baseline

1. External vertical align is center $\text{---}\text{...}\begin{array}{|rcl|}\hline 1& 22& 333\\ \frac{4444}{x}& 55555& 666666\\ a& b& c\\ 7777777& 11& \\ \hline\end{array}\text{...}\text{---}$ , cols arg is "|r|c|l|", \hline's above and below. When align="center" or align="baseline", the middle of the table coincides with the baseline.
2. External vertical align is axis $\text{---}\text{...}\begin{array}{rcl}1& 22& 333\\ \frac{4444}{x}& 55555& \genfrac{}{}{0ex}{}{\underset{n\to \infty }{lim}{f}^{-1}\left(\bigcup _{i=1}^n{A}_i\right)}{\text{rowspan=2 here}}\\ \multicolumn{2}{c}{\genfrac{}{}{0ex}{}{\sqrt[n]{x^n+y^n}}{\text{columnspan=2 here}}}\\ 7777777& 11& \end{array}\text{...}\text{---}$, columnlines="solid", rowlines="dashed solid dashed". By default -- when the align attribute is not set, or when align="axis", the middle of the table coincides with the math axis.
3. External vertical align is top $\text{---}\text{...}\begin{array}{rcl}1& 22& 333\\ 4444& \frac{55555}{x+1}& 666666\\ a& b& c\\ 7777777& 11& \end{array}$ cols arg is"r|c:l".
4. External vertical align is bottom $\text{---}\text{...}\begin{array}{rcl}1& 22& 333\\ 4444& 55555& \frac{666666}{x^2}\\ a& b& c\\ 7777777& 11& \end{array}$ cols arg is "r|cl". MathML doesn't specify how to only display certain sides of the table border, as in "|rcl", but these can be obtained in Mozilla using the 'border' property of CSS, e.g., "|rcl" can be achieved with the CSS declaration "mtable { border-left: solid thin }".
5. Math axis test, using externally aligned arrays inside symmetric fences. $\text{---}\text{...}\left[\begin{array}{c}1\\ \frac{666666}{x^2}\\ c\\ \mathbf{\text{axis}}\end{array}\right]\left[\begin{array}{c}1\\ \frac{666666}{x^2}\\ c\\ \mathbf{\text{center}}\end{array}\right]+\lfloor \begin{array}{c}1\\ \frac{55555}{x+1}\\ c\\ \mathbf{\text{bottom}}\end{array}\rfloor +\lceil \begin{array}{c}1\\ \frac{4444}{x}\\ c\\ \mathbf{\text{top}}\end{array}\rceil +\parallel \begin{array}{c}1\\ \frac{4444}{\frac{4444}{{\displaystyle \frac{4444}{x}}}}\\ \mathbf{\text{center}}\end{array}\parallel$ post text.
6. Now for a display $$\text{---}\text{...}\begin{array}{|c|}\hline 1\\ \frac{4444}{\frac{4444}{{\displaystyle \frac{4444}{x}}}}\\ 7777777\\ \hline\end{array}$$ text after displayed math. Do you see which vertical alignment is set on that table?
7. Example of \begin{matrix} $\text{---}\text{...}\begin{array}{|cc|}\hline 0& 1\\ 1& 0\\ \hline\end{array}$ with 3 \hline's.
8. Example of \begin{smallmatrix} $\text{---}\text{...}\begin{array}{ccc}1& 2& 3\\ 4& 5& \end{array}$ obtained with scriptlevel="+1".
9. Example of \begin{pmatrix} $\text{---}\text{...}\left(\begin{array}{cc}0& -i\\ i& 0\end{array}\right)$ with an \hline after the first row.
10. Example of \begin{bmatrix} $\text{---}\text{...}\left[\begin{array}{cc}1& 0\\ 0& -1\end{array}\right]$
11. Example of \begin{vmatrix} $\text{---}\text{...}\left|\begin{array}{cc}a& b\\ c& d\end{array}\right|$
12. Example of \begin{Vmatrix} $\text{---}\text{...}\parallel \begin{array}{ccc}0& 1& 0\\ 11& 0& 111\\ 0& 1111& 0\end{array}\parallel$
13. Example of \begin{Bmatrix} $\text{---}\text{...}\left\{\begin{array}{ccc}1& 0& 1\\ 0& 11& \end{array}\right\}$
14. A fenced matrix and the equivalent \begin{bmatrix} $\text{---}\text{...}\left[\begin{array}{lr}a& bb\\ ccc& dddd\end{array}\right]\left[\begin{array}{cc}a& bb\\ ccc& dddd\end{array}\right]$ .
15. A table with align="axis2" to anchor the table externally w.r.t. the axis of the second row $\text{---}\text{...}\frac{a}{b}\begin{array}{cc}\alpha & \beta \\ \frac{a}{b}x& y\frac{a}{b}\\ \gamma & \delta \end{array}\frac{a}{b}\text{...}\text{---}$, but this is subject to variances due to style changes, e.g., from the scriptlevel. $\text{---}\text{...}\frac{a}{b}\begin{array}{cc}\alpha & \beta \\ \frac{a}{b}x& y\frac{a}{b}\\ \gamma & \delta \end{array}\frac{a}{b}\text{...}\text{---}$. Anyway, this is buggy in Mozilla because what you see above is a fallback to the rendering code used for the baseline case (see below).
16. A table with align="baseline -1" to anchor the table externally w.r.t. the baseline of the last row $\text{---}\text{...}\sqrt{d+p}\left(\begin{array}{cc}\alpha & \beta \\ \gamma & \delta \end{array}\right)\text{...}\text{---}$, neat isn't it? This would be pretty hard to obtain otherwise. Contrast it with the following which has align="bottom" $\text{---}\text{...}\sqrt{d+p}\left(\begin{array}{cc}\alpha & \beta \\ \gamma & \delta \end{array}\right)\text{...}\text{---}$, and with this one which has align="center -1" $\text{---}\text{...}\sqrt{d+p}\left(\begin{array}{cc}\alpha & \beta \\ \gamma & \delta \end{array}\right)\text{...}\text{---}$, but note that setting the baseline relative to a particular row is meaningless if the row doesn't have at least one cell with "rowalign=baseline" where to anchor the baseline (in which case Mozilla will behave as if it was align="center#rownumber").
17. These may sound like gimmicks until you want to get a damping effect such as this $\text{---}\text{...}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}$, or perhaps the reverse $\text{---}\text{...}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}\begin{array}{c}\frac{a}{b}\end{array}$, modulo pixel roundoff errors. Here 'a' and 'b' can be other combinations of possibly irregular boxes.
18. And making floating elements do a multiplication such as the following one which is anchored at a baseline is made simple by using align="baseline1" on both tables $$\left[\begin{array}{cccc}a& b& c& d\end{array}\right]\left[\begin{array}{c}a\\ b\\ c\\ d\end{array}\right]$$
19. To multiply a matrix A by a vector x, each row of the matrix has to be multiplied to the vector. So at the i-th step, it proceeds thus: $$i\text{-th row}\left[\begin{array}{ccccc}{a}_{11}& a_{12}& a_{13}& \dots & a_{1n}\\ ⋮& ⋮& ⋮& \dots & ⋮\\ a_{i1}& a_{i2}& a_{i3}& \dots & a_{in}\\ ⋮& ⋮& ⋮& & ⋮\\ a_{n1}& a_{n2}& a_{n3}& \dots & a_{nn}\end{array}\right]\left[\begin{array}{c}{x}_1\\ x_2\\ x_3\\ ⋮\\ x_n\end{array}\right]$$