MathML – Cálculos no browser sem imagens
by renie on jan 29th in Artigos, Dicas, Tutoriais Desenvolvimento
No post anterior falei da existência de uma linguagem de marcação chamada MathML, que é baseada em XML e serve para representar melhor fórmulas matemáticas na web. Resolvi então mostrar algumas tags e como funciona. Vocês vão reparar que para os resultados eu usarei imagens, por um simples motivo: alguns navegadores precisam de plugin para entender o código( como o IE), mas se vocês testarem esses código no Firefox, por exemplo, poderão ver que funciona 
Farei no mesmo esquema de sempre, vou colocar o código e uma explicação dele abaixo, acho mais fácil dessa forma.
<!DOCTYPE math PUBLIC "-//W3C//DTD MathML 2.0//EN" "http://www.w3.org/Math/DTD/mathml2/mathml2.dtd">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mi>a</mi>
<msup>
<mi>x</mi>
<mn>2</mn>
</msup>
<mo>+</mo>
<mi>b</mi>
<mi>x</mi>
<mo>+</mo>
<mi>c</mi>
</mrow>
</math>
Pode parecer chato/trabalhoso, na verdade é mesmo hahaha. Primeiramente incluí o doctype , disse de onde que to pegando o namespace do XML e só então começa a brincadeira. Primeiro uma <mrow> que é só uma inclusão de uma linha onde estará a fórmula, aí vem a tag <mi> que diz que aquilo é somente um identificador, <msup> informa que seus filhos correspondem a uma potência, <mn> é para numeros e <mo> pra operadores. Viu não foi tão dificil. Esse código resultaria em:
Aí podemos brincar com outras tags como <mfrac> para frações, aí no caso usariamos 2 <mrow> para fazer o numerador e o denominador;<msqrt> para raíz quadrada, tudo que estiver entre a abertura e o fechamento da tag estará dentro do simbolo da raíz;<msub> para fazer logaritmo por exemplo;<mroot> com <mn> dentro, para fazer raiz de qualquer grau… enfim aí é só deixar a imaginação. No código abaixo uso mais algumas tags.
<!DOCTYPE math PUBLIC "-//W3C//DTD MathML 2.0//EN" "http://www.w3.org/Math/DTD/mathml2/mathml2.dtd"></pre>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mi>x</mi>
<mo>=</mo>
<mfrac>
<mrow>
<mo form="prefix">−<!-- − --></mo>
<mi>b</mi>
<mo>±<!-- ± --></mo>
<msqrt>
<msup>
<mi>b</mi>
<mn>2</mn>
</msup>
<mo>−<!-- − --></mo>
<mn>4</mn>
<mi>a</mi>
<mi>c</mi>
</msqrt>
</mrow>
<mrow>
<mn>2</mn>
<mi>a</mi>
</mrow>
</mfrac>
</mrow>
</math>
Que resultaria em:
E poraí vai.
Tirei o print também de uma outra fórmula que achei, foi feita com MathML eu garanto, mas não tive saco de tentar refazer pra postar aqui, então fica como exercício pra quem quiser brincar hahahahaha.
Abraço
[ UPDATE ]
Vale lembrar que para usar o doctype correto com MathML no meio do XHTML, temos que dizer que usaremos as duas linguagens de marcação. ficaria assim:
3 Comentários