mathjaxasciimath

How to change font for MathJax

I am unable to get MathJax to change the font that it is using to render formulas written in AsciiMath. I have read the answers to similar questions here at StackOverflow and other places on the web:

Here is an entire HTML5 document that I am using as a test case:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>MathJax Font</title>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
    "CommonHTML" : { preferredFont:"Asana Math" }
});
</script>

<script src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=AM_CHTML"></script>
</head>

<body>
<p>`v = pi r^2`</p>
</body>
</html>

What am I doing wrong? Please help me change the font for MathJax.

Solution

  • I found this at docs.mathjax.org/en/latest/output.html

    The CommonHTML output processor produces high-quality output in all modern browsers, with results that are consistent across browsers and operating systems. This is MathJax’s primary output mode since MathJax v2.6. Its major advantage is its quality, consistency, and speed as well as support for server-side generation. Its browser supports starts with IE9 and equivalent browsers and it degrades gracefully on older browsers. The CommonHTML output uses web-based fonts so that users don’t have to have math fonts installed on their computers. It currently only supports MathJax’s default TeX fonts.

    I had to change my file to use the HTML-CSS output processor instead of the CommonHTML output processor. After the change my test file now looks like this:

    <head>
  <meta charset="UTF-8">
  <title>MathJax Font</title>
  <script type="text/x-mathjax-config">
    MathJax.Hub.Config({ "HTML-CSS" : { availableFonts : ["STIX"], preferredFont : "STIX", webFont : "STIX-Web", imageFont : null } });
  </script>

  <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=AM_HTMLorMML"></script>
</head>

<body>
  <p>`v = pi r^2`</p>
</body>