MathJax - библиотека для отображения математических формул (краткий справочник)

Добавлено 17 октября 2015 в 18:37

MathJax позволяет включать математические формулы на web-страницы, используя разметку LaTeX, MathML или AsciiMath, после чего формулы будут обработаны javascript-библиотекой и преобразованы в HTML, SVG или MathML для отображения в любом современном браузере.

Сайт проекта: http://mathjax.org

В настоящее время MathJax позволяет использовать как копию данной библиотеки на собственном сервере, так и версию библиотеки из CDN cdn.mathjax.org:

<script type="text/javascript"
  src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>

Конфигурация TeX-AMS-MML_HTMLorMML является одним из самых общих (и, следовательно, самых больших) файлов конфигурации. Хотя использование данной конфигурации возможно и не эффективно, но здесь она приведена для возможности быстрого старта использования MathJax.

Краткий справочник

Так как разметка LaTeX показалась мне более лаконичной, далее описываются только вопросы по её использованию при работе с MathJax:

  1. чтобы увидеть, как написана любая из формул, кликните правой кнопкой мыши на выражении и выберите "Show Math As > TeX Commands" (символы разделителей не показываются);
  2. для отображения формулы в отдельном блоке заключите её в разделители $$...$$ или \[...\]\[\sum_{i=0}^n i^2 = \frac{(n^2+n)(2n+1)}{6}\]
  3. для отображения формулы внутри строки заключите её в разделители \(...\). Например, \(\sum_{i=0}^n i^2 = \frac{(n^2+n)(2n+1)}{6}\). Обратите внимание, что разделители $...$ по умолчанию не поддерживаются, так как одиночные знаки доллара могут появляться в тексте и вызывать ошибочное преобразование текста в формулу;
  4. для отображения букв греческого алфавита, используйте \alpha, \beta, …, \omega\(\alpha\)\(\beta\), …, \(\omega\). Для верхнего регистра используйте \Gamma, \Delta, …, \Omega\(\Gamma\)\(\Delta\), …, \(\Omega\);
  5. для верхних и нижних индексов используйте ^ и _. Например, x_i^2\(x_i^2\);
  6. группы. Верхний и нижний индексы, а также другие операции применяются только к следующей "группе". "Группой" является либо один символ, либо любая формула, заключенная в фигурные скобки {...}. Если вы выполните 10^10, то неожиданно получите \(10^10\). Но 10^{10} даст вам возможно то, что вы хотели: \(10^{10}\). Используйте фигурные скобки, чтобы выделить формулу, к которой применяется верхний или нижний регистр: x^5^6 вызовет ошибку; {x^y}^z соответствует \({x^y}^z\), и x^{y^z} соответствует \(x^{y^z}\). Заметьте отличие между x^i^2 \(x_i^2\) и x_{i^2} \(x_{i^2}\);
  7. скобки. Одиночные символы ()[] создают круглые и квадратные скобки \((2+3)[4+4]\). Используйте \{ и \} для отображения фигурных скобок \(\{\}\).
    Описанные выше скобки не масштабируются вместе с формулой. То есть, если вы напечатаете (\frac{\sqrt x}{y^3}), круглые скобки будут слишком маленькими: \((\frac{\sqrt x}{y^3})\). Использование \left( и \right) выполнит автоматическую подстройку размера скобок к размеру формулы, которую они окружают: \left(\frac{\sqrt x}{y^3}\right) соответствует \(\left(\frac{\sqrt x}{y^3}\right)\). \left и \right применяются ко всем следующим типам скобок: ( и ) \(\left(x\right)\), [ и ] \(\left[x\right]\), \{ и \} \(\left\{x\right\}\), | \(\left|x\right|\), \langle и \rangle \(\left\langle x\right\rangle\), \lceil и \rceil \(\left\lceil x\right\rceil\), и \lfloor и \rfloor \(\left\lfloor x\right\rfloor\).
    Есть также невидимые скобки, обозначенные .\left.\frac12\right\rbrace соответствует \(\left.\frac12\right\rbrace\);
  8. суммы и интегралы \sum и \int; нижний индекс соответствует нижнему  пределу, а верхний индекс - верхнему пределу. Например, \sum_1^n \(\sum_1^n\). Не забудьте {...}, если пределы состоят из более чем одного символа. Например, \sum_{i=0}^\infty i^2 соответствует \(\sum_{i=0}^\infty i^2\). Аналогично \prod \(\prod\), \int \(\int\), \bigcup \(\bigcup\), \bigcap \(\bigcap\), \iint \(\iint\);
  9. дроби. Существует два способа создать дробь. \frac ab применятся к следующим двум группам и генерирует следующее \(\frac ab\); для более сложных числителей и знаменателей используйте {...}: \frac{a+1}{b+1} соответствует \(\frac{a+1}{b+1}\). Если числитель и знаменатель слишком сложны, можно использовать \over, который разделяет группу, в которой находится: {a+1\over b+1} соответствует \({a+1\over b+1}\);
  10. шрифты
    • используйте \mathbb или \Bbb для полужирного шрифта для "черной доски": \(\mathbb{CHNQRZ}\);
    • используйте \mathbf для полужирного шрифта: \(\mathbf{ABCDEFGHIJKLMNOPQRSTUVWXYZ}\) \(\mathbf{abcdefghijklmnopqrstuvwxyz}\);
    • используйте \mathtt для шрифта "печатной машинки": \(\mathtt{ABCDEFGHIJKLMNOPQRSTUVWXYZ}\) \(\mathtt{abcdefghijklmnopqrstuvwxyz}\);
    • используйте \mathrm для "римского" шрифта: \(\mathrm{ABCDEFGHIJKLMNOPQRSTUVWXYZ}\) \(\mathrm{abcdefghijklmnopqrstuvwxyz}\);
    • используйте \mathsf для шрифта без засечек: \(\mathsf{ABCDEFGHIJKLMNOPQRSTUVWXYZ}\) \(\mathsf{abcdefghijklmnopqrstuvwxyz}\);
    • используйте \mathcal для "каллиграфического" написания: \(\mathcal{ ABCDEFGHIJKLMNOPQRSTUVWXYZ}\);
    • используйте \mathscr для "скриптового" шрифта (как бы написанного от руки): \(\mathscr{ABCDEFGHIJKLMNOPQRSTUVWXYZ}\);
    • используйте \mathfrak для шрифта "Fraktur" (старый немецкий стиль): \(\mathfrak{ABCDEFGHIJKLMNOPQRSTUVWXYZ} \mathfrak{abcdefghijklmnopqrstuvwxyz}\);
  11. знаки корня. Используйте \sqrt, который подстраивается к размеру аргумента: \sqrt{x^3} \(\sqrt{x^3}\)\sqrt[3]{\frac xy} \(\sqrt[3]{\frac xy}\). Для сложных выражений предпочтительнее использование {...}^{1/2};
  12. некоторые функции, такие как "lim", "sin", "max", "ln" и т.д., обычно используют "римский" (прямой) шрифт вместо "итальянского" (курсив). Используйте \lim, \sin и т.д., чтобы получить подобное: \sin x \(\sin x\), а не sin x \(sin x\). Используйте нижние индексы, чтобы прикрепить дополнительные надписи к \lim\lim_{x\to 0} \[\lim_{x\to 0}\]
  13. существует слишком большое количество специальных символов и обозначений, чтобы перечислить здесь из все. Вот некоторые из наиболее часто используемых:
    • \lt \gt \le \ge \neq \(\lt\, \gt\, \le\, \ge\, \neq\). Вы можете использовать \not, чтобы поместить косую черту почти на всё: \not\lt \(\not\lt\), но часто это выглядит некрасиво;
    • \times \div \pm \mp \(\times\, \div\, \pm\, \mp\). \cdot соответствует точке в центре: \(x \cdot y\);
    • \cup \cap \setminus \subset \subseteq \subsetneq \supset \in \notin \emptyset \varnothing \(\cup\, \cap\, \setminus\, \subset\, \subseteq \,\subsetneq \,\supset\, \in\, \notin\, \emptyset\, \varnothing\);
    • {n+1 \choose 2k} или \binom{n+1}{2k} \({n+1 \choose 2k}\);
    • \to \rightarrow \leftarrow \Rightarrow \Leftarrow \mapsto \(\to\, \rightarrow\, \leftarrow\, \Rightarrow\, \Leftarrow\, \mapsto\);
    • \land \lor \lnot \forall \exists \top \bot \vdash \vDash \(\land\, \lor\, \lnot\, \forall\, \exists\, \top\, \bot\, \vdash\, \vDash\);
    • \star \ast \oplus \circ \bullet \(\star\, \ast\, \oplus\, \circ\, \bullet\);
    • \approx \sim \simeq \cong \equiv \prec \(\approx\, \sim \, \simeq\, \cong\, \equiv\, \prec\);
    • \infty \aleph_0 \(\infty\, \aleph_0\) \nabla \partial \(\nabla\, \partial\) \Im \Re \(\Im\, \Re\);
    • для сравнений по модулю используйте \pmod, например, a\equiv b\pmod n \(a\equiv b\pmod n\);
    • \ldots соответствует многоточию в \(a_1, a_2, \ldots ,a_n\); \cdots соответствует многоточию в \(a_1+a_2+\cdots+a_n\);
    • у некоторых греческих букв есть форма написания для обозначения переменной: \epsilon \varepsilon \(\epsilon\, \varepsilon\), \phi \varphi \(\phi\, \varphi\) и т.д. "Скриптовая" (написанная от руки) l в нижнем регистре: \ell \(\ell\).
    Detexify позволяет нарисовать символ на web-странице, а затем перечисляет \(\TeX\) символы, которые напоминают нарисованный. Не гарантируется, что это будет работать и в MathJax, но это хорошее место для начала поиска. Чтобы проверить, поддерживается ли команда, обратите внимание на текущий список поддерживаемых \(\LaTeX\) команд на MathJax.org.
  14. пробелы. MathJax обычно сам решает, как использовать пробелы в формулах, используя комплексный набор правил. Печать дополнительных пробелов в формулах не изменит количество пробелов, которые добавит в формулу MathJax: a␣b и a␣␣␣␣b соответствуют \(a b\). Чтобы добавить больше пробелов, используйте \, для узкого пробела \(a\,b\) или \; для широкого пробела \(a\;b\). \quad и \qquad соответствуют большим пробелам \(a\quad b\)\(a\qquad b\).
    Чтобы использовать простой текст, используйте \text{...}\(\{x\in s\mid x\text{ is extra large}\}\);
  15. акценты и диакритические знаки. Используйте \hat для одиночного символа \(\hat x\), \widehat для формулы \(\widehat{xy}\) (но если вы сделаете символ слишком широким, это будет выглядеть нелепо). Аналогичным образом \bar \(\bar x\) и \overline \(\overline{xyz}\), и \vec \(\vec x\) и \overrightarrow \(\overrightarrow{xy}\) и \overleftrightarrow \(\overleftrightarrow {xy}\). Для точек, как \(\frac d{dx}x\dot x = \dot x^2 + x\ddot x\), используйте \dot и \ddot;
  16. специальные символы, используемые для интерпретации MathJax, могут быть экранированы, используя символ \: \$ \(\$\), \{ \(\{\), \_ \(\_\) и т.д. Если вам нужен символ \, вы должны использовать \backslash \(\backslash\), так как \\ соответствует новой строке.

Теги

ECMAScriptJavaScriptLaTeXMathJax

На сайте работает сервис комментирования DISQUS, который позволяет вам оставлять комментарии на множестве сайтов, имея лишь один аккаунт на Disqus.com.

В случае комментирования в качестве гостя (без регистрации на disqus.com) для публикации комментария требуется время на премодерацию.


  • 2020-04-28Ildus Smirnov

    Спасибо большое за статью, сейчас апрель 2020го, и на моём сайте все формулы отлично работают...

  • 2018-04-18Sebastiaan Scholtens

    \(хорошо\)
    $хорошо$

  • 2018-03-15Sebastiaan Scholtens

    если я например напишу в текстовом редакторе, или кому-то по чате, не работает

  • 2018-03-13radioprog

    А где не работало? На момент написания статьи (2015 год) всё работало на всех актуальных на тот момент версиях браузеров.

  • 2018-03-12Sebastiaan Scholtens

    Спасибо, только это не везде работает
    удобно