Mathml примеры. Основные способы вставки формул в html-документы


До выхода HTML5 использование формул было сущим наказанием. Судите сами: в 2005-м необходимо было иметь под рукой либо специальный браузер, либо разбивать текст на собственно HTML и вставки из изображений или PDF. Поиск и прочие операции редактирования и/или вывода на экран/бумагу был неоднозначной задачей, коей посвящались целые монографии .

В 2012-м было уже попроще. Появилась возможность подключать необходимые плагины (Firemath для FireFox и Daum Equation Editor для Chrome). Но неоднозначность стандартов (и поддержки) фактически заставляла писать одну и ту же статью для каждого из браузеров (и для их версий). Или встречать пользователей волшебным приветствием «Ваш браузер надо обновить/дополнить расширением».

Неудобно? - Да! Отнимало много времени на поиск универсального решения? - Да! Заставляет думать о том, какой тип записи лучше (презентационный или содержательный), каким конвертером пользоваться (а их только общеизвестных с десятка полтора)? - ДА! ДА! ДА!

В результате работа по публикации превращалась в освоение двух-трех лексиконов разметки и изучения работы минимум одной программы-перекодировщика.

Теперь, с приходом HTML5, все стало намного проще. В нем появился новый контейнер .
Каждый допустимый экземпляр MathML должен быть внутри этого контейнера.
Он не допускает вложений, но внутри может быть произвольное число других дочерних элементов.

Атрибуты тэга

В дополнение к следующим атрибутам, тэг воспринимает любые атрибуты из "> .

class, id, style
При условии использования вместе с таблицами стилей .
dir
Указывает направление формулы: ltr - слева направо или rtl - справа налево.
ref
Используется для установки гиперссылки на указанный URI.
mathbackground
Цвет фона. Вы можете использовать #rgb , #rrggbb и названия цветов HTML .
mathcolor
Цвет текста. Вы можете использовать #rgb , #rrggbb и названия цветов HTML .
display
Этот атрибут определяет способ вывода. Возможные значения:

  • block - означает, что этот элемент будет отображаться за пределами текущего диапазона текста, как блока, который может быть расположен в любом месте без изменения смысла текста;
  • inline -означает, что этот элемент будет отображаться внутри текущего диапазона текста, и не могут быть перемещены из нее без изменения значения этого текста.

Значение по умолчанию inline .

Mode

Устаревшие значение display attribute .
Возможные значения: display (который имеет тот же эффект, как display="block") и inline .
overflow
Определяет, как выражение ведет себя, если текст слишком длинный и не помещается в указанном диапазоне ширины.
Возможные значения: linebreak (по умолчанию), scroll , elide , truncate , scale .

Примеры

Представление в HTML5

MathML in HTML5 a 2 + b 2 = c 2

Представление в XHTML

MathML in XHTML a 2 + b 2 = c 2
Примечания: XHTML документы с MathML должны быть поданы как application/xhtml+xml . Вы можете легко добиться этого, добавив.xhtml расширение для локальных файлов. Для серверов Apache вы можете настроить.htaccess файл для этого расширения на правильный тип MIME. Поскольку мы сохранили наш MathML в виде XML-документа, необходимо быть уверенным в правильно оформленном XML-документе.

Поддержка браузерами

Поддержка браузерами

Полноценные версии
Элемент Chrome Firefox (Gecko) Internet Explorer Opera Safari
XHTML описание (только 24-я) 1.0 (1.7 и выше) 9.5 5.1
HTML5 описание (только 24-я) 4.0 (2.0) 5.1
dir 12.0 (12.0)
href WebKit bug 85733 7.0 (7.0) WebKit bug 85733
mathbackground (только 24-я) 4.0 (2.0) 5.1
mathcolor (только 24-я) 4.0 (2.0) 5.1
overflow

Мобильные версии

Элемент Android Chrome для Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
XHTML описание 1.0 (1.0)
HTML5 описание 4.0 (2.0)
dir 12.0 (12.0)
href 7.0 (7.0)
mathbackground 4.0 (2.0)
mathcolor 4.0 (2.0)
overflow

Все вышесказанное относится к отдельным формулам вне контекста документа. Давайте подробно рассмотрим пример, соответствующий примеру "Hello, World!", разбираемому при изучении языков программирования. Мы представим полный код документа XHTML 1.0, содержащего рассмотренный выше квадрат суммы двух переменных:

MathML"s Hello Square

This is a perfect square:

