MathJax and MathML in my Drupal site

Submitted by Nicola Rainiero on 2012-09-13 (last updated on 2015-06-22)

When I was planning my site, one of many problems I had, was insertion of mathematical equations in my articles, but I found very soon in MathJax a useful solution. Some time after I discovered another method: MathML, even a recommendation of the W3C math working group! Here there are some personal considerations on them: about usability and convenience in my Drupal experience.

 MathJax^

I like LaTeX and when I discovered MathJax, a cross-browser JavaScript library released as open-source, that displays mathematical equations in web browsers, using LaTeX math, I was nicely surprised. Besides it exists the homonym module in Drupal.

Drupal configuration

Once installed and activated the module (see below), you can configure it pointing your browser here: http://my_site/admin/config/content/mathjax. There are few choices in this menu as you can see in the next screen.

Come configurare MathJax su Drupal

In my opinion it should allow the user to enable/disable more easily. I have tried to enable MathJax by a boolean field in Content type but doesn't work! So if I must display equations in a particular content node, I add it in the MathJax configuration menu.

Summary sheet on MathJax

  • Here home page of the project;
  • here Drupal's module ;
  • here browser's compatibility list.
  • Pros:
    • if you know LaTeX you can use it immediately, for inline maths it is sufficient insert the equations inside $ \$...\$ $ and for display maths \[ ... \];
    • the quality is very good.
  • Cons:
    • you have to install an extra module that load a JavaScript library;
    • you have to choose where enable it (all pages or selected pages);
    • I suggest you to test your formulas in a good LaTeX editor, above all if you don't use LaTeX every day (like me!);
    • make attention when you insert the $ \$ $ charset, because enable it in your articles. In order to avoid this, use these charsets:$ \$ $

 MathML^

While I was testing editor WYSIWYG Amaya, I have found in its menus some simple items to insert mathematic equations in html page, using MaThML. This is an application of XML for describing mathematical notations and capturing both its structure and content. It aims at integrating mathematical formulae into World Wide Web pages and other documents[1]. I have published only one article with MathML till now, but I don't like it!

Summary sheet on MathML

  • Here home page of the project;
  • here browser's compatibility list
  • Pros:
    • it is a recommendation of the W3C math working group;
    • MathML deals not only with the presentation but also the meaning of formula components (the latter part of MathML is known as “Content MathML”)[1].
  • Cons:
    • you need a good editor to type your formulas in this language, because it doesn't appear easy and immediate to learn;
    • in Drupal you have to choice PHP Code in text format, because the WYSIWYG, in my case TinyMCE, doesn't interpret it;
    • some graphical errors and pagination.

 Comparison using an example^

MathJax MathML
\[
w = \sqrt{{4 \cdot (\gamma_p - \gamma_w) \cdot D} \over {3 \cdot \rho_w \cdot C_D}}
\]
<math xmlns="http://www.w3.org/1998/Math/MathML">
  <mi>w</mi>
  <mo>=</mo>
  <msqrt>
    <mfrac>
      <mrow>
        <mn>4</mn>
        <mo>•</mo>
        <mo>(</mo>
        <msub>
          <mi>γ</mi>
          <mi>p</mi>
        </msub>
        <mo>−</mo>
        <msub>
          <mi>γ</mi>
          <mi>w</mi>
        </msub>
        <mo>)</mo>
        <mo>•</mo>
        <mi>D</mi>
      </mrow>
      <mrow>
        <mn>3</mn>
        <mo>•</mo>
        <msub>
          <mi>ρ</mi>
          <mi>w</mi>
        </msub>
        <mo>•</mo>
        <msub>
          <mi>C</mi>
          <mi>D</mi>
        </msub>
      </mrow>
    </mfrac>
  </msqrt>
</math>
\[ w = \sqrt{{4 \cdot (\gamma_p - \gamma_w) \cdot D} \over {3 \cdot \rho_w \cdot C_D}} \] w = 4 ( γ p γ w ) D 3 ρ w C D

 


 References^




Related Content:

Nicola Rainiero

A civil geotechnical engineer with the ambition to facilitate own work with free software for a knowledge and collective sharing. Also, I deal with green energy and in particular shallow geothermal energy. I have always been involved in web design and 3D modelling.

Comments

David Carlisle (not verified)

Mon, 09/17/2012 - 23:21

The title is misleading: You can't really copmpare mathjax to mathml as they are not comparable..At its core MathJax is based on MathML but it has three different input parsers, one of a latex-like syntax (that you were using) one for mathml synatx and one for asciimath syntax. Whichever syntax you used it is parsed into an internal mathml representation. then this representation is rendered by one of three output methids, depending on the mathjax configuration. It can use a html/css positioning, use the native mathml capability of teh browser or use the svg rendering of the browser.So comparing "mathjax" to "mathml" is like comparing "firefox" to "html".  One is an implemetation, one os a language.

You're right, I put a forced title that confuses about the content of article itself. But I have tried MathML because it is a direct language, without any external library to parse my formulas again. Maybe I should fix the title with a more suitable "MathJax and MathML in my Drupal experience", like I explain more correctly in the preamble and in the rest of the article. Thank you for suggestion.

Add new comment

The content of this field is kept private and will not be shown publicly.

Plain text

  • No HTML tags allowed.
  • Web page addresses and email addresses turn into links automatically.
  • Lines and paragraphs break automatically.
CAPTCHA
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.