【LTeX】本服务器增加基于MathJax的TeX公式支持

因为知乎将原来的不知道什么TeX换成了MathJax, 我有幸知道了原来还有这么神奇的东西!

先看效果, 下面是行间公式的效果.

\[ f(a)=\frac{1}{2\pi i}\oint_\gamma \frac{f(z)}{z-a}dz \]

然后看看行内公式: \( x=\frac{-b\pm\sqrt{b^2-4ac}}{2a} \), 效果如何?

使用方式:

在编辑文档的时候, 使用这种方法:

行内公式, 使用      \(  ....     \)     包裹你的公式.
行间公式, 使用      \[  ....     \]     包裹你的公式, 
当然也可以用        $$  ....     $$     创建行间公式.

注意, 单个美元符号是不被允许的, 例如   $  ...  $  是无效的!

编辑的时候不会实时显示, 所以需要最好在其他地方确认下输入然后复制过来.

比如你可以使用 visual studio code 的 .md 文件作为公式预览.

关于latex

可以参考这个的公式章节:

【LaTeX】新手教程：从入门到日常使用 – 知乎 (zhihu.com)

公式的输入介绍:

LaTeX 公式篇 – 知乎 (zhihu.com)

更多教程请自己网上查.

关于MathJax

Beautiful and accessible math in all browsers.

A JavaScript display engine for mathematics that works in all browsers.
No more setup for readers. It just works.

MathJax | Beautiful math in all browsers.

MathJax使用JavaScript构造渲染方式, 直接将公式在用户端的浏览器里实时渲染, 占用的是用户的算力(本身也不大, 但是如果全部放在服务器端的话会很大!), 所以传输的数据少, 而且总体体验更好. 用户也可以很容易的实现公式的书写与渲染, 而不用学习LaTeX以外的任何东西.

安装方法

如果你也是站长, 那么这里将会比较有用. 如果你只是一个网上冲浪的用户, 那么这里可以不用看.

MathJax其实就是一些js文件, 只需要在自己的网站的某处添加即可使用. 官方文档有详细的教程.

What is MathJax? — MathJax 3.2 documentation

官方推荐使用现成的CDN, 好处是不用安装任何东西到服务器上, 只需要在网页的header处添加一行代码就可以了.

但是我国的网络情况……..

所以我选择将代码缓存到自己网页的服务器上, 然后调用, 解决了访问速度的问题.

首先去GitHub下载代码

git clone https://github.com/mathjax/MathJax.git mathjax

官方推荐使用npm, 但是我不会用npm, 也不想学.

然后将代码目录下的./es5重命名为./mathjax/, 其实也可以不用的, 但是最好这样一下, 要不然后面维护就火葬场了. 另外, 我忘了, 好像应该本来叫es5来着….反正也就那一个有用文件.

之后, 将这个文件夹想办法弄到你网站的根目录下.

之后, 给网站加入一行代码就行. 实际上, 比如wordpress, 只需要在正文的时候能运行这个即可, 那么插入到header.php就是一个好的选择.

具体的位置在./wp-content/themes/这里是你目前在用的主题的名字/header.php, 应该没记错. 反正大概就在这里.

然后在<head>模块里插入如下代码即可.

<script src="./mathjax/tex-chtml.js" id="MathJax-script" async></script>

之后看起来大概这个样子:

<html>
    <head>
        ...
        <script src="/mathjax/tex-chtml.js" id="MathJax-script" async></script>
    </head>
    <body>
        ...
    </body>
</html>

然后保存, 就好啦.

注意, 这里的tex-chtml.js只是举例子, 实际上文件内存在多个js文件, 使用一个最合适的就行. 如果你不知道怎么挑选, 那么这个默认的就很好用.

这里给出挑选的方式:

基本上Mathjax默认包含了8个加载模块：

tex-chtml
tex-chtml-full
tex-svg
tex-svg-full
tex-mml-chtml
tex-mml-svg
mml-chtml
mml-svg

它们都至少包括一个输入input处理器、一个输出output处理器、MathJaxTex所需要的字体、上下文菜单和启动模块。

tex-chtml 会加载 ams, newcommand, require, autoload, configMacros, 和 noundefined。这意味着大部分情况下能满足你基本需求。你也可以使用 require 自己加载更多模块。
tex-chtml-full 会包含tex-chtml的内容，同时还包括input/tex-full 等但是不包含 physics 和 colorV2
tex-svg mathjax默认以字体输出公式，如果你需要是svg输出公式，请使用svg包。
tex-svg-full：包含全部以svg输出格式。
tex-mml-chtml（常用）：包含了对MathML 语言的支持，显示时以字体方式显示。
tex-mml-svg：包含了对MathML 语言的支持，显示时以svg方式显示。
mml-chtml 不包含Tex，支持MathML，以文字显示。
mml-svg：不包含Tex，以SVG方式显示。

好了, 没有其他的东西要说了.

limitless网站管理员

2022年9月24日

limitless 印象派水彩 | 设定