Это стандартная структура документа XHTML. Он начинается открывающим тегом , содержащим декларацию пространства имен XML и объявление языка. Элемент head содержит, как обычно, заголовок. Открывающий тег beginning also has a namespace declaration of an abbreviative prefix letter m to be used for the standard MathML namespace. Затем идет обычный параграф. И, наконец, идет элемент math, который также имеет декларацию пространства имен. Внутри элемента math находится разметка MathML.

Примеры MathML

Примеры разметки представления

Нотация: x 2 + 4x + 4 = 0.

Разметка:

Обратите внимание на использование вложенных элементов mrow для обозначения термов. Например, левая часть уравнения является операндом для "=". Выделение термов значительно улучшает структуру для визуального отображения, воспроизведения с помощью голоса и переноса строк. Символ MathML InvisibleTimes применяется для того, чтобы сообщить программе отображения, что между 4 и x запрещен перенос строки. На самом деле, такое использование данного элемента, введенного еще в MathML 1.0, не рекомендуется. Все обычные текстовые данные задаются кодами Unicode. Тем не менее, хотя символ для замены ⁢ ожидается в Unicode 3.2, и рассматриваются предложения по улучшению Unicode, в текущей версии Unicode 3.0 такого символа не используется. Мы можем использовать ожидаемую цифровую ссылку ࠎ но для понятности будем продолжать использовать в примерах элемент InvisibleTimes.

Разметка:

±

Элементы mfrac и msqrt используются для создания дроби и квадратного корня соответственно.

Обратите внимание, что знак "плюс-минус" задается специальной сущностью ±, хотя в данном случае существует такой символ Unicode, как B1;. MathML предоставляет обширный список имен элементов, задающих математические символы. В дополнение к математическим символам для вывода документа на экран и на печать, MathML предоставляет символы для воспроизведения документа с помощью речи. Для воспроизведения с помощью речи важно автоматически определять, как должен быть прочитан фрагмент

Как "z умножить на величину x плюс y " or "z умножить на x плюс y ". Символы ⁢ (U+2062) и ⁡ (U+2061) предоставляют авторам способ напрямую кодировать такие различия для программ речевого воспроизведения. Например, в первом случае, символ ⁢ (U+2062) должен быть вставлен после строки, содержащей z . MathML также содержит такие сущности как ⅆ (U+2146), представляющая дифференциал. При печати она отображается с отличными от обычного символа "d" интервалами, а произноситься может как "d" или "with respect to". Пока для исключения двусмысленности используются теги содержания или любой другой механизм, авторы всегда должны использовать описанные выше символы как сущности для того, чтобы сделать документы более доступными.

Разметка:

x

y

z

w

Элемент mtable указывает на начало таблицы в MathML. Элемент mtr определяет строку таблицы и элемент mtd содержит данные для элемента строки (ячейки). Большая часть элементов имеет атрибуты, определяющие свойства отображения на экране и на печати. Например, у элемента mfenced есть атрибуты, определяющие, какие символы должны использоваться в начале и в конце группируемого выражения. Атрибуты элементов-операторов устанавливаются в определенное справочником значение по умолчанию при помощи элемента .

Используемое для представления и формул в документах . MathML рекомендован математической группой .

Спецификация MathML версии 1.01 вышла в июле , в феврале появилась версия 2.0. В октябре была опубликована вторая редакция MathML версии 2.0, которая является на настоящий момент последней спецификацией, выпущенной математической группой .

MathML рассматривает не только представление , но и смысл элементов формулы. Также разрабатывается система разметки математической семантики, призванная дополнить MathML. Она называется OpenMath.

Пример

Поддержка программного обеспечения

Основными , непосредственно поддерживающими MathML, являются последние версии и его разновидности. Многие другие браузеры поддерживают этот формат при установке соответствующих . Например, в для поддержики MathML используется плагин MathPlayer.

Кроме того, MathML поддерживается основными офисными программами, такими как и , а также математическими программными продуктами, например,

.

Необходимость разметки MathML вызвана тем, что формат HTML, несмотря на множество замечательных свойств, имеет довольно-таки ограниченные возможности передачи математических обозначений. Чаще всего формулы на HTML-страницах представляются в виде графики (растровой или векторной), но этот способ имеет очевидные недостатки. Например, формулу-рисунок практически невозможно отредактировать, а качество ее при печати обычно оставляет желать лучшего. Развитие идей и привело к созданию целого семейства языков математической разметки, к которым относится и MathML. Разработчики осознавали глубину проблематики и поставили цель создать спецификацию, удовлетворяющую следующим ограниченным, но все же достаточно важным требованиям:

ü легкость освоения и ручного набора основных математических обозначений

