Библиотека для быстрого написания формул на javascript.
![Библиотека для быстрого написания формул на javascript.](/images/articles/js-math-library.png)
Всем привет! Сегодня мы рассмотрим очень интересную библиотеку для быстрого написания математических формул.
Общая информация
Библиотека эта создана довольно известной компанией KhanAcademy, и называется она Katex.
Преимущества ее в следующем:
- Быстрая. Katex отрисовывает формулы синхронно
- Качественная. Katex придерживается золотого стандарта для топографического набора
- Автономная. Katex не имеет зависимостей и легко может быть связана с ресурсами вашего сайта
- Поддерживает отрисовку на стороне сервера. Katex производит одинаковый вывод, несмотря на окружение бразуера, так что вы можете отрисовать ваши выражения на сервере, используя NodeJS, а затем отправить их как текст HTML
Посмотреть пример использования вы можете прямо на главной странице сайта. Какие команды поддерживаются написано здесь.
Подключение
Вы можете скачать Katex и разместить ее на вашем сервере или подключить katex.min.js и katex.min.css файлы на вашей странице с помощью CDN
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/katex.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/katex.min.js"></script>
Использование
Чтобы отрисовать формулы в браузере, вызовите katex.render с нужным Tex выражением и DOM элементом:
katex.render("c = \\pm\\sqrt{a^2 + b^2}", element);
Чтобы отрисовать формулы на стороне сервера, вы можете использовать katex.renderToString:
var html = katex.renderToString("c = \\pm\\sqrt{a^2 + b^2}");
// '<span class="katex">...</span>'
Убедитесь, что подключены css файлы и файлы со шрифтами, но не обязательно подключать javascript. Как и render, renderToString вызовит исключение, если не сможет спарсить выражение.
Вы можете настроить автоматическую отрисовку. Как это сделать, почитайте в этой статье.
Итак, на этом все. Спасибо за внимание!
-
-
Михаил Русаков
Комментарии (1):
Спасибо автору за статью. Вопрос: как отобразить результат построения формулы с помощью Katex на canvas используя JavaScript ?
Ответить
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.