1. 程式人生 > >使用 Markdown + MathJax 在部落格裡插入數學公式

使用 Markdown + MathJax 在部落格裡插入數學公式

在書寫數值計算類文章,特別是機器學習相關演算法時,難免需要插入複雜的數學公式。一種是用圖片在網頁上展示,另外一種是使用 MathJax 來展示覆雜的數學公式。它直接使用 Javascript 使用向量字型檔或 SVG 檔案來顯示數學公式。優點是效果好,比如在 Retina 螢幕上也不會變得模糊。並且可以直接把公式寫在 Markdown 文章裡。本文介紹使用 MathJax 在 Markdown 檔案裡直接插入數學公式。並且附帶一個簡單的書寫數學公式的 LaTex 教程。

工具

配置 Markdown Preview 來支援 MathJax

使用 Sublime + Markdown Preview 外掛來寫部落格時。需要開啟 Markdown Preview 對 MathJax 的支援,這樣在預覽介面才能正確地顯示數學公式。方法是開啟在 Markdown Preview 的使用者配置檔案 (Package Settings -> Markdown Preview -> Setting - User) 裡新增如下內容:

"enable_mathjax": true

配置 Pelican 主題模板來支援 MathJax

我使用的主題是 foundation-default-colours,它預設是支援 MathJax 的。我們可以在模板 base.html 找到如下內容:

<!-- mathjax config similar to math.stackexchange -->
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
    jax: ["input/TeX", "output/HTML-CSS"
], tex2jax: { inlineMath: [ ['$', '$'] ], displayMath: [ ['$$', '$$']], processEscapes: true, skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code'] }, messageStyle: "none", "HTML-CSS": { preferredFont: "TeX", availableFonts: ["STIX","TeX"
] } });
</script> <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

如果模板不支援,也可以直接新增上面的指令碼來支援 MathJax。

LaTex 簡明教程

例子

先來看個例子:

$$
J(\theta) = \frac 1 2 \sum_{i=1}^m (h_\theta(x^{(i)})-y^{(i)})^2
$$

上面用 LaTex 格式書寫的數學公式經過 MathJax 展示後效果如下:

J(θ)=12i=1m(hθ(x(i))y(i))2

這個公式是線性迴歸演算法裡的成本函式。

規則

關於在 Markdown 書寫 LaTex 數學公式有幾個規則常用規則需要記住:

行內公式
行內公式使用 $ 號作為公式的左右邊界,如 h(x)=θ0+θ1x 公式的 LaTex 內容如下

$h(x) = \theta_0 + \theta_1 x$

行間公式
公式需要獨立顯示一行時,使用 $$ 來作為公式的左右邊界,如

θi=θiαθiJ(θ)

的 LaTex 程式碼為:

$$
\theta_i = \theta_i - \alpha\frac\partial{\partial\theta_i}J(\theta)
$$

常用 LaTex 程式碼
需要記住的幾個常用的符號,這樣書寫起來會快一點

編碼 說明 示例
\frac 分子分母之間的橫線 1x
_ 用下劃線來表示下標 xi
^ 次方運算子來表示上標 xi
\sum 累加器,上下標用上面介紹的編碼來書寫
\alpha 希臘字母 alpha y:=αx

記住這幾個就差不多了,倒回去看一下線性迴歸演算法的成本函式的公式及其 LaTex 程式碼,對著練習個10分鐘基本就可以掌握常用公式的寫法了。要特別注意公式裡空格和 {} 的運用規則。基本原則是,空格可加可不加,但如果會引起歧義,最好加上空格。{} 是用來組成群組的。比如寫一個分式時,分母是一個複雜公式時,可以用 {} 包含起來,這樣整個複雜公式都會變成分母了。

幾個非常有用的資源

  • Github 上有個線上 Markdown MathJax 編輯器,可以在這裡練習,平時寫公式時也可以在這裡先寫好再拷貝到文章裡
  • 這是 LaTex 完整教程,包含完整的 LaTex 數學公式的內容,包括更高階的格式控制等
  • 這是一份PDF 格式的 MathJax 支援的數學符號表,當需要書寫複雜數學公式時,一些非常特殊的符號的轉義字元可以從這裡查到

好啦,這樣差不多就可以寫出優美的數學公式啦。