hugo-theme-more-contentful/exampleSite/content/en/articles/mathjax-support-for-asciidoctor.adoc
Gabriel Arazas 2f06fd7861 Initial release
All of the changes should be documented in the changelog.
2020-11-03 00:55:18 +08:00

7.3 KiB
Raw Blame History


title: "MathJax Support for Asciidoctor" date: 2019-08-28T01:47:02+08:00

categories: - "asciidoctor" tags: - "asciidoctor" - "mathjax" - "guide" ---

MathJax Support for Asciidoctor

Gabriel Arazas <foo.dogsquared@gmail.com> 2019-08-28 :stem: latexmath

This is just an article for testing MathJax in Asciidoctor files.

You can use this as a testing template for all of your LaTeX math needs.

Basics

This should be an inline math content \$\LaTeX\$ with the LaTeX symbol.

The following block content should contain a sentence with the LaTeX symbol.

\$\LaTeX\text{ is awesome.}\$

Whitespace

LaTeX treats whitespace characters such as tabs and spaces uniformly as one unit of space. A text that is composed of two tabs and 10 spaces consecutively is one space.

This is especially prominent in math mode (which MathJax is… always).

Try to render this, for example.

This is a LaTeX sentence (or I guess in MathJax).

And itll render as the following:

\$ This is a LaTeX sentence (or I guess in MathJax).\$

Since MathJax is in… perpetual math mode and specifically made for rendering math formulae, we shouldnt have a problem with maintaining it.

Just a heads up.

Commands

One of the main syntax you should mind in MathJax are the LaTeX commands. Think of it like the HTML tags in LaTeX (although not really).

Heres the basic construct of a LaTeX command:

\commandname[option1,option2,...]{argument1}{argument2}...

Within commands and if allowed, you can nest commands. Take this example for example:

\sum_{i=0}^{6} = \frac{i^{2}}{ 2 \bmod (i * 4)} + i^{3}
\$ \sum_{i=0}^{6} = \frac{i^{2}}{ 2 \bmod (i * 4)} + i^{3}\$

Reserved characters

The following characters have special meaning to LaTeX.

# $ % ^ & _ { } ~ \
\$# $ % ^ & _ { } ~ \\$

As you can see, it should result in an error or not rendered properly.

In order to render them in text, you need to add an escape character. In this case, its a backslash.

\# \$ \% \^ \& \_ \{ \} \~ \\
\$\# \$ \% \^{} \& \_ \{ \} \~{} \textbackslash{}\$
Note
Some of them may not render properly due to MathJax lack of support for the following. (We dont really need those when using MathJax anyway)

Text formatting

You can do a little text formatting in a LaTeX math content (though its pointless to do so).

Literal text

You can make a text with \text{}.

\text{The quick brown fox jumps over the lazy dog.}
\$\text{The quick brown fox jumps over the lazy dog.}\$

Boldface text

You can make a text boldface with \textbf{}.

\textbf{The quick brown fox jumps over the lazy dog.}
\$\textbf{The quick brown fox jumps over the lazy dog.}\$

Italic text

To make a text block italic, enclose it with a \textit{} command.

\textit{The quick brown fox jumps over the lazy dog.}
\$\textit{The quick brown fox jumps over the lazy dog.}\$

Monospaced text

In order for the text to be monospaced, enclose it with a \texttt{} (text teletype) command.

\texttt{The quick brown fox jumps over the lazy dog.}
\$\texttt{The quick brown fox jumps over the lazy dog.}\$

Text in sans-serif font equivalent

Most importantly, you can make a text rendered in sans-serif with \textsf{} command.

\textsf{The quick brown fox jumps over the lazy dog.}
\$\textsf{The quick brown fox jumps over the lazy dog.}\$

More options

You can see a lot more options from this reference.

Math formatting

This is what you mostly came for, right?

All righty then. Lets see what MathJax in Asciidoctor (M in A?) can do.

Fractions

For rendering fractions, you need to use the \frac command. The command simply needs two positional arguments.

\frac{NUMERATOR}{DENOMINATOR}

For a bit of an example:

\frac{x_1 + y_2}{x_2 + y_1}
\$\frac{x_1 + y_2}{x_2 + y_1}\$

Roots

In order to create roots, you need the \sqrt command. It only needs the content to be put inside of it as the argument.

\sqrt{2a + b}
\$\sqrt{2a + b}\$

Yes, you can nest some stuff.

\sqrt{\frac{2a + b}{a^2 - b^2}}
\$\sqrt{\frac{2a + b}{a^2 - b^2}}\$

You can specify an optional argument to change the magnitude.

\sqrt[\frac{1}{2}]{2a + b}
\$\sqrt[\frac{1}{2}]{2a + b}\$

Superscripts

In order to make superscripts, place it next to a caret character (^). To render it in more than one character, enclose it in curly brackets ({}).

2^2 * 2^{23} = 2^{25}
\$2^2 * 2^{23} = 2^{25}\$

You can also nest it within a superscript like so.

2^{2^{10}} * 2^{23^2} = \infty
\$ 2^{2^{10}} * 2^{23^2} = \infty\$

OK, Ive gone overboard with the scale so I just put infinity as the answer instead.

Subscripts

For making subscripts, place it next to the underscore (_). Like the superscript command, if you include more than one character, enclose it in a pair of curly brackets ({}).

a_1 + a_2 + a_3 + ... + a_{14} = \frac{a_1 * a_{14}}{2}
\$a_1 + a_2 + a_3 + ... + a_{14} = \frac{a_1 * a_{14}}{2}\$

Like superscripts and most of the commands, you can nest subscripts to another subscript (and other commands).

a_{2_{1}} + a_{2_{2}} = b_{2_{1}} + b_{2_{2}}
\$ a_{2_{1}} + a_{2_{2}} = b_{2_{1}} + b_{2_{2}}\$

Greek letters

You can render Greek letters with the appropriate command.

\alpha for lowercase Greek letter alpha, \beta for lowercase Greek letter beta, \gamma for lowercase Greek letter gamma, \Gamma for uppercase Greek letter gamma, you get the point.

\alpha, \beta, \gamma, \Gamma, \pi, \Pi, \phi, \varphi, \mu, \Phi
\$\alpha, \beta, \gamma, \Gamma, \pi, \Pi, \phi, \varphi, \mu, \Phi\$

Mathematical sizing

Oftentimes, you might need to align and resize certain characters like the parenthesis or the brackets that enclose a formula or an example.

You can use the \left, \right, and \middle commands to resize the delimiters.

\left(\frac{x^2}{y^3}\right)
\$\left(\frac{x^2}{y^3}\right)\$

Since curly braces have semantic meaning to \$\LaTeX\$, you need to escape it. Pretty much, itll look like this:

\left\{\frac{x^2}{y^3}\right\}
\$\left\{\frac{x^2}{y^3}\right\}\$

A lot more!

You have a whole slew of mathematical symbols available. Please refer to this list of LaTeX mathematical symbols. Though I dont know whats missing symbols and whatnot (since I dont MathJax often) but it should be enough.

You can also go to this web page that details using MathJax on Quora by Gilles Castel. It is specifically made for writing \$\LaTeX\$ on Quora but it can be used as a general MathJax guide, anyways.