Эта страница объясняет, как записать математические выражения при помощи языка MathML. Подобно HTML, основными элементами языка MathML являются теги и атрибуты. Документ HTML становится сложным, когда он содержит структуры, подобные спискам или таблицам, но, к счастью, существует много генераторов на основе простых систем обозначений, WYSIWYG редакторы и другие системы управления контентом, помогающие создавать Web страницы.
Математические обозначения ещё более сложны со структурами такими, как дроби, квадратные корни или матрицы, которые, вероятно, потребуют собственных тегов. Поэтому инструменты разработки, связанные с MathML, очень важны. Некоторые из этих инструментов мы описываем ниже. В частности, команда Mozilla MathML разрабатывала TeXZilla (Javascript Unicode LaTeX-to-MathML конвертер), который предназначен для использования во многих сценариях, описанных здесь. Конечно, этот список ни в коем случае не является исчерпывающим и вам предлагается проверить W3C MathML software list, где вы можете найти некоторые другие инструменты.
Заметим, что MathML хорошо интегрирован в HTML5. В частности, вы можете использовать обычные Web-инструменты, такие как CSS, DOM, Javascript или SVG. Данная тема выходит за рамки этого документа, но любой, у кого есть базовые знания Web-языков, сможет легко совместить эти инструменты с MathML. Ознакомьтесь с нашими примерами и справочными данными по MathML для получения более подробной информации.
Вы можете использовать Presentation MathML внутри документов HTML5:
<!DOCTYPE html> <html> <head> <title>MathML in HTML5</title> </head> <body> <h1>MathML in HTML5</h1> <p> Square root of two: <math> <msqrt> <mn>2</mn> </msqrt> </math> </p> </body> </html>
Content MathML не поддерживается браузерами. Рекомендуется преобразовать ваш макет из Content MathML в Presentation MathML перед его публикацией, например, с помощью таблицы стилей ctop.xsl . Инструменты, упомянутые на этой странице, генерируют Presentation MathML.
К сожалению, некоторые браузеры не могут отображать выражения MathML или имеют ограниченную поддержку. Следовательно, вам нужно будет использовать полифил MathML, чтобы обеспечить некоторый резервный рендеринг. Если вам нужны только базовые математические конструкции, такие как те, которые используются в этой MDN wiki, тогда небольшой таблицы стилей mathml.css возможно будет достаточно. Для её использования, просто вставьте одну строку в заголовок вашего документа:
<script src="http://fred-wang.github.io/mathml.css/mspace.js"></script>
Если вам нужны более сложные конструкции, тогда вы можете вместо этого использовать более содержательную библиотеку MathJax как полифил MathML:
<script src="http://fred-wang.github.io/mathjax.js/mpadded-min.js"></script>
Обратите внимание, что эти два скрипта распознают элементы mspace или mpadded (см. Таблицу совместимости браузера на этих страницах). Существует также подобный скрипт, отображающий предупреждение в верхней части страницы для браузеров без хорошей поддержки MathML и позволяющий пользователям выбрать один из вариантов действий:
<script src="http://fred-wang.github.io/mathml-warning.js/mpadded-min.js"></script>
Если вы не хотите использовать эту ссылку на GitHub, но вместо этого хотите интегрировать эти полифилы или нечто другое в свой проект, тогда вам может понадобиться скрипт, проверяющий уровень поддержки MathML. Например, следующая функция проверяет поддержку MathML путём тестирования элемента mspace (вы можете заменить mspace на mpadded):
function hasMathMLSupport() {
var div = document.createElement("div"), box;
div.innerHTML = "<math><mspace height='23px' width='77px'/></math>";
document.body.appendChild(div);
box = div.firstChild.firstChild.getBoundingClientRect();
document.body.removeChild(div);
return Math.abs(box.height - 23) <= 1 && Math.abs(box.width - 77) <= 1;
}
В качестве альтернативы, следующий анализ строки UA позволит определить движок рендеринга с родной поддержкой MathML (Gecko и WebKit). Обратите внимание, что анализ строки UA является не самым надёжным методом и может сбоить от версии к версии:
var ua = navigator.userAgent;
var isGecko = ua.indexOf("Gecko") > -1 && ua.indexOf("KHTML") === -1 && ua.indexOf('Trident') === -1;
var isWebKit = ua.indexOf('AppleWebKit') > -1 && ua.indexOf('Chrome') === -1;
Для того, чтобы получить хорошую разметку или обеспечить нужный стиль, важно иметь математические шрифты. Всегда полезно обеспечить ссылку на инструкцию по шрифтам MDN , чтобы ваши посетители могли проверить - установлены ли соответствующие шрифты в их системе. Хорошо также, если будет создана резервная копия веб-шрифтов.
До Gecko 31.0 {{GeckoRelease("31.0")}} было утомительно устанавливать математические шрифты (смотрите инструкцию по установке шрифтов для Mozilla 2.0). Для Gecko 31.0 {{GeckoRelease("31.0")}} это намного проще и совместимо со всеми движками Web рендеринга с поддержкой MathML. Например, здесь представлена минимальная таблица стилей для использования шрифта Latin Modern для текста и шрифта Latin Modern Math для математических выражений:
@namespace url('http://www.w3.org/1999/xhtml');
@namespace m url('http://www.w3.org/1998/Math/MathML');
body, m|mtext {
font-family: Latin Modern;
}
m|math {
font-family: Latin Modern Math;
}
Затем вы можете использовать правило @font-face, как обычно, для обеспечения выбора WOFF для Latin Modern и Latin Modern Math. Смотрите репозиторий GitHub с WOFF шрифтами и примерами таблиц стилей CSS для использования на вашем Web-сайте, а также этот ресурс с тестами.
Если по какой-то причине вам нужно использовать MathML в документах XML, обязательно выполняйте обычные требования: хорошо сформированный документ, использование правильного MIME-типа, пространство имён MathML "http://www.w3.org/1998/Math/MathML" с корневым элементом <math>. Например, версия XHTML предыдущего примера выглядит так:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" "http://www.w3.org/Math/DTD/mathml2/xhtml-math11-f.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>XHTML+MathML Example</title> </head> <body> <h1>Пример XHTML+MathML</h1> <p> Квадратный корень из двух: <math xmlns="http://www.w3.org/1998/Math/MathML"> <msqrt> <mn>2</mn> </msqrt> </math> </p> </body> </html>
Современные почтовые клиенты могут посылать и получать электронные сообщения в формате HTML5, то есть в них можно использовать выражения MathML. Обязательно включите опции "отправить как HTML" и "просмотреть как HTML". В Thunderbird вы можете использовать команду "Вставить HTML", чтобы вставить код HTML + MathML. MathBird - удобное дополнение для Thunderbird для вставки таких выражений MathML с использованием синтаксиса ввода AsciiMath. Кроме того, поле ввода LaTeX-to-MathML также было интегрировано в SeaMonkey с версии 2.28 и в Thunderbird с версии 31. С другой стороны, обработка кода MathML и качество рендеринга MathML зависит от почтового клиента. Даже если ваш браузер поддерживает MathML, ваша электронная почта может помешать вам отправить или получить сообщение с MathML внутри.
Клиенты мгновенного обмена сообщениями на базе Gecko могут интегрировать конвертер на основе Javascript, преобразующий текст в код MathML (см. ниже), и отображать выражения MathML, созданные из обычного текста мгновенных сообщений. Например, есть дополнение Instantbird, которое обрабатывает выражения LaTeX.
Для генерации HTML-страниц существует множество простых синтаксических систем (например, wiki или синтаксисы разметки). То же самое верно для MathML: например, синтаксисы ASCII, используемые в калькуляторах, или более мощный язык LaTeX очень популярны среди научного сообщества. В этом разделе мы представляем некоторые из таких инструментов для преобразования из простого синтаксиса в MathML.
В Web-среде наиболее очевидным методом преобразования простого синтаксиса в дерево DOM является использование Javascript и, конечно же, для выполнения этой задачи было разработано множество библиотек.
TeXZilla имеет пользовательский элемент <x-tex> который может использоваться для записи таких вещей, как
<x-tex>\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1</x-tex>
и автоматически преобразуется в MathML. Это все ещё в процессе разработки и может быть улучшено в будущем благодаря Web-компонентам и DOM. Кроме того, вы можете использовать более традиционный Javascript парсинг выражений в процессе загрузки как это используют и все другие инструменты, описанные в этом разделе.
Одним из простых инструментов конвертации на стороне клиента является ASCIIMathML. Просто загрузите скрипт ASCIIMathML.js и скопируйте его на ваш Web-сайт. Затем на ваших веб-страницах добавьте тег <script> для загрузки ASCIIMathML и математические выражения, выделенные символом ` (знак акцента) будут автоматически обработаны и преобразованы в MathML:
<html> <head> ... <script type="text/javascript" src="ASCIIMathML.js"></script> ... </head> <body> ... <p>blah blah `x^2 + y^2 = r^2` blah ... ...
LaTeXMathML - это похожий скрипт, который позволяет анализировать больше команд LaTeX. Установка похожа: скопируйте LaTeXMathML.js и LaTeXMathML.standardarticle.css, добавьте ссылки в заголовок вашего документа, а содержимое LaTeX вашей веб-страницы, помеченное классом "LaTeX", будет автоматически проанализировано и преобразовано в HTML+MathML:
<head> ... <script type="text/javascript" src="LaTeXMathML.js"></script> <link rel="stylesheet" type="text/css" href="LaTeXMathML.standardarticle.css" /> ... </head> <body> ... <div class="LaTeX"> \documentclass[12pt]{article} \begin{document} \title{LaTeXML Example} \maketitle \begin{abstract} This is a sample LaTeXML document. \end{abstract} \section{First Section} $$ \sum_{n=1}^{+\infty} \frac{1}{n^2} = \frac{\pi^2}{6} $$ \end{document} </div> ...
jqMath - это ещё один скрипт для парсинга простого LaTeX-подобного синтаксиса, который также принимает не-ASCII символы, такие как √{∑↙{n=1}↖{+∞} 6/n^2} = π , чтобы написать . Установка похожа: загрузите и скопируйте соответствующие файлы Javascript и CSS files на ваш Web сайт и сделайте ссылку на них в заголовке вашей страницы (смотрите файл COPY-ME.html из архива zip в качестве примера). Одним из преимуществ jqMath над предыдущими сценариями является то, что он автоматически добавит некоторые простые правила CSS для математической разметки и сделает формулы доступными для браузеров с ограниченной поддержкой MathML.
Альтернативный способ - парсить простой синтаксис перед публикацией ваших Web-страниц. В этом случае вы используете программы командной строки для создания и публикации этих статических страниц на своём сервере.
TeXZilla может использоваться из командной строки и будет, по существу, иметь ту же поддержку, что и itex2MML, описанный ниже. Однако поведение фильтра потока ещё не реализовано.
Если вы хотите просто парсить простые математические выражения LaTeX, вы можете попробовать такие инструменты, как itex2MML или Blahtex. Последнее часто доступно в дистрибутивах Linux. Давайте рассмотрим первое, которое изначально было написано Полом Гартсайдом в начале проекта Mozilla MathML и с тех пор поддерживается Жаком Дистлером. Это небольшой фильтр потока, написанный на C/C++ и сгенерированный с помощью flex и bison; в частности, оно очень быстрое. Установите flex/bison, а также классический компилятор и сгенерируйте инструменты. В Unix вы можете загрузить itex2MML, скомпилировать и установить его:
wget http://golem.ph.utexas.edu/~distler/blog/files/itexToMML.tar.gz; \ tar -xzf itexToMML.tar.gz; \ cd itex2MML/itex-src; make sudo make install
Теперь предположим, что у вас есть HTML страница с фрагментами TeX, разделёнными долларами:
input.html
...
</head>
<body>
<p>$\sqrt{a^2-3c}$</p>
<p>$$ {\sum_{i=1}^N i} = \frac{N(N+1)}{2} $$</p>
</body>
</html>
Затем, чтобы сгенерировать HTML страницу из input.html, с заменой выражений TeX на выражения MathML, просто выполните
cat input.html | itex2MML > output.html
Существуют ещё более содержательные инструменты для преобразования произвольных документов LaTeX в HTML+MathML. Например, TeX4ht часто включается в дистрибутивы TeX и имеет возможность использовать MathML вместо изображений PNG. Эта команда создаст XHTML+MathML документ foo.xml из LaTeX исходника foo.tex:
mk4ht mzlatex foo.tex # Linux/Mac platforms mzlatex foo.tex # Windows platform
Заметим, что tex4ebook опирается на TeX4ht для создания документов EPUB.
LaTeXML - это ещё один инструмент, который может создавать документы HTML5 и EPUB. Пользователи Windows могут посмотреть это видео-руководство. Для LaTeX файла foo.tex, вы можете использовать следующие простые команды:
latexmlc --dest foo.html foo.tex # Создаёт HTML5 документ foo.html latexmlc --dest foo.epub foo.tex # Создаёт EPUB документ foo.epub
В случаях с браузерами без поддержки MathML, вы можете использовать параметр --javascript, чтобы сообщить LaTeXML о включении одного из дополнительных скриптов:
latexmlc --dest foo.html --javascript=http://fred-wang.github.io/mathml.css/mspace.jsfoo.tex # Вариант с добавлением CSS latexmlc --dest foo.html --javascript=http://fred-wang.github.io/mathjax.js/mpadded-min.jsfoo.tex # Вариант с добавлением MathJax
Если ваш документ LaTeX - большой, вы можете разбить его на несколько небольших страниц, а не размещать все на одной большой странице. Например, это разделит страницы на уровне \section:
latexmlc --dest foo.html --splitat=section foo.tex
TeXZilla, LaTeXML и Mathoid могут использоваться для выполнения преобразования LaTeX-to-MathML на стороне сервера. Instiki и MediaWiki - это два wiki движка, которые поддерживают преобразование LaTeX-to-MathML.
TeXZilla имеет несколько интерфейсов, включая плагин CKEditor, используемый в MDN, онлайн демо и дополнение Firefox или FirefoxOS Webapp. Он также был интегрирован в SeaMonkey с версии 2.28 и в Thunderbird с версии 31. Abiword содержит небольшой редактор уравнений, основанный на itex2MML. Наконец, Bluegriffon имеет дополнение для вставки формул MathML в ваш документ, используя синтаксис, подобный ASCII/LaTeX.
Firemath - это расширение для Firefox, которое является WYSIWYG редактором MathML. Предварительный просмотр формулы осуществляется с помощью механизма рендеринга Mozilla. Сгенерированный код MathML доступен в нижней части окна. Используйте текстовое поле для ввода простых элементов (токенов) и кнопки для создания более сложных конструкций. После того, как вы завершите редактирование, вы сможете сохранить свой документ в виде страницы XHTML.
LyX - это графический LaTeX редактор, который имеет встроенную поддержку экспорта XHTML+MathML и может быть сконфигурирован на использование конвертеров вида LaTeX-to-(X)HTML. Например, вы можете настроить его для экспорта LaTeXML HTML5/EPUB.
В OpenOffice и LibreOffice есть редакторы уравнений (File → New → Formula). Это наполовину WYSIWYG: с помощью панели уравнений/клавиатуры вы вводите исходный текст для формулы и предосмотр полученной формулы соответственно обновляется. Редактор использует свой собственный синтаксис "StarMath" для исходных текстов, но при сохранении документа генерируется также и соответствующий код MathML. Для получения кода MathML, сохраните документ как mml и откройте его любым текстовым редактором. Как вариант, вы можете разархивировать файл odf (на самом деле zip-архив) и открыть xml файл content.xml.
Amaya - это Web-редактор от W3C, способный обрабатывать MathML внутри документов XHTML. Используйте элементы из Elements и панель Special Chars для создания различных продвинутых математических конструкций. Простой текст, такой как a+2, автоматически парсится и создаётся соответствующая разметка MathML. Как только вы закончите, вы сможете напрямую сохранить свою страницу XHTML и открыть её в Mozilla.
Inftyreader способен выполнять некоторое распознавание видимых символов, включающее перевод математических уравнений в MathML. Другие инструменты могут выполнять распознавание рукописного ввода, например, Windows Math Input Panel или онлайн конвертер Web Equation.