aboutsummaryrefslogtreecommitdiff
path: root/files/ru/web/mathml/authoring/index.html
blob: 14eb310372fcb7eba3cae5f9b13f7fe72d40dcf3 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
---
title: Средство разработки MathML
slug: Web/MathML/Authoring
tags:
  - Beginner
  - MathML
  - MathML Project
  - Начинающий
translation_of: Web/MathML/Authoring
---
<p>Эта страница объясняет, как записать математические выражения при помощи языка MathML. Подобно HTML, основными элементами языка MathML являются теги и атрибуты. Документ HTML становится сложным, когда он содержит структуры, подобные спискам или таблицам, но, к счастью, существует много генераторов на основе простых систем обозначений, WYSIWYG редакторы и другие системы управления контентом, помогающие создавать Web страницы.</p>

<p>Математические обозначения ещё более сложны со структурами такими, как дроби, квадратные корни или матрицы, которые, вероятно, потребуют собственных тегов. Поэтому инструменты разработки, связанные с MathML, очень важны. Некоторые из этих инструментов мы описываем ниже. В частности, команда Mozilla MathML разрабатывала <a href="https://github.com/fred-wang/TeXZilla/">TeXZilla</a> (Javascript Unicode LaTeX-to-MathML конвертер), который предназначен для использования во многих сценариях, описанных здесь. Конечно, этот список ни в коем случае не является исчерпывающим и вам предлагается проверить <a class="external" href="https://www.w3.org/Math/Software/">W3C MathML software list</a>, где вы можете найти некоторые другие инструменты.</p>

<p>Заметим, что MathML хорошо интегрирован в HTML5. В частности, вы можете использовать обычные Web-инструменты, такие как CSS, DOM, Javascript или SVG. Данная тема выходит за рамки этого документа, но любой, у кого есть базовые знания Web-языков, сможет легко совместить эти инструменты с MathML. Ознакомьтесь с <a href="/ru/docs/Mozilla/MathML_Project#Sample_MathML_Documents" title="/ru/docs/Mozilla/MathML_Project#Sample_MathML_Documents">нашими примерами</a> и <a href="/ru/docs/Web/MathML" title="ru/MathML/Element">справочными данными по MathML</a> для получения более подробной информации.</p>

<h2 id="Использование_MathML">Использование MathML</h2>

<h4 id="Example_in_HTML5_(text/html)" name="Example_in_HTML5_(text/html)">MathML на страницах HTML</h4>

<p><span id="result_box" lang="ru"><span>Вы можете использовать Presentation MathML внутри документов HTML5</span></span>:</p>

<pre class="brush: html">&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
 &lt;title&gt;MathML in HTML5&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;

  &lt;h1&gt;MathML in HTML5&lt;/h1&gt;

  &lt;p&gt;
    Square root of two:
    &lt;math&gt;
      &lt;msqrt&gt;
        &lt;mn&gt;2&lt;/mn&gt;
      &lt;/msqrt&gt;
    &lt;/math&gt;
  &lt;/p&gt;

&lt;/body&gt;
&lt;/html&gt; </pre>

<p>Content MathML не поддерживается браузерами. Рекомендуется преобразовать ваш макет из Content MathML в Presentation MathML перед его публикацией, например, с помощью таблицы стилей <a class="external" href="https://code.google.com/p/web-xslt/source/browse/trunk/#trunk/ctop">ctop.xsl</a> . Инструменты, упомянутые на этой странице, генерируют Presentation MathML.</p>

<h4 id="Варианты_для_браузеров_без_поддержки_MathML">Варианты для браузеров без поддержки MathML</h4>

<p>К сожалению, некоторые браузеры не могут отображать выражения MathML или имеют ограниченную поддержку. Следовательно, вам нужно будет использовать полифил MathML, чтобы обеспечить некоторый резервный рендеринг. Если вам нужны только базовые математические конструкции, такие как те, которые используются в этой MDN wiki, тогда небольшой таблицы стилей <a href="https://github.com/fred-wang/mathml.css">mathml.css</a> возможно будет достаточно. Для её использования, просто вставьте одну строку в заголовок вашего документа:</p>

<pre class="brush: html">&lt;script src="http://fred-wang.github.io/mathml.css/mspace.js"&gt;&lt;/script&gt;</pre>

<p>Если вам нужны более сложные конструкции, тогда вы можете вместо этого использовать более содержательную библиотеку <a href="https://www.mathjax.org" title="http://www.mathjax.org">MathJax</a> как полифил MathML:</p>

<pre class="brush: html">&lt;script src="http://fred-wang.github.io/mathjax.js/mpadded-min.js"&gt;&lt;/script&gt;</pre>

<p>Обратите внимание, что эти два скрипта распознают элементы <a href="/en-US/docs/Web/MathML/Element/mspace">mspace</a> или <a href="/en-US/docs/Web/MathML/Element/mpadded">mpadded</a> (см. Таблицу совместимости браузера на этих страницах). Существует также подобный скрипт, отображающий предупреждение в верхней части страницы для браузеров без хорошей поддержки MathML и позволяющий пользователям выбрать один из вариантов действий:</p>

<pre class="brush: html">&lt;script src="http://fred-wang.github.io/mathml-warning.js/mpadded-min.js"&gt;&lt;/script&gt;</pre>

<p>Если вы не хотите использовать эту ссылку на GitHub, но вместо этого хотите интегрировать эти полифилы или нечто другое в свой проект, тогда вам может понадобиться скрипт, проверяющий уровень поддержки MathML. Например, следующая функция проверяет поддержку MathML путём тестирования элемента mspace (вы можете заменить <code>mspace</code> на <code>mpadded</code>):</p>

<pre class="brush: js"> function hasMathMLSupport() {
  var div = document.createElement("div"), box;
  div.innerHTML = "&lt;math&gt;&lt;mspace height='23px' width='77px'/&gt;&lt;/math&gt;";
  document.body.appendChild(div);
  box = div.firstChild.firstChild.getBoundingClientRect();
  document.body.removeChild(div);
  return Math.abs(box.height - 23) &lt;= 1  &amp;&amp; Math.abs(box.width - 77) &lt;= 1;
}</pre>

<p>В качестве альтернативы, следующий анализ строки UA позволит определить движок рендеринга с родной поддержкой MathML (Gecko и WebKit). Обратите внимание, что анализ строки UA является не самым надёжным методом и может сбоить от версии к версии:</p>

<pre class="brush: js">var ua = navigator.userAgent;
var isGecko = ua.indexOf("Gecko") &gt; -1 &amp;&amp; ua.indexOf("KHTML") === -1 &amp;&amp; ua.indexOf('Trident') === -1;
var isWebKit = ua.indexOf('AppleWebKit') &gt; -1 &amp;&amp; ua.indexOf('Chrome') === -1;
</pre>

<h4 id="Математические_шрифты">Математические шрифты</h4>

<p>Для того, чтобы получить хорошую разметку или обеспечить нужный стиль, важно иметь математические шрифты. Всегда полезно обеспечить ссылку на <a href="/ru/docs/Mozilla/MathML_Project/Fonts"> инструкцию по шрифтам MDN </a>, чтобы ваши посетители могли проверить - установлены ли соответствующие шрифты в их системе. Хорошо также, если будет создана резервная копия веб-шрифтов.</p>

<p>До Gecko 31.0 {{GeckoRelease("31.0")}} было утомительно устанавливать математические шрифты (смотрите <a href="/ru/docs/Mozilla/MathML_Project/FontsMozilla2.0#MathML_Font_Selection_with_CSS">инструкцию по установке шрифтов для Mozilla 2.0</a>). Для Gecko 31.0 {{GeckoRelease("31.0")}} это намного проще и совместимо со всеми движками Web рендеринга с поддержкой MathML. Например, здесь представлена минимальная таблица стилей для использования шрифта Latin Modern для текста и шрифта Latin Modern Math для математических выражений:</p>

<pre class="brush: css">@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;
}</pre>

<p><span id="result_box" lang="ru"><span>Затем вы можете использовать правило</span></span> <a href="/ru/docs/Web/CSS/@font-face">@font-face</a>, как обычно, для обеспечения выбора WOFF для Latin Modern и Latin Modern Math. Смотрите <a href="https://github.com/fred-wang/MathFonts">репозиторий GitHub с  WOFF шрифтами и примерами таблиц стилей CSS</a> для использования на вашем Web-сайте, а также этот <a href="http://fred-wang.github.io/MathFonts/">ресурс с тестами</a>.</p>

<h4 id="MathML_в_документах_XML_(XHTML_EPUB_и_т.д.)">MathML в документах XML (XHTML, EPUB, и т.д.)</h4>

<p>Если по какой-то причине вам нужно использовать MathML в документах XML, обязательно выполняйте обычные требования: хорошо сформированный документ, использование правильного MIME-типа, пространство имён MathML <code>"http://www.w3.org/1998/Math/MathML"</code> с корневым элементом <code>&lt;math&gt;</code>. Например, версия XHTML предыдущего примера выглядит так:<br>
  </p>

<pre class="brush: xml">&lt;?xml version="1.0" encoding="UTF-8"?&gt;
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN"
  "http://www.w3.org/Math/DTD/mathml2/xhtml-math11-f.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head&gt;
 &lt;title&gt;XHTML+MathML Example&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;h1&gt;Пример XHTML+MathML&lt;/h1&gt;

  &lt;p&gt;
    Квадратный корень из двух:
    &lt;math xmlns="http://www.w3.org/1998/Math/MathML"&gt;
      &lt;msqrt&gt;
        &lt;mn&gt;2&lt;/mn&gt;
      &lt;/msqrt&gt;
    &lt;/math&gt;
  &lt;/p&gt;

&lt;/body&gt;
&lt;/html&gt; </pre>

<h4 id="MathML_в_клиентах_email_и_клиентах_обмена_мгновенными_сообщениями">MathML в клиентах email и клиентах обмена мгновенными сообщениями</h4>

<p>Современные почтовые клиенты могут посылать и получать электронные сообщения в формате HTML5, то есть в них можно использовать выражения MathML. Обязательно включите опции "отправить как HTML" и "просмотреть как HTML". В Thunderbird вы можете использовать команду "Вставить HTML", чтобы вставить код HTML + MathML. <a href="http://disruptive-innovations.com/zoo/MathBird/" title="http://disruptive-innovations.com/zoo/MathBird/">MathBird</a> - удобное дополнение для Thunderbird для вставки таких выражений MathML с использованием синтаксиса ввода AsciiMath. Кроме того, поле ввода LaTeX-to-MathML также было интегрировано в <a href="https://www.seamonkey-project.org/">SeaMonkey</a> с версии 2.28 и в <a href="https://www.mozilla.org/thunderbird/">Thunderbird</a> с версии 31. С другой стороны, обработка кода MathML и качество рендеринга MathML <a href="http://www.maths-informatique-jeux.com/blog/frederic/?post/2012/11/14/Writing-mathematics-in-emails#c121" title="http://www.maths-informatique-jeux.com/blog/frederic/?post/2012/11/14/Writing-mathematics-in-emails#c121">зависит от почтового клиента</a>. Даже если ваш браузер поддерживает MathML, ваша электронная почта может помешать вам отправить или получить сообщение с MathML внутри.</p>

<p>Клиенты мгновенного обмена сообщениями на базе Gecko могут интегрировать конвертер на основе Javascript, преобразующий текст в код MathML (см. ниже), и отображать выражения MathML, созданные из обычного текста мгновенных сообщений. Например, есть <a href="https://addons.instantbird.org/en-US/instantbird/addon/340" title="https://addons.instantbird.org/en-US/instantbird/addon/340">дополнение Instantbird</a>, которое обрабатывает выражения LaTeX.</p>

