Esta página explica como se escreve matemática através da linguagem MathML. Como o HTML, o MathML é descrito com tags e atributos. O HTML torna-se verboso quando o seu documento contém estruturas avançadas como listas ou tabelas mas felizmente existem muitos geradores de simples notações, editores WYSIWYG e outros Sistemas de Gestão de Conteúdos para ajudar a escrever páginas Web.
Mathematical notations are even more complex with structures like fractions, square roots or matrices that are likely to require their own tags. As a consequence, good MathML authoring tools are more important and we describe some tools below. In particular, the Mozilla MathML team has been developing TeXZilla, a Javascript Unicode LaTeX-to-MathML converter that is intended to be used in many scenarios described here. Of course, the list is by no means exhaustive and you are invited to check out the W3C MathML software list where you can find various other tools.
As notações matemáticas são ainda mais complexas com estruturas como fracções, raízes quadradas ou matrizes que provavelmente exigirão as suas próprias etiquetas. Como consequência, as boas ferramentas de autoria de MathML são mais importantes, e descrevemos algumas ferramentas abaixo. Em particular, a equipa do Mozilla MathML tem vindo a desenvolver o TeXZilla, um conversor Javascript Unicode LaTeX para MathML que se destina a ser utilizado em muitos cenários aqui descritos. É claro que a lista não é de modo algum exaustiva e está convidado a consultar a lista de software MathML do W3C, onde pode encontrar várias outras ferramentas.
MathML está bem integrado em HTML5 e, em particular, pode usar características habituais da Web como CSS, DOM, Javascript ou SVG. Isto está fora do âmbito deste documento, mas qualquer pessoa com conhecimentos básicos de línguas Web poderá facilmente misturar estas características com MathML. Consulte as nossas demos e referências de MathML para mais detalhes.
Pode usar Presentation MathML dentro de documentos de 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 não é suportado por navegadores. É recomendado converter o conteudo de Content MathML em Presentation MathML antes do publicar, como o stylesheet ctop.xsl. As ferramentas mencionadas nesta página gerem Presentation MathML.
Infelizmente, alguns navegadores não são capazes de fazer equações MathML ou têm apenas um suporte limitado. Consequentemente, será necessário utilizar um polyfil para MathML para fornecer alguma renderização de recurso. Se precisar apenas de construções matemáticas básicas como as utilizadas nesta wiki MDN, então uma pequena folha de estilo mathml.css poderá ser suficiente. Para a utilizar, basta inserir uma linha no cabeçalho do seu documento:
<script src="https://fred-wang.github.io/mathml.css/mspace.js"></script>
Se precisar de construções mais complexas, poderá, em vez disso, considerar a utilização da biblioteca MathJax mais pesada como um polifill MathML:
Se precisar de construções mais complexas, poderá, em vez disso, considerar a utilização da biblioteca MathJax mais pesada como um polifill MathML:
<script src="https://fred-wang.github.io/mathjax.js/mpadded-min.js"></script>
É de destacar que estes dois scripts realizam a detecção dos elementos mspace ou mpadded (ver a tabela de compatibilidade nestas páginas). Existe também um script semelhante para exibir um aviso no topo da página para navegadores sem bom suporte MathML e deixar os utilizadores escolherem entre uma das alternativas acima:
<script src="https://fred-wang.github.io/mathml-warning.js/mpadded-min.js"></script>
Se não quiser utilizar esta hiperligação para o GitHub mas sim integrar estes polyfills ou outros no seu próprio projecto, poderá precisar dos scripts de detecção para verificar o nível de suporte de MathML. Por exemplo, a função seguinte verifica o suporte MathML testando o elemento mspace (pode substituir o mspace por 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;
}
Em alternativa, o seguinte deteção de strings do UA permitirá detectar os motores de renderização com suporte nativo de MathML (Gecko e WebKit). Note-se que a deteção de strings do UA não é o método mais fiável e pode falhar de versão para versão:
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;
A fim de obter uma boa formatação ou de permitir um estilo diferente, é importante ter fontes matemáticas disponíveis. É sempre bom fornecer uma ligação às Instruções de Fontes da MDN, para que os seus visitantes possam verificar se têm fontes apropriadas instaladas no seu sistema. Também é bom fornecer um contigente com fontes da Web.
Antes de Gecko 31.0 {{GeckoRelease("31.0")}}, era um pouco aborrecido configurar fontes matemáticas (ver as instruções da fonte para Mozilla 2.0). Para Gecko 31.0 {{GeckoRelease("31.0")}}, isto é muito mais simples e é compatível com qualquer motor de renderização Web com suporte MathML. Por exemplo, aqui está uma folha de estilo mínima para usar o latim moderno para o texto e o latim moderno matemático para a matemática:
@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;
}
Pode usar a regra @font-face como normal para ofrecer uma alternativa WOFF para Latin Modern e Latin Modern Math. Veja este repositório no GitHub para encontrar fontes WOFF e exemplos de stylesheets de CSS para usar no seu site e verifique a página de teste.
Se por alguma razão precisar de usar MathML em documentos de XML, certifique-se que satisfaz os requerimentos habituais: um documento bem formatado, o tipo de MIME correto, o namespace de MathML "http://www.w3.org/1998/Math/MathML" nas raizes <math>. Por exemplo, a versão XHTML do exemplo anterior fica assim:
<?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 Example</h1> <p> Square root of two: <math xmlns="http://www.w3.org/1998/Math/MathML"> <msqrt> <mn>2</mn> </msqrt> </math> </p> </body> </html>
Os clientes de correio modernos podem enviar e receber correio electrónico no formato HTML5 e assim podem utilizar expressões MathML. Certifique-se de que as opções "enviar como HTML" e "ver como HTML" estão activadas. No Thunderbird, pode usar o comando "Inserir HTML" para colar o seu código HTML e MathML. MathBird é um add-on conveniente para o Thunderbird inserir tais expressões MathML usando a sintaxe de AsciiMath. Além disso, uma caixa de entrada LaTeX-to-MathML foi também integrada no SeaMonkey desde a versão 2.28 e no Thunderbird desde a versão 31. A forma como o MathML é tratado e a qualidade da renderização do MathML depende do cliente de correio e mesmo que o seu browser suporte MathML, o seu Webmail pode impedi-lo de enviar ou receber e-mails com MathML dentro.
Os clientes de mensagens instantâneas baseadas no Gecko podem integrar um conversor de texto para MathML baseado em Javascript (mencionado abaixo) e depois renderizar as expressões MathML geradas a partir das mensagens instantâneas (em texto simples). Por exemplo, existe um add-on para o Instantbird que trata das expressões LaTeX.
Existem muitas notações simples (por exemplo, wiki ou sintaxes markdown) para gerar páginas HTML. O mesmo é válido para MathML: por exemplo, as sintaxes ASCII utilizadas em calculadoras ou a linguagem mais poderosa LaTeX, muito popular entre a comunidade científica. Nesta secção, apresentamos algumas destas ferramentas para converter de uma simples sintaxe para MathML.
In a Web environment, the most obvious method to convert a simple syntax into a DOM tree is to use Javascript and of course many libraries have been developed to perform that task.
TeXZilla has an <x-tex> custom element, that can be used to write things like
<x-tex>\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1</x-tex>
and get it automatically converted into MathML. This is still a work-in-progress, but could be improved in the future thanks to Web Components and shadow DOM. Alternatively, you can use the more traditional Javascript parsing of expressions at load time as all the other tools in this section do.
One simple client-side conversion tools is ASCIIMathML. Just download the ASCIIMathML.js script and copy it to your Web site. Then on your Web pages, add a <script> tag to load ASCIIMathML and the mathematical expressions delimited by ` (grave accent) will be automatically parsed and converted to MathML:
<html> <head> ... <script type="text/javascript" src="ASCIIMathML.js"></script> ... </head> <body> ... <p>blah blah `x^2 + y^2 = r^2` blah ... ...
LaTeXMathML is a similar script that allows to parse more LaTeX commands. The installation is similar: copy LaTeXMathML.js and LaTeXMathML.standardarticle.css, add links in the header of your document and the LaTeX content of your Web page marked by the "LaTeX" class will be automatically parsed and converted to 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 is another script to parse a simple LaTeX-like syntax but which also accepts non-ASCII characters like √{∑↙{n=1}↖{+∞} 6/n^2} = π to write . The installation is similar: download and copy the relevant Javascript and CSS files on your Web site and reference them in your page header (see the COPY-ME.html file from the zip archive for an example). One of the advantage of jqMath over the previous scripts is that it will automatically add some simple CSS rules to do the mathematical layout and make the formulas readable on browsers with limited MathML support.
An alternative way is to parse the simple syntax before publishing your web pages. That is, you use command-line programs to generate them and publish these static pages on your server.
TeXZilla can be used from the command line and will essentially have the same support as itex2MML described below. However, the stream filter behavior is not implemented yet.
If you only want to parse simple LaTeX mathematical expressions, you might want to try tools like itex2MML or Blahtex. The latter is often available on Linux distributions. Let's consider the former, which was originally written by Paul Gartside at the beginning of the Mozilla MathML project and has been maintained by Jacques Distler since then. It's a small stream filter written in C/C++ and generated with flex and bison ; in particular it is very fast. Install flex/bison as well as the classical compiler and make tools. On Unix, you can then download itex2MML, build and install it:
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
Now suppose that you have a HTML page with TeX fragments delimited by dollars:
input.html
...
</head>
<body>
<p>$\sqrt{a^2-3c}$</p>
<p>$$ {\sum_{i=1}^N i} = \frac{N(N+1)}{2} $$</p>
</body>
</html>
Then to generate the HTML page input.html with TeX expressions replaced by MathML expressions, just do
cat input.html | itex2MML > output.html
There are even more sophisticated tools to convert arbitrary LaTeX documents into HTML+MathML. For example TeX4ht is often included in TeX distributions and has an option to use MathML instead of PNG images. This command will generate an XHTML+MathML document foo.xml from a foo.tex LaTeX source:
mk4ht mzlatex foo.tex # Linux/Mac platforms mzlatex foo.tex # Windows platform
Note that tex4ebook relies on TeX4ht to generate EPUB documents.
LaTeXML is another tool that can generate HTML5 and EPUB documents. Windows users can watch this video tutorial. Given a foo.tex LaTeX file, you can use these simple commands:
latexmlc --dest foo.html foo.tex # Generate a HTML5 document foo.html latexmlc --dest foo.epub foo.tex # Generate an EPUB document foo.epub
To handle the case of browsers without MathML support, you can use the --javascript parameter to tell LaTeXML to include one of the fallback scripts:
latexmlc --dest foo.html --javascript=https://fred-wang.github.io/mathml.css/mspace.jsfoo.tex # Add the CSS fallback latexmlc --dest foo.html --javascript=https://fred-wang.github.io/mathjax.js/mpadded-min.jsfoo.tex # Add the MathJax fallback
If your LaTeX document is big, you might want to split it into several small pages rather than putting everything in a single large page. For example, this will split the pages at the \section level:
latexmlc --dest foo.html --splitat=section foo.tex
TeXZilla, LaTeXML and Mathoid and can be used to to perform server-side LaTeX-to-MathML conversion. Instiki and MediaWiki are two wiki engines that support LaTeX-to-MathML conversion.
TeXZilla has several interfaces, including a CKEditor plugin used on MDN, an online demo, a Firefox add-on or a FirefoxOS Webapp. It has also been integrated into SeaMonkey since version 2.28 and into Thunderbird since version 31. Abiword contains a small equation editor, based on itex2MML. Finally, Bluegriffon has an add-on to insert MathML formulas in your document, using ASCII/LaTeX-like syntax.
Firemath é uma extensão para Firefox que fornece um editor WYSIWYG MathML. Uma pré-visualização da fórmula é apresentada utilizando o motor da renderização do Mozilla. O código MathML gerado está visivel na parte inferior. Utilize o campo de texto para elementos simbólicos e botões para construir construções avançadas. Uma vez terminado, pode guardar o seu documento como uma página XHTML.
LyX é um editor gráfico LaTeX, que tem suporte integrado para exportação de XHTML e MathML e pode ser configurado para utilizar conversores LaTeX-para-(X)HTML semelhantes. Pode, por exemplo, configurá-lo para utilizar a exportação LaTeXML HTML5/EPUB.
O OpenOffice e o LibreOffice têm um editor de equações (File → New → Formula). Isto é parecido a um WYSIWYG: o utilizador escreve o código usando um painel/teclado e uma pré-visualização é regularmente atualizada. O editor usa o seu próprio sintaxe "StarMath", mas MathML também e criado quando o documneto é guardado. Para aceder ao código MathML, guarda o documento como um .mml e abre o ficheiro com um editor de texto. Em alternativa, pode extrair o ficheiro .odf (que na realidade é um arquivo ZIP) e abrir um ficheiro XML chamado content.xml.
Amaya é o editor da web do W3C, que é capaz de lidar com MathML dentro de documentos XHTML. Utilize os painéis de Elementos e Cartas Especiais para criar várias construções matemáticas avançadas. Texto simples como a+2 é automaticamente analisado e a marcação MathML apropriada é gerada. Uma vez terminado, pode guardar directamente a sua página XHTML e abri-la em Mozilla.
Inftyreader é capaz de fazer o reconhecimento óptico de carateres, inclusive a conversão de equações matemáticas para MathML. Outras ferramentas fazem reconhecimento de caligrafia, como o Windows Math Input Panel ou o conversor online Web Equation.