ü максимальная совместимость с другими математическими форматами, которая должна обеспечиваться соответствующими конвертами

ü возможность вывода формул на различные терминальные устройства

ü поддержка расширяемости, т. е. введения новых символов, схем.

Общий принцип использования MathML состоит в том, что математические конструкции встраиваются в обычный HTML-документ и воспроизводятся при загрузке документа из сети.

Язык MathML предлагает гибкую и расширяемую систему записи математического материала, позволяющую взаимодействовать с внешними программами и осуществлять высококачественное отображение в различных информационных средах. Общий принцип использования MathML состоит во встраивании математических конструкций в XHTML/HTML-документ. Cоздание веб-страниц с использованием MathML возможно тремя способами: HTML + презентационный MathML, XHTML + презентационный MathML, XML + MathML

Для преобразования математических выражений в MathML существует множество утилит . Основными браузерами , непосредственно поддерживающими MathML, являются последние версии Mozilla и его разновидности. Многие другие браузеры поддерживают этот формат при установке соответствующих плагинов . Кроме того, MathML поддерживается основными офисными программами, такими как Microsoft Word и OpenOffice.org , а также математическими программными продуктами например, Mathematica , Maple . MathML — о чень мощный и универсальный язык разметки формул. Правда, ред актировать формулы (и читать) довольно тяжело . Язык MathML построен по XML-технологии и для задания фрагментов формул используются свои теги.

Пример описания простой формулы

x

+

3

Пример 2

Вставка формул в html-документы с помощью разметки TeX

TeX – это популярный язык разметки, который используют многие люди, особенно в математическом мире, текстовый процессор, система форматирования документов.

Пакет позволяет автоматизировать многие задачи набора текста и подготовки статей, включая набор текста на нескольких языках, нумерацию разделов и формул, перекрёстные ссылки, размещение иллюстраций и таблиц на странице, ведение библиографии и др.

Формулы в LaTeX набираются с помощью специальных команд. Например, формула для нормального распределения в LaTeX будет выглядеть так: \frac{1}{\sigma\sqrt{2\pi}}\exp\left(-\frac{(x-\mu) ^2}{2\sigma^2}\ right)

а отображаться будет так:

Исходный код математической формулы записывается внутри тега ... Пробелы игнорируются (ТеХ их сделает сам). Пустые строки не разрешаются.

Достоинства TEX:

  • программные реализации TEX есть практически для всех типов компьютеров
  • низкие требования к аппаратным ресурсам (для работы достаточно IBM PC совместимого компьютера с 286/386 процессором)
  • переносимость исходных текстов, (результаты форматирования, т.е. конечный вид вашего документа, будет идентичен для все платформ)
  • при печати получается текст типографского качества,
  • большое количество бесплатных реализаций
  • возможность подготовки математических и других формул любой сложности которые будут прекрасно смотреться при печати, затрачивая при этом минимум усилий
  • расширяемость (на основе имеющихся базовых команд можно создавать свои, более сложные)

Одной из основных функций, заложенных в TeX при его проектировании, была возможность простого набора математических формул.

Набор сложных формул существенно легче и быстрее «визуальных» редакторов (M$ Equation, MathCAD). В особенности это заметно, где требуется выравнивание формул относительно друг друга, расстановка нумерации, а также при использовании нестандартных математических обозначений.

Формулы поддерживаются только в нотации TeX. Пример:

notation=’TeX’>E=mc^2

что будет выглядеть так:

Вставка формул в html-документы в виде рисунков

Самый простой способ — вставлять формулы как растровые картинки с помощью тэга img . Изображение формулы может быть получено как вручную (из визуального редактора формул), так и автоматически. Формулы представляются в виде вставных объектов, внедренных в документ. Они могут содержать многоэтажные простые дроби, греческие буквы, матрицы.

Преимущества:

отображаются так же, как и в оригинале во всех браузерах, отображающих картинки

сравнительно легко копируется в документы Office

Недостатки:

самый большой размер страницы с формулами из всех рас смативаемых вариантов

невозможно изменить размер формулы - зачастую она либо слишком мелкая, либо слишком крупная относительно текста либо слишком мелкая, либо слишком крупная относительно текста

плохо смотрится при выводе на печать - не совпадают разрешения

невозможно изменить формулу без её исходного кода и специальной программы

довольно тяжело отцентровать формулу, находящуюся в тексте

невозможно перенести формулу по словам - разбить на несколько строк при необходимости

Использованная литература.