<h2 id="Конвертация_из_простого_синтаксиса">Конвертация из простого синтаксиса</h2>

<p>Для генерации HTML-страниц существует множество простых синтаксических систем (например, wiki или синтаксисы разметки). То же самое верно для MathML: например, синтаксисы ASCII, используемые в калькуляторах, или более мощный язык LaTeX очень популярны среди научного сообщества. В этом разделе мы представляем некоторые из таких инструментов для преобразования из простого синтаксиса в MathML.</p>

<ul>
 <li>плюсы:
  <ul>
   <li>Для написания математических выражений может потребоваться только стандартный текстовый редактор.</li>
   <li>Доступны многие инструменты, некоторые из которых совместимы с классическим рабочим процессом LaTeX-to-pdf.</li>
   <li>Это даёт доступ к расширенным возможностям макросов, подобных макросам LaTeX.</li>
  </ul>
 </li>
 <li>минусы:
  <ul>
   <li>Это может быть труднее в использовании: люди должны изучить синтаксис, опечатки в коде могут легко привести к ошибкам парсинга или рендеринга и т.д.</li>
   <li>Интерфейс не является дружественным для пользователя: есть только редактор кода без немедленного отображения математического выражения.</li>
   <li>Ни один из синтаксисов не был стандартизирован, что затрудняет кросс-совместимость между конвертерами. Даже популярный язык LaTeX продолжает пополняться новыми пакетами.</li>
  </ul>
 </li>
</ul>

<h3 id="Конвертация_на_стороне_клиента">Конвертация на стороне клиента</h3>

<p>В Web-среде наиболее очевидным методом преобразования простого синтаксиса в дерево DOM является использование Javascript и, конечно же, для выполнения этой задачи было разработано множество библиотек.</p>

<ul>
 <li>плюсы:
  <ul>
   <li>Очень простая настройка: необходимо только загрузить несколько файлов Javascript и CSS и/или добавить ссылки link в заголовок документа.</li>
   <li>Это чистое Web-решение: все делается браузерами, и никакие другие программы не должны устанавливаться или компилироваться.</li>
  </ul>
 </li>
 <li>минусы:
  <ul>
   <li>Это не будет работать, если у пользователя отключён Javascript.</li>
   <li>Код MathML не поддерживается Web-сканерами (например, средствами математического поиска или новостными агрегаторами). В частности, ваш контент не будет отображаться правильно на Planet.</li>
   <li>Конвертация должна выполняться при каждой загрузке страницы, может быть медленной и может конфликтовать с парсингом HTML (например, "&lt;" для тегов или "$" для денежных сумм)</li>
   <li>Возможно вам понадобится синхронизировать Javascript-конвертер с другими программами Javascript на вашей странице.</li>
  </ul>
 </li>
</ul>

<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> имеет пользовательский элемент <a href="https://github.com/fred-wang/x-tex">&lt;x-tex&gt;</a> который может использоваться для записи таких вещей, как</p>

<pre><span class="brush: html">&lt;<span class="start-tag">x-tex</span>&gt;</span><span>\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1</span><span class="brush: html">&lt;/<span class="end-tag">x-tex</span>&gt;</span></pre>

<p>и автоматически преобразуется в MathML. Это все ещё в процессе разработки и может быть улучшено в будущем благодаря Web-компонентам и DOM. Кроме того, вы можете использовать более традиционный <a href="https://github.com/fred-wang/TeXZilla/wiki/Advanced-Usages#parsing-tex-expressions-in-your-web-page">Javascript парсинг выражений в процессе загрузки</a> как это используют и все другие инструменты, описанные в этом разделе.</p>

