如何在 Github 的 Markdown 环境中显示公式

原讨论贴在:A hck for showing LaTex formulas in Github markdow.md

在我的博客里面,公式渲染是使用 Mathjax 进行的。不过 Github 并不支持这些基于 JavaScript 的公式渲染方式。事实上 Github 自身提供了一种在线公式渲染服务,这个服务将经过 URL 编码的 LaTex 格式字符串渲染成图片形式的公式图形。这个服务的 API 的基本形式是

1
https://render.githubusercontent.com/render/math?math=content-of-latex

需要特别注意的是这里的 LaTex 公式需要经过 URL 编码。有很多线上的 URL 编码网站可以使用,例如 urlencoder.org

以下面这个简单的公式为例:

可以用如下的方式将公式插入 Markdown 环境(包括 README.md 以及 Issue)

1
![formula](https://render.githubusercontent.com/render/math?math=e^{i \pi} = -1)

上面的这种方式插入的是图片,故我们没法选中公式中的字符。注意看 中使用 Mathjax 渲染出来的结果是 HTML 的,所以可以选择到字符。

例如我用这种方式插入到下面:

formula

事实上 Github 的这个服务相当强大,一些非常复杂的公式也能渲染,例如下面这个例子:

1
2
3
4
5
6
7
8
\begin{aligned}
U_b &= (p - \alpha) P \times 10^{-1} / d^3 \\ &= \left\{
\begin{array}{ll}
(p - \alpha) \left(\dfrac{1}{p \ln 2} - \sigma \right), & P < P_{max} \\
(p - \alpha) \dfrac{P_{max}}{10 \cdot d^3}, & P = P_{max}
\end{array}
\right.
\end{aligned}
formula

除了 Github 自带的这个服务以外(似乎没有官方文档),在这个知乎帖子上也提到了另一个 API: EqnEditor Render。不过这个网页上提示这个网页是给管理员用的,不推荐终端用户使用。终端用户建议使用 Equation Editor。这个网页提供更加用户友好的编辑界面,且可以对输出格式,公式大小,字体等进行更详细的配置。

下面是这个服务将上面的公式渲染成 SVG 的结果: