KaTeX — Математические формулы на сайт

Довольно часто нужно вывести на сайт какое-то математическое выражение. И все ничего пока это просто дробь и многочлен, но с интегралами и прочим восьмиэтажным добром приходит тоска. Делать гору картинок очень не удобно, тем более что есть вариант по интереснее.

Что если хранить формулы в TeX нотации, а пользователю предлагать обрисованный JavaScript`ом вариант?
Этим и занимается KaTeX — js библиотека для рендеринга математических выражений.

Пользоваться ей очень просто. Качаем с github файлы katex.min.css, katex.min.js и каталог с шрифтами.
Добавляем на страницу.

<script src="katex.min.js" type="text/javascript"></script>
<link href="katex.min.css" rel="stylesheet" type="text/css">

Размещаем на страницу парочку тегов pre с классом katex. Можно и иначе, это мой подход.

<pre class="katex">f(x) = \int_{-\infty}^\infty \hat f(\xi),e^{2 \pi i \xi x}\,d\xi</pre>
<pre class="katex">
        f(x) = \sum \dot f(\lambda) e^{2 \pi i \mu x}\,d\Omega
</pre>

И в конец страницы JavaScript, который заменяет код внутри тегов pre с классом katex отрендеренный html код.
Смотреть пример.

 

Похожий код:

Фото аватара
Алексей Петров

Программист, разработчик с 5 летним опытом работы. Учусь на разработчика игр на Unity и разработчика VR&AR реальности (виртуальной реальности). Основные языки программирования: C#, C++.

Оцените автора
Бла, бла код
Добавить комментарий