Aprenda a linguagem MathML

MathML √© uma linguagem de marca√ß√£o que pode ser usada para exibir representa√ß√Ķes matem√°ticas em suas p√°ginas da web. √Č especialmente √ļtil quando voc√™ deseja mostrar mais de um simbolismo simples da Matem√°tica em seus sites e √© muito f√°cil de usar devido √† sua simplicidade e semelhan√ßa com o HTML.

logotipo mathml

O MathML possui dois tipos de rotulagem, apresenta√ß√£o (para layout) e conte√ļdo (para significado). Como os navegadores oferecem suporte apenas √† apresenta√ß√£o, esse √© o √ļnico tipo de marca√ß√£o que pode ser usado com HTML. Voc√™ tamb√©m pode usar MathML em CSS e JavaScript, assim como faria em HTML.

Compreendendo o MathML

Há uma lista de comandos MathML no site Mozilla Developer. Você também encontrará uma lista de comandos no final deste artigo.

O comando básico com o qual seu navegador entende que a programação do MathML está iniciando é

. Então, quando você escreve código MathML em HTML, lembre-se de colocá-lo dentro

etiquetas.

Os comandos b√°sicos s√£o: ,,, e representam um identificador, operador, n√ļmero e uma string, respectivamente. Observe que todos os comandos MathML abaixo come√ßam com a letra “m”.

Mas vamos dar uma olhada em alguns exemplos simples.

N√ļmero da Exposi√ß√£o (ou n√ļmero em vigor N)

O comando correspondente para a exibição do expoente é . H é o correspondente para o índice.


n
7

Isso nos dar√° o formul√°rio:

1

Apar√™ncia de fra√ß√Ķes


7
26

Isso nos dar√° o formul√°rio:

ex2

Surgimento de uma raiz inteira

Aqui est√° outro exemplo simples de fun√ß√Ķes matem√°ticas.


678
5

Isso nos dar√° a forma

: ex3

Apenas para raiz quadrada, existe o comando pronto .

Modo de exibição de matriz

Agora, vamos passar para representa√ß√Ķes mais complexas, vamos mostrar uma matriz.Para criar uma tabela, precisamos ter uma estrutura de tabela para linhas e colunas. Para esse fim, usamos os comandos , e .

Al√©m disso, usaremos a tag adicionar s√≠mbolos [ őļőĪőĻ ] ao redor do √ļtero, e finalmente colocamos tudo no comando .

Aqui est√° o resultado final:


[[


0 0
4
10


5
2
X


9
11
1


]

Al√©m disso, veja que brincamos um pouco com CSS para que possamos fazer o “X” vermelho se destacar no √ļtero.

mi {cor: vermelho; }

No final, você receberá o formulário

:  ex4

Como exibir equa√ß√Ķes

Pensamos que podemos dar um passo adiante, em exemplos mais avan√ßados, ent√£o vamos fazer uma equa√ß√£o complexa. Em nosso exemplo, faremos um completo (aqueles que n√£o sabem o que √© um completo, espere at√© o 3¬ļ Liceu). O comando correspondente aqui √©  ex5

Como no HTML, o MatML também possui caracteres e símbolos especiais, um dos quais é usado no exemplo para mostrar o símbolo grego F. Aqui está o código para exibir a integral acima:



f
(
x
)

=


E
uma
b


K
(
x
,
t
)


Phi
(
t
)

d
t


Para obter uma lista de símbolos e caracteres especiais do MathML, você pode encontrar no site do W3C.

Recursos do MathML

Al√©m dos mesmos recursos que o HTML (como o id), o MathML tamb√©m possui v√°rios recursos pr√≥prios. O site do desenvolvedor Mozilla possui uma cole√ß√£o de recursos do MathML. Para obter mais informa√ß√Ķes, voc√™ pode usar a biblioteca JavaScript MavaJax. Se voc√™ precisar de mais ferramentas, confira este link aqui.

Todos os exemplos acima podem ser vistos novamente reunidos abaixo. Experimente op√ß√Ķes de HTML, CSS e resultado:

Veja os exemplos de caneta MathML da Preethi (prpsthecoder) no CodePen.