如何在网页中正常显示数学公式

利用 MarkDown编写数学公式时,有两种方式:
第一种行内显示$...$,第二种为行间显示$$...$$
When $a \ne 0$, there are two solutions to $(ax^2 + bx + c = 0 $and they are
$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$

但web端则不能对数学公式进行显示,因此需要添加插件。

MathJax

MathJax是一个开源JavaScript显示引擎,用于LaTeX、MathML和ascimath符号,可在所有现代浏览器中使用。

使用方式

直接调用
<head>
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script type="text/javascript" id="MathJax-script" async
  src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js">
</script>
</head>
下载后调用

当然也可以把js下载到服务器,加快加载速度,网址:https://github.com/mathjax/MathJax
<script src="/MathJax-master/es5/tex-chtml.js" id="MathJax-script" async></script>

无法正常显示行内$...$问题

MathJax使用LaTeX数学定界符,用\(...\) 来显示行内公式,用\[...\] 来显示行间公式.它也识别 TeX的 分隔符 $$...$$ 来显示行间公式,。由于美元符号在非数学环境中出现的频率太高,这可能会导致某些文本意外地被视为数学,所以并不支持将$…$定义为内嵌数学分隔符。
因此需要设置:

<script>
MathJax = {
  tex: {
    inlineMath: [['$', '$'], ['\\(', '\\)']],
    packages: ['base', 'newcommand', 'configMacros']
  },
  svg: {
    fontCache: 'global'
  }
};
</script>
Categories: MarkDownMathmaticsWeb

0 Comments

Leave a Reply

Your email address will not be published.