使用 Markdown + MathJax 在博客里插入数学公式

本文介绍如何在Markdown文件中使用MathJax直接插入数学公式,并提供了一个简单的LaTeX公式书写教程。

在书写数值计算类文章,特别是机器学习相关算法时,难免需要插入复杂的数学公式。一种是用图片在网页上展示,另外一种是使用 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分钟基本就可以掌握常用公式的写法了。要特别注意公式里空格和 {} 的运用规则。基本原则是,空格可加可不加,但如果会引起歧义,最好加上空格。{} 是用来组成群组的。比如写一个分式时,分母是一个复杂公式时,可以用 {} 包含起来,这样整个复杂公式都会变成分母了。

几个非常有用的资源

好啦,这样差不多就可以写出优美的数学公式啦。

<think>好的,用户让我重新用MarkdownMathJax格式输出之前的回答。首先,我需要回顾之前的对话历史。用户最初问为什么公式显示为纯文本而不是渲染后的数学符号,我解释了可能的原因和解决方法。现在用户希望得到同样的内容,但使用MarkdownMathJax来呈现。 首先,我需要确定用户的使用场景。他们可能是在使用支持MarkdownMathJax的平台,比如Jupyter Notebook、Typora,或者某些博客平台如Hugo或WordPress配合插件。用户需要的是在能够正确渲染LaTeX的环境中查看答案,所以需要确保所有的公式都用合适的语法包裹,比如$$...$$或\(...\)。 接下来,我要检查之前的回答结构,并转换成Markdown格式。原来的回答有标题、列表、代码块、图片链接和表格。需要将这些元素用Markdown语法替换,比如使用#号表示标题,使用减号或数字编号表示列表,代码块用三个反引号包裹,表格用竖线分隔,图片用Markdown的图片语法。 同时,所有公式部分需要用MathJax语法正确包裹。比如原来的行内公式应该用\(...\),而独立的公式块用$$...$$。需要注意的是,在Markdown中,某些特殊字符可能需要转义,比如下划线,但如果在MathJax环境中应该没问题。另外,确保文本中的特殊符号如希腊字母、上下标等正确转换。 另外,之前的回答中有一个图片示例链接,可能需要保留,但需要确认是否在Markdown中有效。如果用户是在本地查看,可能需要下载图片或使用在线链接。不过,如果平台支持,图片应该正常显示。 还需要检查是否有遗漏的部分。原来的回答分成了原因分析、解决方法、常见支持场景和示例表格。这些都需要用合适的Markdown结构重新组织。比如原因分析部分可以用二级标题,每个子项用列表展示。解决方法中的每个步骤用有序或无序列表,代码示例用代码块。 还要注意用户是否有其他隐含需求。比如,他们可能希望答案更紧凑或更详细,但根据用户的请求,主要是格式转换,所以内容应该保持原样,只是结构改为Markdown,公式用MathJax渲染。 最后,需要测试转换后的Markdown内容是否正确,特别是公式部分是否能够正确显示。例如,确保反斜杠没有被转义,MathJax的定界符正确使用。可能还需要调整一些格式,比如表格的对齐方式,确保在Markdown中显示美观。 总结来说,步骤是:转换结构到Markdown,确保所有公式用MathJax语法,调整代码块、表格和图片的语法,检查格式正确性,确保内容与原回答一致,没有信息丢失或错误。</think>以下是采用 **Markdown + MathJax** 格式重新整理的回答: --- # 公式显示问题分析与解决方法 当公式以原始 LaTeX 代码(如 `\(P_{\text{loss}} = \omega C V^2 \tan\delta\)`)显示而非渲染后的数学符号时,通常由以下原因导致: --- ## 原因分析 1. **平台不支持 LaTeX 解析** 普通文本编辑器或部分网页(如微信、QQ)无法自动渲染 LaTeX,只会显示原始代码(如 `\omega`、`\tan\delta`)。 2. **格式标记缺失** LaTeX 公式需通过特定标记(如 `$$...$$` 或 `\(...\)`)触发解析,若标记不完整,公式将以纯文本形式显示。 --- ## 解决方法 ### 1. 转换为图片格式 **使用在线 LaTeX 编辑器生成公式图片**: - 访问 [CodeCogs LaTeX 编辑器](https://latex.codecogs.com/eqneditor/editor.php) - 输入公式代码: ```latex P_{\text{loss}} = \omega C V^2 \tan\delta ``` - 下载 PNG/SVG 图片并插入文档。 **效果**: ![公式图片示例](https://latex.codecogs.com/png.latex?P_{\text{loss}}%20=%20\omega%20C%20V^2%20\tan\delta) -- ### 2. 使用支持 MathJax 的平台 在支持 Markdown + MathJax 的环境(如 Typora、Jupyter Notebook)中直接编写公式: - 行内公式: ```latex 介质损耗公式为 \(P_{\text{loss}} = \omega C V^2 \tan\delta\)。 ``` **效果**:介质损耗公式为 \(P_{\text{loss}} = \omega C V^2 \tan\delta\)。 - 独立公式块: ```latex $$ P_{\text{loss}} = \omega C V^2 \tan\delta $$ ``` **效果**: $$ P_{\text{loss}} = \omega C V^2 \tan\delta $$ --- ### 3. 替代文本描述 若无法使用 LaTeX,可用文字描述公式关系: > **介质损耗功率公式**: > 高频下的介质损耗功率 \(P_{\text{loss}}\) 满足 > \[ > P_{\text{loss}} \propto \omega C V^2 \tan\delta > \] > 其中 \(\omega\) 为角频率,\(C\) 为电容,\(V\) 为电压幅值,\(\tan\delta\) 为介质损耗角正切。 -- ## 支持 LaTeX 的常见场景 | 场景 | 工具/平台 | 示例输入 | |--|--------------------------|---------------------------------| | 学术论文 | LaTeX 编辑器(Overleaf) | `\[P_{\text{loss}} = \omega C V^2 \tan\delta\]` | | 网页/博客 | Hugo + MathJax 插件 | `$$ P_{\text{loss}} = \omega C V^2 \tan\delta $$` | | 编程环境 | Jupyter Notebook | 直接使用 `$$...$$` 或 `\\(...\\)` | --- ## 公式渲染对比示例 - **未渲染**(纯文本): `P_loss = ωCV²tanδ` - **渲染后**(MathJax): \[ P_{\text{loss}} = \omega C V^2 \tan\delta \] --- 如需针对特定场景(如 Word/PPT)调整公式格式,可进一步说明需求!
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值