1. Галактионов В.В. Расширяемый язык разметки XML (Extensible Mark-up Language): промышленный стандарт, определяющий архитектуру программных средств Интернет следующего поколения. Сообщение ОИЯИ, Р10-2000-44, Дубна, 2000.

2. Д. Кнут. «Все про TeX.»

3. http://math.accent.kiev.ua

4. http://www.raleigh.ru/ MathML /MathML2/chapter2.html ·

5. www.elbib.ru/index.phtml?page=elbib/rus/journal/2005/

6. http://www.ibb.ru/articles/ tex /node3.phtml

До выхода HTML5 использование формул было сущим наказанием. Судите сами: в 2005-м необходимо было иметь под рукой либо специальный браузер, либо разбивать текст на собственно HTML и вставки из изображений или PDF. Поиск и прочие операции редактирования и/или вывода на экран/бумагу был неоднозначной задачей, коей посвящались целые монографии .

В 2012-м было уже попроще. Появилась возможность подключать необходимые плагины (Firemath для FireFox и Daum Equation Editor для Chrome). Но неоднозначность стандартов (и поддержки) фактически заставляла писать одну и ту же статью для каждого из браузеров (и для их версий). Или встречать пользователей волшебным приветствием «Ваш браузер надо обновить/дополнить расширением».

Неудобно? - Да! Отнимало много времени на поиск универсального решения? - Да! Заставляет думать о том, какой тип записи лучше (презентационный или содержательный), каким конвертером пользоваться (а их только общеизвестных с десятка полтора)? - ДА! ДА! ДА!

В результате работа по публикации превращалась в освоение двух-трех лексиконов разметки и изучения работы минимум одной программы-перекодировщика.

Теперь, с приходом HTML5, все стало намного проще. В нем появился новый контейнер .
Каждый допустимый экземпляр MathML должен быть внутри этого контейнера.
Он не допускает вложений, но внутри может быть произвольное число других дочерних элементов.

Атрибуты тэга

В дополнение к следующим атрибутам, тэг воспринимает любые атрибуты из "> .

class, id, style
При условии использования вместе с таблицами стилей .
dir
Указывает направление формулы: ltr - слева направо или rtl - справа налево.
ref
Используется для установки гиперссылки на указанный URI.
mathbackground
Цвет фона. Вы можете использовать #rgb , #rrggbb и названия цветов HTML .
mathcolor
Цвет текста. Вы можете использовать #rgb , #rrggbb и названия цветов HTML .
display
Этот атрибут определяет способ вывода. Возможные значения:

  • block - означает, что этот элемент будет отображаться за пределами текущего диапазона текста, как блока, который может быть расположен в любом месте без изменения смысла текста;
  • inline -означает, что этот элемент будет отображаться внутри текущего диапазона текста, и не могут быть перемещены из нее без изменения значения этого текста.

Значение по умолчанию inline .

Mode

Устаревшие значение display attribute .
Возможные значения: display (который имеет тот же эффект, как display="block") и inline .
overflow
Определяет, как выражение ведет себя, если текст слишком длинный и не помещается в указанном диапазоне ширины.
Возможные значения: linebreak (по умолчанию), scroll , elide , truncate , scale .

Примеры

Представление в HTML5

MathML in HTML5 a 2 + b 2 = c 2

Представление в XHTML

MathML in XHTML a 2 + b 2 = c 2
Примечания: XHTML документы с MathML должны быть поданы как application/xhtml+xml . Вы можете легко добиться этого, добавив.xhtml расширение для локальных файлов. Для серверов Apache вы можете настроить.htaccess файл для этого расширения на правильный тип MIME. Поскольку мы сохранили наш MathML в виде XML-документа, необходимо быть уверенным в правильно оформленном XML-документе.

Поддержка браузерами

Поддержка браузерами

Полноценные версии
Элемент Chrome Firefox (Gecko) Internet Explorer Opera Safari
XHTML описание (только 24-я) 1.0 (1.7 и выше) 9.5 5.1
HTML5 описание (только 24-я) 4.0 (2.0) 5.1
dir 12.0 (12.0)
href WebKit bug 85733 7.0 (7.0) WebKit bug 85733
mathbackground (только 24-я) 4.0 (2.0) 5.1
mathcolor (только 24-я) 4.0 (2.0) 5.1
overflow

Мобильные версии

Элемент Android Chrome для Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
XHTML описание 1.0 (1.0)
HTML5 описание 4.0 (2.0)
dir 12.0 (12.0)
href 7.0 (7.0)
mathbackground 4.0 (2.0)
mathcolor 4.0 (2.0)
overflow