diff options
| author | Peter Bengtsson <mail@peterbe.com> | 2021-05-12 13:22:31 -0400 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2021-05-12 13:22:31 -0400 |
| commit | 43625bb1ef1cd8fc76b0fefdae4e002989942dd9 (patch) | |
| tree | c246e99ee89a5d1b54ac839e6cbe16bdfb73370e /files | |
| parent | 45300a4083b0334e8bc0c8a7157e3a3d96967cb6 (diff) | |
| download | translated-content-43625bb1ef1cd8fc76b0fefdae4e002989942dd9.tar.gz translated-content-43625bb1ef1cd8fc76b0fefdae4e002989942dd9.tar.bz2 translated-content-43625bb1ef1cd8fc76b0fefdae4e002989942dd9.zip | |
fix external image in files/es/web/mathml/authoring/index.html (#843)
Diffstat (limited to 'files')
| -rw-r--r-- | files/es/web/mathml/authoring/index.html | 190 | ||||
| -rw-r--r-- | files/es/web/mathml/authoring/openoffice.png | bin | 0 -> 12489 bytes |
2 files changed, 114 insertions, 76 deletions
diff --git a/files/es/web/mathml/authoring/index.html b/files/es/web/mathml/authoring/index.html index 774c910cea..f9c30ff92c 100644 --- a/files/es/web/mathml/authoring/index.html +++ b/files/es/web/mathml/authoring/index.html @@ -5,9 +5,9 @@ translation_of: Web/MathML/Authoring --- <p>Este artículo explica como redactar funciones matemáticas utilizando el lenguaje MathML. Al igual que HTML, MathML puede describirse con etiquetas y atributos. HTML puede volverse interminable cuando tu documento contiene estructuras avanzadas como listas o tablas pero afortunadamente existen varios generadores, desde simple notaciones, editores WYSIWYG y otros Sistemas de Administración de Contenido (CMS) utilizados para la creación de páginas web.</p> -<p>Las notaciones Matemáticas son aún más complejas con estructuras que contienen fracciones, raíces cuadradas o matrices que seguramente requerirán sus propias etiquetas. Como consecuencia, las buenas herramientas de redacción de MathML son importantes y más adelante describimos algunas opciones. En particular, el équipo MathML de Mozilla ha creado <a href="https://github.com/fred-wang/TeXZilla/">TeXZilla</a>, un convertor de LaTeX a MathML compatible con Unicode, para ser utilizado en muchos scenari descrito ahí. Desde luego, la lista no es de ninguna manera definitiva y estás invitado a revisar la <a class="external" href="http://www.w3.org/Math/Software/">Lista de Software MathML de W3C</a> donde puedes encontrar diferentes herramientas.</p> +<p>Las notaciones Matemáticas son aún más complejas con estructuras que contienen fracciones, raíces cuadradas o matrices que seguramente requerirán sus propias etiquetas. Como consecuencia, las buenas herramientas de redacción de MathML son importantes y más adelante describimos algunas opciones. En particular, el équipo MathML de Mozilla ha creado <a href="https://github.com/fred-wang/TeXZilla/">TeXZilla</a>, un convertor de LaTeX a MathML compatible con Unicode, para ser utilizado en muchos scenari descrito ahí. Desde luego, la lista no es de ninguna manera definitiva y estás invitado a revisar la <a class="external" href="https://www.w3.org/Math/Software/">Lista de Software MathML de W3C</a> donde puedes encontrar diferentes herramientas.</p> -<p>Hay que señalar que por diseño, MathML está bien integrado en HTML5 y particularmente puedes utilizar las características Web comunes como CSS, DOM, Javascript o SVG. Esto está fuera del ámbito de este artículo pero cualquiera con conocimientos básicos de lenguajes Web será capaz de combinar fácilmente estas características con MathML. Revisa <a href="/en-US/docs/Mozilla/MathML_Project#Sample_MathML_Documents" title="/en-US/docs/Mozilla/MathML_Project#Sample_MathML_Documents">nuestros demos</a> y <a href="https://developer.mozilla.org/en-US/docs/Web/MathML" title="en/MathML/Element">referencias de MathML</a> para más detalles.</p> +<p>Hay que señalar que por diseño, MathML está bien integrado en HTML5 y particularmente puedes utilizar las características Web comunes como CSS, DOM, Javascript o SVG. Esto está fuera del ámbito de este artículo pero cualquiera con conocimientos básicos de lenguajes Web será capaz de combinar fácilmente estas características con MathML. Revisa <a href="/en-US/docs/Mozilla/MathML_Project#Sample_MathML_Documents" title="/en-US/docs/Mozilla/MathML_Project#Sample_MathML_Documents">nuestros demos</a> y <a href="/en-US/docs/Web/MathML" title="en/MathML/Element">referencias de MathML</a> para más detalles.</p> <h2 id="Fundamentos">Fundamentos</h2> @@ -36,7 +36,7 @@ translation_of: Web/MathML/Authoring </body> </html> </pre> -<p>Content MathML no esta soportado por el navegador. Es recomendable convertir tu content MathML markup en Presentation MathML antes de publicarlo, por ejemplo con la ayuda de la hoja de calculo <a class="external external-icon" href="http://code.google.com/p/web-xslt/source/browse/trunk/#trunk/ctop">ctop.xsl</a> . Las herramientas mencionadas en esta pagina generan Presentation MathML.</p> +<p>Content MathML no esta soportado por el navegador. Es recomendable convertir tu content MathML markup en Presentation MathML antes de publicarlo, por ejemplo con la ayuda de la hoja de calculo <a class="external external-icon" href="https://code.google.com/p/web-xslt/source/browse/trunk/#trunk/ctop">ctop.xsl</a> . Las herramientas mencionadas en esta pagina generan Presentation MathML.</p> <h4 id="sect1"> </h4> @@ -44,28 +44,28 @@ translation_of: Web/MathML/Authoring <p>Desafortunadamente, algunos navegadores no son capaces de renderizar ecuaciones MathML o tienen un soporte limitado. Por lo tanto necesitará usar MathML polyfill para proveer el renderizado. Si necesita solo construcciones matematicas básicas tales como las utilizadas en esta wiki de MDN entonces una pequeña hoja de cálculo <a href="https://github.com/fred-wang/mathml.css">mathml.css</a> podria ser suficiente. Para usarlo, solo inserta una linea en el header de tu documento:</p> -<pre class="brush: html language-html"><code class="language-html"><span class="script token"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://fred-wang.github.io/mathml.css/mspace.js<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span></span></code></pre> +<pre class="brush: html language-html"><script src="http://fred-wang.github.io/mathml.css/mspace.js"></script></pre> -<p>If you need more complex constructions, you might instead consider using the heavier <a href="http://www.mathjax.org" title="http://www.mathjax.org">MathJax</a> library as a MathML polyfill:</p> +<p>If you need more complex constructions, you might instead consider using the heavier <a href="https://www.mathjax.org" title="http://www.mathjax.org">MathJax</a> library as a MathML polyfill:</p> -<pre class="brush: html language-html"><code class="language-html"><span class="script token"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://fred-wang.github.io/mathjax.js/mpadded.js<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span></span></code></pre> +<pre class="brush: html language-html"><script src="http://fred-wang.github.io/mathjax.js/mpadded.js"></script></pre> -<p>Note that these two scripts perform feature detection of the <a href="https://developer.mozilla.org/en-US/docs/Web/MathML/Element/mspace">mspace</a> or <a href="https://developer.mozilla.org/en-US/docs/Web/MathML/Element/mpadded">mpadded</a> elements (see the browser compatibility table on these pages). If you don't want to use this link to GitHub but instead to integrate these polyfills or others in your own project, you might need the detection scripts to verify the level of MathML support. For example the following function verifies the MathML support by testing the mspace element (you may replace <code>mspace</code> with <code>mpadded</code>):</p> +<p>Note that these two scripts perform feature detection of the <a href="/en-US/docs/Web/MathML/Element/mspace">mspace</a> or <a href="/en-US/docs/Web/MathML/Element/mpadded">mpadded</a> elements (see the browser compatibility table on these pages). If you don't want to use this link to GitHub but instead to integrate these polyfills or others in your own project, you might need the detection scripts to verify the level of MathML support. For example the following function verifies the MathML support by testing the mspace element (you may replace <code>mspace</code> with <code>mpadded</code>):</p> -<pre class="brush: js language-js"><code class="language-js"> <span class="keyword token">function</span> <span class="function token">hasMathMLSupport<span class="punctuation token">(</span></span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">var</span> div <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement<span class="punctuation token">(</span></span><span class="string token">"div"</span><span class="punctuation token">)</span><span class="punctuation token">,</span> box<span class="punctuation token">;</span> - div<span class="punctuation token">.</span>innerHTML <span class="operator token">=</span> <span class="string token">"<math><mspace height='23px' width='77px'/></math>"</span><span class="punctuation token">;</span> - document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">appendChild<span class="punctuation token">(</span></span>div<span class="punctuation token">)</span><span class="punctuation token">;</span> - box <span class="operator token">=</span> div<span class="punctuation token">.</span>firstChild<span class="punctuation token">.</span>firstChild<span class="punctuation token">.</span><span class="function token">getBoundingClientRect<span class="punctuation token">(</span></span><span class="punctuation token">)</span><span class="punctuation token">;</span> - document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">removeChild<span class="punctuation token">(</span></span>div<span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="keyword token">return</span> Math<span class="punctuation token">.</span><span class="function token">abs<span class="punctuation token">(</span></span>box<span class="punctuation token">.</span>height <span class="operator token">-</span> <span class="number token">23</span><span class="punctuation token">)</span> <span class="operator token"><</span><span class="operator token">=</span> <span class="number token">1</span> <span class="operator token">&&</span> Math<span class="punctuation token">.</span><span class="function token">abs<span class="punctuation token">(</span></span>box<span class="punctuation token">.</span>width <span class="operator token">-</span> <span class="number token">77</span><span class="punctuation token">)</span> <span class="operator token"><</span><span class="operator token">=</span> <span class="number token">1</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span></code></pre> +<pre class="brush: js language-js"> 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; +}</pre> <p>Alternatively, the following UA string sniffing will allow to detect the rendering engines with native MathML support (Gecko and WebKit). Note that UA string sniffing is not the most reliable method and might break from version to version:</p> -<pre class="brush: js language-js"><code class="language-js"><span class="keyword token">var</span> ua <span class="operator token">=</span> navigator<span class="punctuation token">.</span>userAgent<span class="punctuation token">;</span> -<span class="keyword token">var</span> isGecko <span class="operator token">=</span> ua<span class="punctuation token">.</span><span class="function token">indexOf<span class="punctuation token">(</span></span><span class="string token">"Gecko"</span><span class="punctuation token">)</span> <span class="operator token">></span> <span class="operator token">-</span><span class="number token">1</span> <span class="operator token">&&</span> ua<span class="punctuation token">.</span><span class="function token">indexOf<span class="punctuation token">(</span></span><span class="string token">"KHTML"</span><span class="punctuation token">)</span> <span class="operator token">==</span><span class="operator token">=</span> <span class="operator token">-</span><span class="number token">1</span> <span class="operator token">&&</span> ua<span class="punctuation token">.</span><span class="function token">indexOf<span class="punctuation token">(</span></span><span class="string token">'Trident'</span><span class="punctuation token">)</span> <span class="operator token">==</span><span class="operator token">=</span> <span class="operator token">-</span><span class="number token">1</span><span class="punctuation token">;</span> -<span class="keyword token">var</span> isWebKit <span class="operator token">=</span> ua<span class="punctuation token">.</span><span class="function token">indexOf<span class="punctuation token">(</span></span><span class="string token">'AppleWebKit'</span><span class="punctuation token">)</span> <span class="operator token">></span> <span class="operator token">-</span><span class="number token">1</span> <span class="operator token">&&</span> ua<span class="punctuation token">.</span><span class="function token">indexOf<span class="punctuation token">(</span></span><span class="string token">'Chrome'</span><span class="punctuation token">)</span> <span class="operator token">==</span><span class="operator token">=</span> <span class="operator token">-</span><span class="number token">1</span><span class="punctuation token">;</span></code></pre> +<pre class="brush: js language-js">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;</pre> <h4 id="sect2"> </h4> @@ -73,14 +73,14 @@ translation_of: Web/MathML/Authoring <p><strong>Note: browsers can only use a limited set of mathematical fonts to draw stretchy MathML operators. However, implementation of the OpenType MATH table is in progress in Gecko & WebKit. This will provide a generic support for mathematical fonts and simplify the settings described in this section.</strong></p> -<p>To get a good mathematical rendering in browsers, some <a href="https://developer.mozilla.org/docs/Mozilla/MathML_Project/Fonts" title="/docs/Mozilla/MathML_Project/Fonts">MathML fonts</a> are required. It's a good idea to provide to your visitors a link to the <a href="https://developer.mozilla.org/docs/Mozilla/MathML_Project/Fonts" title="/docs/Mozilla/MathML_Project/Fonts">MDN page that explains how to install MathML fonts</a>. Alternatively, you can just make them available as Web fonts. You can get these fonts from the <a href="https://addons.mozilla.org/en-US/firefox/addon/mathml-fonts/" title="https://addons.mozilla.org/en-US/firefox/addon/mathml-fonts/">MathML-fonts add-on</a> ; the xpi is just a zip archive that you can fetch and extract for example with the following command:</p> +<p>To get a good mathematical rendering in browsers, some <a href="/docs/Mozilla/MathML_Project/Fonts" title="/docs/Mozilla/MathML_Project/Fonts">MathML fonts</a> are required. It's a good idea to provide to your visitors a link to the <a href="/docs/Mozilla/MathML_Project/Fonts" title="/docs/Mozilla/MathML_Project/Fonts">MDN page that explains how to install MathML fonts</a>. Alternatively, you can just make them available as Web fonts. You can get these fonts from the <a href="https://addons.mozilla.org/en-US/firefox/addon/mathml-fonts/" title="https://addons.mozilla.org/en-US/firefox/addon/mathml-fonts/">MathML-fonts add-on</a> ; the xpi is just a zip archive that you can fetch and extract for example with the following command:</p> -<pre class="brush: bash language-html"><code class="language-html">wget https://addons.mozilla.org/firefox/downloads/latest/367848/addon-367848-latest.xpi -O mathml-fonts.zip; \ -unzip mathml-fonts.zip -d mathml-fonts</code></pre> +<pre class="brush: bash language-html">wget https://addons.mozilla.org/firefox/downloads/latest/367848/addon-367848-latest.xpi -O mathml-fonts.zip; \ +unzip mathml-fonts.zip -d mathml-fonts</pre> <p>Then copy the <code>mathml-fonts/resource/</code> directory somewhere on your Web site and ensure that the woff files are served with the correct MIME type. Finally, include the <code>mathml-fonts/resource/mathml.css</code> style sheet in your Web pages, for example by adding the following rule to the default style sheet of your Web site:</p> -<pre class="brush: css language-css"><code class="language-css"><span class="atrule token">@import url('/path/to/resource/mathml.css')</span><span class="punctuation token">;</span></code></pre> +<pre class="brush: css language-css">@import url('/path/to/resource/mathml.css');</pre> <p><span>You then need to modify the font-family on the <math> elements and</span>, for Gecko, the on ::-moz-math-stretchy pseudo element too. For example to use STIX fonts:</p> @@ -93,7 +93,7 @@ unzip mathml-fonts.zip -d mathml-fonts</code></pre> } </span></pre> -<p><span>Try the <a href="https://developer.mozilla.org/docs/Mozilla/MathML_Project/MathML_Torture_Test" title="/docs/Mozilla/MathML_Project/MathML_Torture_Test">MathML torture test</a></span> to compare the rendering of various fonts and the CSS rules to select them.</p> +<p><span>Try the <a href="/docs/Mozilla/MathML_Project/MathML_Torture_Test" title="/docs/Mozilla/MathML_Project/MathML_Torture_Test">MathML torture test</a></span> to compare the rendering of various fonts and the CSS rules to select them.</p> <h4 id="Utilizar_MathML_en_documentos_XML_(XHTML_EPUB_etc.)">Utilizar MathML en documentos XML (XHTML, EPUB, etc.)</h4> @@ -179,32 +179,32 @@ unzip mathml-fonts.zip -d mathml-fonts</code></pre> <p>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 <a href="https://github.com/fred-wang/TeXZilla/wiki/Advanced-Usages#parsing-tex-expressions-in-your-web-page">Javascript parsing of expressions at load time</a> as all the other tools in this section do.</p> -<p>One simple client-side conversion tools is <a href="http://www1.chapman.edu/%7Ejipsen/mathml/asciimath.html" title="http://www1.chapman.edu/~jipsen/mathml/asciimath.html">ASCIIMathML</a>. Just download the <a href="http://mathcs.chapman.edu/%7Ejipsen/mathml/ASCIIMathML.js" title="http://mathcs.chapman.edu/~jipsen/mathml/ASCIIMathML.js">ASCIIMathML.js</a> script and copy it to your Web site. Then on your Web pages, add a <code><script></code> tag to load ASCIIMathML and the mathematical expressions delimited by <code>`</code> (grave accent) will be automatically parsed and converted to MathML:</p> +<p>One simple client-side conversion tools is <a href="http://www1.chapman.edu/%7Ejipsen/mathml/asciimath.html" title="http://www1.chapman.edu/~jipsen/mathml/asciimath.html">ASCIIMathML</a>. Just download the <a href="https://mathcs.chapman.edu/%7Ejipsen/mathml/ASCIIMathML.js" title="http://mathcs.chapman.edu/~jipsen/mathml/ASCIIMathML.js">ASCIIMathML.js</a> script and copy it to your Web site. Then on your Web pages, add a <code><script></code> tag to load ASCIIMathML and the mathematical expressions delimited by <code>`</code> (grave accent) will be automatically parsed and converted to MathML:</p> -<pre class="brush: html language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>html</span><span class="punctuation token">></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>head</span><span class="punctuation token">></span></span> +<pre class="brush: html language-html"><html> +<head> ... -<span class="script token"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/javascript<span class="punctuation token">"</span></span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>ASCIIMathML.js<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span></span> +<script type="text/javascript" src="ASCIIMathML.js"></script> ... -<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>head</span><span class="punctuation token">></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>body</span><span class="punctuation token">></span></span> +</head> +<body> ... -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>p</span><span class="punctuation token">></span></span>blah blah `x^2 + y^2 = r^2` blah ... -...</code></pre> +<p>blah blah `x^2 + y^2 = r^2` blah ... +...</pre> -<p><a href="http://math.etsu.edu/LaTeXMathML/" title="http://math.etsu.edu/LaTeXMathML/">LaTeXMathML</a> is a similar script that allows to parse more LaTeX commands. The installation is similar: copy <a href="http://math.etsu.edu/LaTeXMathML/LaTeXMathML.js" title="http://math.etsu.edu/LaTeXMathML/LaTeXMathML.js">LaTeXMathML.js</a> and <a href="http://math.etsu.edu/LaTeXMathML/LaTeXMathML.standardarticle.css" title="http://math.etsu.edu/LaTeXMathML/LaTeXMathML.standardarticle.css">LaTeXMathML.standardarticle.css</a>, 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:</p> +<p><a href="https://math.etsu.edu/LaTeXMathML/" title="http://math.etsu.edu/LaTeXMathML/">LaTeXMathML</a> is a similar script that allows to parse more LaTeX commands. The installation is similar: copy <a href="https://math.etsu.edu/LaTeXMathML/LaTeXMathML.js" title="http://math.etsu.edu/LaTeXMathML/LaTeXMathML.js">LaTeXMathML.js</a> and <a href="https://math.etsu.edu/LaTeXMathML/LaTeXMathML.standardarticle.css" title="http://math.etsu.edu/LaTeXMathML/LaTeXMathML.standardarticle.css">LaTeXMathML.standardarticle.css</a>, 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:</p> -<pre class="brush: html language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>head</span><span class="punctuation token">></span></span> +<pre class="brush: html language-html"><head> ... -<span class="script token"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/javascript<span class="punctuation token">"</span></span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>LaTeXMathML.js<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>link</span> <span class="attr-name token">rel</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>stylesheet<span class="punctuation token">"</span></span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/css<span class="punctuation token">"</span></span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>LaTeXMathML.standardarticle.css<span class="punctuation token">"</span></span> <span class="punctuation token">/></span></span> +<script type="text/javascript" src="LaTeXMathML.js"></script> +<link rel="stylesheet" type="text/css" href="LaTeXMathML.standardarticle.css" /> ... -<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>head</span><span class="punctuation token">></span></span> +</head> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>body</span><span class="punctuation token">></span></span> +<body> ... -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>LaTeX<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> +<div class="LaTeX"> \documentclass[12pt]{article} \begin{document} @@ -218,29 +218,29 @@ This is a sample LaTeXML document. \section{First Section} - $$ \sum_{n=1}^{+\infty} \frac{1}{n^2} = \frac{\pi^2}{6} $$ + $ \sum_{n=1}^{+\infty} \frac{1}{n^2} = \frac{\pi^2}{6} $ \end{document} -<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> -...</code></pre> - -<p><a href="http://mathscribe.com/author/jqmath.html" title="http://mathscribe.com/author/jqmath.html">jqMath</a> is another script to parse a simple LaTeX-like syntax but which also accepts non-ASCII characters like <code>√{∑↙{n=1}↖{+∞} 6/n^2} = π</code> to write <math> <mrow> <msqrt> <mrow> <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>. The installation is similar: download and copy the relevant <a href="http://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip" title="http://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip">Javascript and CSS files</a> on your Web site and reference them in your page header (see the <code>COPY-ME.html</code> 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.</p> - -<p><a name="mathjax"></a>Another way to work around the lack of MathML support in some browsers is to use <a href="http://www.mathjax.org/" title="http://www.mathjax.org/">MathJax</a>. However, note that you may find conflicts and synchronization issues between MathJax and the Javascript libraries previously mentioned. So if you really want to use MathJax as a MathML polyfill, you'd better use its own LaTeX/ASCIIMath parsers too. Note that on the one hand MathJax has better parsing and rendering support but on the other hand it is much bigger, more complex and slower than the previous Javascript libraries. Fortunately, you can use MathJax's CDN so that you don't need to install it on your Web server. Also, the slowest part of MathJax is currently its HTML-CSS / SVG output modes so we recommend to use the Native MathML output for Gecko-based browsers. Hence a typical configuration to use the AMS-LaTeX input is:</p> - -<pre class="brush: html language-html"><code class="language-html">... - <span class="script token"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/x-mathjax-config<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> - MathJax<span class="punctuation token">.</span>Hub<span class="punctuation token">.</span><span class="function token">Config<span class="punctuation token">(</span></span><span class="punctuation token">{</span> - MMLorHTML<span class="punctuation token">:</span> <span class="punctuation token">{</span> prefer<span class="punctuation token">:</span> <span class="punctuation token">{</span> Firefox<span class="punctuation token">:</span> <span class="string token">"MML"</span> <span class="punctuation token">}</span> <span class="punctuation token">}</span> - <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span></span> - <span class="script token"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/javascript<span class="punctuation token">"</span></span> - <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://cdn.mathjax.org/mathjax/latest/MathJax.js?config<span class="punctuation token">=</span>TeX-AMS-MML_HTMLorMML<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> - <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span></span> - <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>head</span><span class="punctuation token">></span></span> - <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>body</span><span class="punctuation token">></span></span> +</div> +...</pre> + +<p><a href="https://mathscribe.com/author/jqmath.html" title="http://mathscribe.com/author/jqmath.html">jqMath</a> is another script to parse a simple LaTeX-like syntax but which also accepts non-ASCII characters like <code>√{∑↙{n=1}↖{+∞} 6/n^2} = π</code> to write <math> <mrow> <msqrt> <mrow> <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>. The installation is similar: download and copy the relevant <a href="https://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip" title="http://mathscribe.com/downloads/mathscribe-unix-0.4.0.zip">Javascript and CSS files</a> on your Web site and reference them in your page header (see the <code>COPY-ME.html</code> 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.</p> + +<p><a name="mathjax"></a>Another way to work around the lack of MathML support in some browsers is to use <a href="https://www.mathjax.org/" title="http://www.mathjax.org/">MathJax</a>. However, note that you may find conflicts and synchronization issues between MathJax and the Javascript libraries previously mentioned. So if you really want to use MathJax as a MathML polyfill, you'd better use its own LaTeX/ASCIIMath parsers too. Note that on the one hand MathJax has better parsing and rendering support but on the other hand it is much bigger, more complex and slower than the previous Javascript libraries. Fortunately, you can use MathJax's CDN so that you don't need to install it on your Web server. Also, the slowest part of MathJax is currently its HTML-CSS / SVG output modes so we recommend to use the Native MathML output for Gecko-based browsers. Hence a typical configuration to use the AMS-LaTeX input is:</p> + +<pre class="brush: html language-html">... + <script type="text/x-mathjax-config"> + MathJax.Hub.Config({ + MMLorHTML: { prefer: { Firefox: "MML" } } + }); + </script> + <script type="text/javascript" + src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"> + </script> + </head> + <body> \[ \tau = \frac{x}{y} + \sqrt{3} \] -...</code></pre> +...</pre> <p>Note that <a href="http://docs.mathjax.org/en/latest/tex.html#tex-and-latex-math-delimiters" title="http://docs.mathjax.org/en/latest/tex.html#tex-and-latex-math-delimiters">the dollar delimiters are not used by default</a>. To use the ASCIIMathML input instead, just replace <code>TeX-AMS-MML_HTMLorMML</code> by <code>AM-MML_HTMLorMML</code>. MathJax has many other features, see the <a href="http://docs.mathjax.org/en/latest/" title="http://docs.mathjax.org/en/latest/">MathJax documentation</a> for further details.</p> @@ -267,17 +267,52 @@ This is a sample LaTeXML document. <p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> can be used <a href="https://github.com/fred-wang/TeXZilla/wiki/Using-TeXZilla#usage-from-the-command-line">from the command line</a> and will essentially have the same support as itex2MML described below. However, the stream filter behavior is not implemented yet.</p> -<p>If you only want to parse simple LaTeX mathematical expressions, you might want to try tools like <a href="http://golem.ph.utexas.edu/%7Edistler/blog/itex2MML.html" title="http://golem.ph.utexas.edu/~distler/blog/itex2MML.html">itex2MML</a> or <a href="http://gva.noekeon.org/blahtexml/" title="http://gva.noekeon.org/blahtexml/">Blahtex</a>. 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:</p> +<p>If you only want to parse simple LaTeX mathematical expressions, you might want to try tools like <a href="https://golem.ph.utexas.edu/%7Edistler/blog/itex2MML.html" title="http://golem.ph.utexas.edu/~distler/blog/itex2MML.html">itex2MML</a> or <a href="http://gva.noekeon.org/blahtexml/" title="http://gva.noekeon.org/blahtexml/">Blahtex</a>. 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:</p> -<pre class="brush: bash language-html"><code class="language-html">wget http://golem.ph.utexas.edu/~distler/blog/files/itexToMML.tar.gz; \ +<pre class="brush: bash language-html">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</code></pre> +sudo make install</pre> <p>Now suppose that you have a HTML page with TeX fragments delimited by dollars:</p> -<pre class="brush: html language-html"><code class="language-html">input.html +<pre class="brush: html language-html">input.html + +... +</head> +<body> + <p>$\sqrt{a^2-3c}input.html + +... +</head> +<body> + <p>$\sqrt{a^2-3c}input.html + +... +</head> +<body> + <p>$\sqrt{a^2-3c}<code class="language-html">input.html + +... +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>head</span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>body</span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>p</span><span class="punctuation token">></span></span>$\sqrt{a^2-3c}$<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>p</span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>p</span><span class="punctuation token">></span></span>$$ {\sum_{i=1}^N i} = \frac{N(N+1)}{2} $$<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>p</span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>body</span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>html</span><span class="punctuation token">></span></span></code>lt;/p> + <p>$ {\sum_{i=1}^N i} = \frac{N(N+1)}{2} $</p> +</body> +</html>lt;/p> + <p>$ {\sum_{i=1}^N i} = \frac{N(N+1)}{2} $</p> +</body> +</html>lt;/p> + <p>$ {\sum_{i=1}^N i} = \frac{N(N+1)}{2} input.html + +... +</head> +<body> + <p>$\sqrt{a^2-3c}<code class="language-html">input.html ... <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>head</span><span class="punctuation token">></span></span> @@ -285,7 +320,12 @@ sudo make install</code></pre> <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>p</span><span class="punctuation token">></span></span>$\sqrt{a^2-3c}$<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>p</span><span class="punctuation token">></span></span> <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>p</span><span class="punctuation token">></span></span>$$ {\sum_{i=1}^N i} = \frac{N(N+1)}{2} $$<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>p</span><span class="punctuation token">></span></span> <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>body</span><span class="punctuation token">></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>html</span><span class="punctuation token">></span></span></code></pre> +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>html</span><span class="punctuation token">></span></span></code>lt;/p> + <p>$ {\sum_{i=1}^N i} = \frac{N(N+1)}{2} $</p> +</body> +</html>lt;/p> +</body> +</html></pre> <p>Then to generate the HTML page input.html with TeX expressions replaced by MathML expressions, just do</p> @@ -297,13 +337,13 @@ sudo make install</code></pre> mzlatex foo.tex # Windows platform </pre> -<p><a href="http://dlmf.nist.gov/LaTeXML/">LaTeXML</a> is another tool that is still actively developed but the release version is rather old, so you'd better <a href="https://github.com/KWARC/LaTeXML">install the development version</a>. In particular, this version can generate HTML5 and EPUB documents. Here is the command to execute in order to create a foo.html Web page from the foo.tex LaTeX source:</p> +<p><a href="https://dlmf.nist.gov/LaTeXML/">LaTeXML</a> is another tool that is still actively developed but the release version is rather old, so you'd better <a href="https://github.com/KWARC/LaTeXML">install the development version</a>. In particular, this version can generate HTML5 and EPUB documents. Here is the command to execute in order to create a foo.html Web page from the foo.tex LaTeX source:</p> <pre class="language-html"> latexml --dest foo.xml foo.tex latexmlpost --dest foo.html --format=html5 foo.xml </pre> -<p>If you want to have a MathJax fallback for non-Gecko browsers, copy the <a href="https://developer.mozilla.org/es/docs/Web/MathML/Authoring$edit#mathjax-fallback">Javascript lines given above</a> into a <code>mathjax.js</code> file and use the <code>--javascript</code> parameter to tell LaTeXML to include that file:</p> +<p>If you want to have a MathJax fallback for non-Gecko browsers, copy the <a href="/es/docs/Web/MathML/Authoring$edit#mathjax-fallback">Javascript lines given above</a> into a <code>mathjax.js</code> file and use the <code>--javascript</code> parameter to tell LaTeXML to include that file:</p> <pre class="language-html"> latexmlpost --dest foo.html --format=html5 --javascript=mathjax.js foo.xml </pre> @@ -333,7 +373,7 @@ sudo make install</code></pre> </li> </ul> -<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> can be <a href="https://github.com/fred-wang/TeXZilla/wiki/Advanced-Usages#using-texzilla-as-a-web-server">used as a Web server</a> in order to perform server-side LaTeX-to-MathML conversion. <a href="http://dlmf.nist.gov/LaTeXML/">LaTeXML</a> can also be used as a deamon to run server-side. <a href="https://github.com/gwicke/mathoid">Mathoid</a> is another tool based on MathJax that is also able to perform additional MathML-to-SVG conversion.</p> +<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> can be <a href="https://github.com/fred-wang/TeXZilla/wiki/Advanced-Usages#using-texzilla-as-a-web-server">used as a Web server</a> in order to perform server-side LaTeX-to-MathML conversion. <a href="https://dlmf.nist.gov/LaTeXML/">LaTeXML</a> can also be used as a deamon to run server-side. <a href="https://github.com/gwicke/mathoid">Mathoid</a> is another tool based on MathJax that is also able to perform additional MathML-to-SVG conversion.</p> <p><a href="http://instiki.org/show/HomePage">Instiki</a> is a Wiki that integrates itex2MML to do server-side conversion. In future versions, <a href="https://www.mediawiki.org/wiki/MediaWiki">MediaWiki</a> will support server-side conversion too.</p> @@ -341,25 +381,23 @@ sudo make install</code></pre> <h3 id="Input_Box">Input Box</h3> -<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> has several interfaces, including a <a href="http://ckeditor.com/addon/texzilla">CKEditor plugin</a> used on MDN, an <a href="http://fred-wang.github.io/TeXZilla/">online demo</a>, a <a href="https://addons.mozilla.org/en-US/firefox/addon/texzilla/">Firefox add-on</a> or a <a href="http://r-gaia-cs.github.io/TeXZilla-webapp/">FirefoxOS Webapp</a>. <a href="http://abisource.org/">Abiword</a> contains a small equation editor, based on itex2MML.<a href="http://www.bluegriffon.com/"> Bluegriffon</a> is a mozilla-based Wysiwyg HTML editor and has an add-on to insert MathML formulas in your document, using ASCII/LaTeX-like syntax.</p> +<p><a href="https://github.com/fred-wang/TeXZilla">TeXZilla</a> has several interfaces, including a <a href="https://ckeditor.com/addon/texzilla">CKEditor plugin</a> used on MDN, an <a href="http://fred-wang.github.io/TeXZilla/">online demo</a>, a <a href="https://addons.mozilla.org/en-US/firefox/addon/texzilla/">Firefox add-on</a> or a <a href="http://r-gaia-cs.github.io/TeXZilla-webapp/">FirefoxOS Webapp</a>. <a href="http://abisource.org/">Abiword</a> contains a small equation editor, based on itex2MML.<a href="http://www.bluegriffon.com/"> Bluegriffon</a> is a mozilla-based Wysiwyg HTML editor and has an add-on to insert MathML formulas in your document, using ASCII/LaTeX-like syntax.</p> -<p style="text-align: center;"><img alt="BlueGriffon" src="http://www.bluegriffon.com/public/shots/mathml-shot1.png" style="height: 467px; width: 358px;"></p> +<p style="text-align: center;"><img alt="BlueGriffon" src="mathml-shot1.png"></p> <h3 id="WYSIYWG_Editors">WYSIYWG Editors</h3> -<p><a href="http://www.firemath.info/">Firemath</a> is an extension for Firefox that provides a WYSIWYG MathML editor. A preview of the formula is displayed using the rendering engine of Mozilla. The generated MathML code is available at the bottom. Use the text field for token elements and buttons to build advanced constructions. Once you are done, you can save your document as a XHTML page.</p> +<p><a href="https://www.firemath.info/">Firemath</a> is an extension for Firefox that provides a WYSIWYG MathML editor. A preview of the formula is displayed using the rendering engine of Mozilla. The generated MathML code is available at the bottom. Use the text field for token elements and buttons to build advanced constructions. Once you are done, you can save your document as a XHTML page.</p> -<p><a href="http://www.openoffice.org/">OpenOffice</a> and <a href="http://libreoffice.org/">LibreOffice</a> have an equation editor (File → New → Formula). It is semi-WYSIWYG: you enter the source of the formula using the equation panel/keyboard and a preview of the formula is regularly refreshed. The editor uses its own syntax "StarMath" for the source but MathML is also generated when the document is saved. To get the MathML code, save the document as mml and open it with any text editor. Alternatively, you can extract the odf file (which is actually a zip archive) and open an xml file called <code>content.xml</code>.</p> +<p><a href="https://www.openoffice.org/">OpenOffice</a> and <a href="https://libreoffice.org/">LibreOffice</a> have an equation editor (File → New → Formula). It is semi-WYSIWYG: you enter the source of the formula using the equation panel/keyboard and a preview of the formula is regularly refreshed. The editor uses its own syntax "StarMath" for the source but MathML is also generated when the document is saved. To get the MathML code, save the document as mml and open it with any text editor. Alternatively, you can extract the odf file (which is actually a zip archive) and open an xml file called <code>content.xml</code>.</p> -<p style="text-align: center;"><img alt="Open Office Math" src="https://developer.mozilla.org/@api/deki/files/4261/=openoffice.png" style="height: 527px; width: 483px;"></p> +<p style="text-align: center;"><img alt="Open Office Math" src="openoffice.png"></p> -<p><a href="http://www.w3.org/Amaya/">Amaya</a> is the W3C's web editor, which is able to handle MathML inside XHTML documents. Use the Elements and the Special Chars panels to create various advanced mathematical constructs. Simple text such as <code>a+2</code> is automatically parsed and the appropriate MathML markup is generated. Once you are done, you can directly save your XHTML page and open it in Mozilla.</p> +<p><a href="https://www.w3.org/Amaya/">Amaya</a> is the W3C's web editor, which is able to handle MathML inside XHTML documents. Use the Elements and the Special Chars panels to create various advanced mathematical constructs. Simple text such as <code>a+2</code> is automatically parsed and the appropriate MathML markup is generated. Once you are done, you can directly save your XHTML page and open it in Mozilla.</p> <h2 id="Optical_Character_Handwriting_Recognition">Optical Character & Handwriting Recognition</h2> -<p><a href="http://www.inftyreader.org/">Inftyreader</a> is able to perform some Optical Character Recognition, including translation of mathematical equations into MathML. Other tools can do handwriting recognition such as the <a href="http://windows.microsoft.com/en-za/windows7/use-math-input-panel-to-write-and-correct-math-equations">Windows Math Input Panel</a></p> - -<p style="text-align: center;"><img alt="Windows Math Input Panel" src="http://res1.windows.microsoft.com/resbox/en/windows%207/main/50f56cb9-478c-48e9-867e-8de06e1d4190_46.jpg" style="height: 385px; width: 410px;"></p> +<p><a href="https://www.inftyreader.org/">Inftyreader</a> is able to perform some Optical Character Recognition, including translation of mathematical equations into MathML. Other tools can do handwriting recognition such as the <a href="https://windows.microsoft.com/en-za/windows7/use-math-input-panel-to-write-and-correct-math-equations">Windows Math Input Panel</a></p> <p>or the online converter <a href="http://webdemo.visionobjects.com/" title="http://webdemo.visionobjects.com/portal.html">Web Equation</a>.</p> @@ -370,7 +408,7 @@ sudo make install</code></pre> <li>Author(s): Frédéric Wang</li> <li>Other Contributors: Florian Scholz</li> <li>Last Updated Date: April 2, 2011</li> - <li>Copyright Information: Portions of this content are © 2010 by individual mozilla.org contributors; content available under a Creative Commons license | <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">Details</a>.</li> + <li>Copyright Information: Portions of this content are © 2010 by individual mozilla.org contributors; content available under a Creative Commons license | <a class="external" href="https://www.mozilla.org/foundation/licensing/website-content.html">Details</a>.</li> </ul> </div> diff --git a/files/es/web/mathml/authoring/openoffice.png b/files/es/web/mathml/authoring/openoffice.png Binary files differnew file mode 100644 index 0000000000..4876bc83df --- /dev/null +++ b/files/es/web/mathml/authoring/openoffice.png |