<p>Одним из простых инструментов конвертации на стороне клиента является <a href="http://www1.chapman.edu/~jipsen/mathml/asciimath.html" title="http://www1.chapman.edu/~jipsen/mathml/asciimath.html">ASCIIMathML</a>. Просто загрузите скрипт <a href="https://mathcs.chapman.edu/~jipsen/mathml/ASCIIMathML.js" title="http://mathcs.chapman.edu/~jipsen/mathml/ASCIIMathML.js">ASCIIMathML.js</a> и скопируйте его на ваш Web-сайт. Затем на ваших веб-страницах добавьте тег <code>&lt;script&gt;</code> для загрузки ASCIIMathML и математические выражения, выделенные символом <code>`</code> (знак акцента) будут автоматически обработаны и преобразованы в MathML:</p>

<pre class="brush: html">&lt;html&gt;
&lt;head&gt;
...
&lt;script type="text/javascript" src="ASCIIMathML.js"&gt;&lt;/script&gt;
...
&lt;/head&gt;
&lt;body&gt;
...
&lt;p&gt;blah blah `x^2 + y^2 = r^2` blah ...
...
</pre>

<p><a href="https://math.etsu.edu/LaTeXMathML/" title="http://math.etsu.edu/LaTeXMathML/">LaTeXMathML</a> - это похожий скрипт, который позволяет анализировать больше команд LaTeX. Установка похожа: скопируйте <a href="https://math.etsu.edu/LaTeXMathML/LaTeXMathML.js" title="http://math.etsu.edu/LaTeXMathML/LaTeXMathML.js">LaTeXMathML.js</a> и <a href="https://math.etsu.edu/LaTeXMathML/LaTeXMathML.standardarticle.css" title="http://math.etsu.edu/LaTeXMathML/LaTeXMathML.standardarticle.css">LaTeXMathML.standardarticle.css</a>, добавьте ссылки в заголовок вашего документа, а содержимое LaTeX вашей веб-страницы, помеченное классом "LaTeX", будет автоматически проанализировано и преобразовано в HTML+MathML:</p>

<pre class="brush: html"><span>&lt;<span class="start-tag">head</span>&gt;</span>
<span>...
</span><span>&lt;<span class="start-tag">script</span> <span class="attribute-name">type</span>="<a class="attribute-value">text/javascript</a>" <span class="attribute-name">src</span>="<a class="attribute-value">LaTeXMathML.js</a>"&gt;</span><span>&lt;/<span class="end-tag">script</span>&gt;</span><span>
</span><span>&lt;<span class="start-tag">link</span> <span class="attribute-name">rel</span>="<a class="attribute-value">stylesheet</a>" <span class="attribute-name">type</span>="<a class="attribute-value">text/css</a>" <span class="attribute-name">href</span>="<a class="attribute-value">LaTeXMathML.standardarticle.css</a>" <span>/</span>&gt;</span><span>
...
</span><span>&lt;/<span class="end-tag">head</span>&gt;</span><span>

</span><span>&lt;<span class="start-tag">body</span>&gt;</span><span>
...

</span>&lt;div class="LaTeX"&gt;
\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}
&lt;/div&gt;
...</pre>

<p><a href="https://mathscribe.com/author/jqmath.html" title="http://mathscribe.com/author/jqmath.html">jqMath</a> - это ещё один скрипт для парсинга простого LaTeX-подобного синтаксиса, который также принимает не-ASCII символы, такие как  <code>√{∑↙{n=1}↖{+∞} 6/n^2} = π</code> , чтобы написать <math> <mrow> <msqrt> <mrow class="ma-repel-adj"> <munderover> <mo></mo> <mrow> <mi>n</mi> <mo>=</mo> <mn>1</mn> </mrow> <mrow> <mo>+</mo> <mi></mi> </mrow> </munderover> <mfrac> <mn>6</mn> <msup> <mi>n</mi> <mn>2</mn> </msup> </mfrac> </mrow> </msqrt> <mo>=</mo> <mi>π</mi> </mrow> </math>. Установка похожа: загрузите и скопируйте соответствующие файлы <a href="https://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip" title="http://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip">Javascript и CSS files</a> на ваш Web сайт и сделайте ссылку на них в заголовке вашей страницы (смотрите файл <code>COPY-ME.html</code> из архива zip в качестве примера). Одним из преимуществ jqMath над предыдущими сценариями является то, что он автоматически добавит некоторые простые правила CSS для математической разметки и сделает формулы доступными для браузеров с ограниченной поддержкой MathML.</p>

<h3 id="Программы_командной_строки">Программы командной строки</h3>

<p>Альтернативный способ - парсить простой синтаксис перед публикацией ваших Web-страниц. В этом случае вы используете программы командной строки для создания и публикации этих статических страниц на своём сервере.</p>

<ul>
 <li>плюсы:
  <ul>
   <li>Вы получаете статические Web-страницы: исходный текст LaTeX не нужно парсить при каждой загрузке страницы, код MathML доступен Web-сканерам, и вы можете легко размещать их на любом Web-сервере.</li>
   <li>Бинарные программы могут работать быстрее, чем Javascript-программы, и могут быть более содержательными, то есть иметь более полную поддержку LaTeX или генерировать другие форматы, такие как EPUB.</li>
   <li>Вы можете поддерживать совместимость с другими инструментами для генерации pdf, то есть вы можете использовать один и тот же исходник .tex как для Latex, так и для Latexml.</li>
  </ul>
 </li>
 <li>минусы:
  <ul>
   <li>Это требует установки программ на вашем компьютере, что может быть немного сложнее или они могут быть доступны не для всех платформ.</li>
   <li>Вы должны запускать программы на своём компьютере и иметь какой-то рабочий процесс для получения веб-страниц в конце; это может быть немного утомительно.</li>
   <li>Двоичные программы не подходят для их интеграции в расширение Mozilla или приложение XUL.</li>
  </ul>
 </li>
</ul>

<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> может использоваться <a href="https://github.com/fred-wang/TeXZilla/wiki/Using-TeXZilla#usage-from-the-command-line">из командной строки</a> и будет, по существу, иметь ту же поддержку, что и itex2MML, описанный ниже. Однако поведение фильтра потока ещё не реализовано.</p>

<p>Если вы хотите просто парсить простые математические выражения LaTeX, вы можете попробовать такие инструменты, как <a href="https://golem.ph.utexas.edu/~distler/blog/itex2MML.html" title="http://golem.ph.utexas.edu/~distler/blog/itex2MML.html">itex2MML</a> или <a href="http://gva.noekeon.org/blahtexml/" title="http://gva.noekeon.org/blahtexml/">Blahtex</a>. Последнее часто доступно в дистрибутивах Linux. Давайте рассмотрим первое, которое изначально было написано Полом Гартсайдом в начале проекта Mozilla MathML и с тех пор поддерживается Жаком Дистлером. Это небольшой фильтр потока, написанный на C/C++ и сгенерированный с помощью flex и bison; в частности, оно очень быстрое. Установите flex/bison, а также классический компилятор и сгенерируйте инструменты. В Unix вы можете загрузить itex2MML, скомпилировать и установить его:</p>

<pre class="brush: bash">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
</pre>

<p>Теперь предположим, что у вас есть HTML страница с фрагментами TeX, разделёнными долларами:</p>

<pre class="brush: html">input.html

...
&lt;/head&gt;
&lt;body&gt;
  &lt;p&gt;$\sqrt{a^2-3c}$&lt;/p&gt;
  &lt;p&gt;$$ {\sum_{i=1}^N i} = \frac{N(N+1)}{2} $$&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>

<p>Затем, чтобы сгенерировать HTML страницу из input.html, с заменой выражений TeX на выражения MathML, просто выполните</p>

<pre>cat input.html | itex2MML &gt; output.html</pre>

<p>Существуют ещё более содержательные инструменты для преобразования произвольных документов LaTeX в HTML+MathML. Например, <a href="https://www.tug.org/tex4ht/">TeX4ht</a> часто включается в дистрибутивы TeX и имеет возможность использовать MathML вместо изображений PNG. Эта команда создаст XHTML+MathML документ foo.xml из LaTeX исходника foo.tex:</p>

<pre>   mk4ht mzlatex foo.tex # Linux/Mac platforms
   mzlatex foo.tex       # Windows platform
</pre>

<p>Заметим, что <a href="https://github.com/michal-h21/tex4ebook">tex4ebook</a> опирается на TeX4ht для создания документов EPUB.</p>

<p><a href="https://dlmf.nist.gov/LaTeXML/" name="LaTeXML">LaTeXML</a> - это ещё один инструмент, который может создавать документы HTML5 и EPUB. Пользователи Windows могут посмотреть это <a href="https://www.youtube.com/watch?v=Dg881w2e-lI">видео-руководство</a>. Для LaTeX файла foo.tex, вы можете использовать следующие простые команды:</p>

<pre>  latexmlc --dest foo.html foo.tex # Создаёт HTML5 документ foo.html
  latexmlc --dest foo.epub foo.tex # Создаёт EPUB документ foo.epub</pre>

<p>В случаях с браузерами без поддержки MathML, вы можете использовать параметр <code>--javascript</code>, чтобы сообщить LaTeXML о включении одного из <a href="#fallback_for_browsers_without_mathml_support">дополнительных скриптов</a>:</p>

<pre>  latexmlc --dest foo.html --javascript=<code class="language-html"><span class="script token"><span class="tag token"><span class="attr-value token">http://fred-wang.github.io/mathml.css/mspace.js</span></span></span></code> foo.tex  # Вариант с добавлением CSS
  latexmlc --dest foo.html --javascript=<code class="language-html"><span class="script token"><span class="tag token"><span class="attr-value token">http://fred-wang.github.io/mathjax.js/mpadded-min.js</span></span></span></code> foo.tex # Вариант с добавлением MathJax</pre>

<p>Если ваш документ LaTeX - большой, вы можете разбить его на несколько небольших страниц, а не размещать все на одной большой странице. Например, это разделит страницы на уровне <code>\section</code>:</p>

<pre>  latexmlc --dest foo.html --splitat=section foo.tex
</pre>

<h3 id="Конвертация_на_стороне_сервера">Конвертация на стороне сервера</h3>

<ul>
 <li>плюсы:
  <ul>
   <li>Преобразование выполняется на стороне сервера и полученный текст MathML можно кешировать, что является более эффективным и чистым, чем преобразование на стороне клиента.</li>
  </ul>
 </li>
 <li>минусы:
  <ul>
   <li>Это может быть немного сложнее настроить, так как вам нужны права администратора на вашем сервере.</li>
  </ul>
 </li>
</ul>

<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a>, <a href="https://dlmf.nist.gov/LaTeXML/">LaTeXML</a> и <a href="https://github.com/gwicke/mathoid">Mathoid</a>  могут использоваться для выполнения преобразования LaTeX-to-MathML на стороне сервера.<a href="http://instiki.org/show/HomePage"> Instiki</a> и <a href="https://www.mediawiki.org/wiki/MediaWiki">MediaWiki</a> - это два wiki движка, которые поддерживают преобразование LaTeX-to-MathML.</p>

<h2 id="Графический_интерфейс">Графический интерфейс</h2>

<h3 id="Поле_ввода">Поле ввода</h3>

<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> имеет несколько интерфейсов, включая плагин <a href="https://ckeditor.com/addon/texzilla">CKEditor</a>, используемый в MDN, <a href="http://fred-wang.github.io/TeXZilla/">онлайн демо</a> и <a href="https://addons.mozilla.org/en-US/firefox/addon/texzilla/">дополнение Firefox</a> или <a href="https://marketplace.firefox.com/app/texzilla-1/">FirefoxOS Webapp</a>. Он также был интегрирован в <a href="https://www.seamonkey-project.org/">SeaMonkey</a> с версии 2.28 и в <a href="https://www.mozilla.org/thunderbird/">Thunderbird</a> с версии 31.<a href="http://abisource.org/"> Abiword</a> содержит небольшой редактор уравнений, основанный на itex2MML. Наконец, <a href="http://www.bluegriffon.com/"> Bluegriffon</a> имеет дополнение для вставки формул MathML в ваш документ, используя синтаксис, подобный ASCII/LaTeX.</p>

<p style="text-align: center;"><img alt="BlueGriffon" src="mathml-shot1.png"></p>

<h3 id="WYSIYWG_редакторы">WYSIYWG редакторы</h3>

<p><a href="https://www.firemath.info/">Firemath</a> - это расширение для Firefox, которое является WYSIWYG редактором MathML. Предварительный просмотр формулы осуществляется с помощью механизма рендеринга Mozilla. Сгенерированный код MathML доступен в нижней части окна. Используйте текстовое поле для ввода простых элементов (токенов) и кнопки для создания более сложных конструкций. После того, как вы завершите редактирование, вы сможете сохранить свой документ в виде страницы XHTML.</p>

<p><a href="https://www.lyx.org/">LyX</a> - это графический LaTeX редактор, который имеет встроенную поддержку экспорта XHTML+MathML и может быть сконфигурирован на использование конвертеров вида LaTeX-to-(X)HTML. Например, вы можете настроить его для экспорта <a href="https://github.com/brucemiller/LaTeXML/wiki/Integrating-LaTeXML-into-TeX-editors#lyx">LaTeXML HTML5/EPUB</a>.</p>

<p>В <a href="https://www.openoffice.org/">OpenOffice</a> и <a href="https://libreoffice.org/">LibreOffice</a> есть редакторы уравнений (File → New → Formula). Это наполовину WYSIWYG: с помощью панели уравнений/клавиатуры вы вводите исходный текст для формулы и предосмотр полученной формулы соответственно обновляется. Редактор использует свой собственный синтаксис "StarMath" для исходных текстов, но при сохранении документа генерируется также и соответствующий код MathML. Для получения кода MathML, сохраните документ как mml и откройте его любым текстовым редактором. Как вариант, вы можете разархивировать файл odf (на самом деле zip-архив) и открыть xml файл <code>content.xml</code>.</p>

<p style="text-align: center;"><img alt="Open Office Math" src="openoffice.png"></p>

<p><a href="https://www.w3.org/Amaya/">Amaya</a> - это Web-редактор от W3C, способный обрабатывать MathML внутри документов XHTML. Используйте элементы из Elements и панель Special Chars для создания различных продвинутых математических конструкций. Простой текст, такой как <code>a+2</code>, автоматически парсится и создаётся соответствующая разметка MathML. Как только вы закончите, вы сможете напрямую сохранить свою страницу XHTML и открыть её в Mozilla.</p>

<h2 id="Распознавание_видимых_символов_и_рукописного_текста">Распознавание видимых символов и рукописного текста</h2>

<p><a href="https://www.inftyreader.org/">Inftyreader</a> способен выполнять некоторое распознавание видимых символов, включающее перевод математических уравнений в MathML. Другие инструменты могут выполнять распознавание рукописного ввода, например, <a href="https://msdn.microsoft.com/en-us/library/windows/desktop/dd371698(v=vs.85).aspx">Windows Math Input Panel</a> или онлайн конвертер <a href="https://webdemo.myscript.com/views/math.html" title="http://webdemo.visionobjects.com/portal.html">Web Equation</a>.</p>

<div class="originaldocinfo">
<h3 id="Информация_об_исходном_документе">Информация об исходном документе</h3>

<ul>
 <li>Автор(ы): Frédéric Wang</li>
 <li>Другие участники: Florian Scholz</li>
 <li>Информация об авторских правах (Copyright): Авторские права на данный контент (© 2010) принадлежат отдельным участникам проекта mozilla.org; Контент доступен в соответствии с лицензией Creative Commons | <a class="external" href="https://www.mozilla.org/foundation/licensing/website-content.html">Подробности</a>.</li>
</ul>
</div>

<p> </p>