MathML

HTML

<script src="http://assets.thinkthroughmath.com/MathJax/MathJax.js?config=MML_HTMLorMML"></script>
<script src="https://github.com/niklasvh/html2canvas/releases/download/0.4.1/html2canvas.js"></script>
<span resource="om:Apparent_magnitude" id='maths' width='200px' height='200px'><math xmlns="http://www.w3.org/1998/Math/MathML" display="block">

<mml:math xmlns:mml="http://www.w3.org/1998/Math/MathML" xmlns:m="http://schemas.openxmlformats.org/officeDocument/2006/math"><mml:msqrt><mml:msub><mml:mrow><mml:mi>T</mml:mi></mml:mrow><mml:mrow><mml:mi>D</mml:mi><mml:mi>a</mml:mi><mml:mi>t</mml:mi><mml:mi>a</mml:mi><mml:mi> </mml:mi><mml:mi>M</mml:mi><mml:mi>o</mml:mi><mml:mi>v</mml:mi><mml:mi>e</mml:mi><mml:mi>m</mml:mi><mml:mi>e</mml:mi><mml:mi>n</mml:mi><mml:mi>t</mml:mi></mml:mrow></mml:msub><mml:mo>/</mml:mo><mml:msub><mml:mrow><mml:mi>T</mml:mi></mml:mrow><mml:mrow><mml:mi>T</mml:mi><mml:mi>a</mml:mi><mml:mi>s</mml:mi><mml:mi>k</mml:mi><mml:mi> </mml:mi><mml:mi>C</mml:mi><mml:mi>o</mml:mi><mml:mi>m</mml:mi><mml:mi>p</mml:mi><mml:mi>u</mml:mi><mml:mi>t</mml:mi><mml:mi>a</mml:mi><mml:mi>t</mml:mi><mml:mi>i</mml:mi><mml:mi>o</mml:mi><mml:mi>n</mml:mi></mml:mrow></mml:msub></mml:msqrt></mml:math> 

  </math>
  </span>
<canvas id='the_canvas' height='200px' width='699px'></canvas>

JavaScript

startTime = new Date();
MathJax.Hub.Config({})
//MathJax.Hub.Startup.onload();
$(function () {
    onloadTime = new Date();
    var renderedTime = 0
    var replicationTime = 0
    function setReplication(){
      replicationTime = new Date();
    }
    function canvasProcess(){
      $math = $(".MathJax_Display")
      html2canvas($math, {
        onrendered: function (canvas) {
            canvas.id = 'copy'
            document.body.appendChild(canvas);
            $('#the_canvas')[0].getContext('2d').drawImage($('#copy')[0],0,0)
            setReplication()
        },
      }); 
    }
    MathJax.Hub.Queue(["Typeset",MathJax.Hub,"maths"]);
    function setRenderedTime(){
      renderedTime = new Date();
    }
    MathJax.Hub.Queue(setRenderedTime);
    MathJax.Hub.Queue(canvasProcess);
    function stats(){
      document.body.appendChild($('<span>Page Loaded At: '+ startTime+'</span>')[0])
      document.body.appendChild($('<br>')[0])
      document.body.appendChild($('<span>OnLoad At: '+ onloadTime+'</span>')[0])
      document.body.appendChild($('<br>')[0])
      document.body.appendChild($('<span>Replication At: '+ replicationTime+'</span>')[0])
      document.body.appendChild($('<br>')[0])
      document.body.appendChild($('<span>Rendered At: '+ renderedTime+'</span>')[0])
      document.body.appendChild($('<br>')[0])
    }
    MathJax.Hub.Queue(stats);
})