Hexo 中 MathJax 的静态显示(svg)

将 MathJax 的公式静态显示为 SVG,还支持化学方程式呢 boom ~

hexo-mathjax-svg.jpg

对 NexT 主题来说,是支持 MathJax 的,但是感觉不够清真:

  1. 动态加载,渲染还要时间;
  2. 有个右键菜单,感觉没必要。

步骤一

站点文件夹根目录,输入下面命令回车:

所在目录:~/blog/
1
npm i -S deasync mathjax-node-page jsdom@9

步骤二

站点文件夹根目录新建文件夹scripts,然后在文件夹内新建文件jax.js

文件位置:~/blog/scripts/jax.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
const mjpage = require('mathjax-node-page').mjpage
const deasync = require('deasync')

hexo.extend.filter.register(
'after_render:html',
str => {
let data = null
mjpage(
str,
{
format: ['TeX'],
singleDollars: true,
cssInline: false
},
{ svg: true, css: false, speakText: false },
x => (data = x)
)
deasync.loopWhile(() => data === null)
return data
},
100
)

步骤三

修改样式,NexT 主题在custom.styl中加入:

文件位置:~/blog/themes/next/source/css/_custom/custom.styl
1
2
3
4
5
6
7
.mjpage__block {
display: inline-block;
text-align: center;
width: 100%;
overflow-x: auto;
vertical-align: bottom;
}

Enjoy it !

爱因斯坦场方程:

克莱因-戈登(Klein-Gordon)方程,描述玻色子:

上面方程是时间和空间的二阶导数,不简洁,于是狄拉克将之化为时间和空间的一阶导数,狄拉克(Dirac)方程,描述费米子:

物理学的大前提:自然规律应该是简洁的!

麦克斯韦方程组:

四个独立方程按上面顺序分别是:法拉第电磁感应定律、毕奥沙伐尔定律、库仑定律、磁场无源场。

麦克斯韦为了解释电容器可以通交流这个现象,在毕奥沙伐尔定律后面加上(位移电流假说),于是将本来独立的四个方程紧紧联系在一起,构成一个方程组。

用微积分解微分方程,得到两个波动方程:

上面第一个方程是电场的,第二个是磁场的。

牛顿的时候波动方程的结论:

  1. 只要这个物理量满足波动方程,那么这个物理量就肯定以波的形式向外传播。
  2. 对时间二阶导数前面的常数()开根号再导数,就是这个波的传播速度。

麦克斯韦计算得出:

于是麦克斯韦预言:

  1. 电磁以波动形式传播
  2. 光是一种电磁波(光速当时已测出)

Enjoy it ! coffee ~

参考了 https://github.com/maple3142,他的博客超快!喜欢的point_right大佬point_left可以去这里这里借鉴一下 ~

化学方程式

今天突然想到能否写化学方程式呢?Google 后,发现有一个叫 mhchem 的 MathJax 的插件可以实现,说明见此插件的手册

可是怎么在 Hexo 中使用呢?回到刚 Google 的 tab,发现下面就有 MathJax 的文档,阅读后尝试一下,发现挺简单的,连我这个代码小白都会 smile ~

只需在上面提到的jax.js中加入一行并小修改即可:

文件位置:~/blog/scripts/jax.js
1
2
3
4
5
6
7
8
9
        mjpage(
str,
{
format: ['TeX'],
singleDollars: true,
- cssInline: false
+ cssInline: false,
+ mhchem: { legacy: true }
},

效果:

当然,这个插件的应用不止化学方程,还可以写物理中的核反应,比如原子弹 boom

太阳中氢转换成氦的三个反应:

第一个反应是一个弱相互作用,反应概率很低的一个过程,这就是现在太阳不会爆炸而是缓慢“燃烧”的原因。微观粒子的研究成果(弱相互作用)竟然能用在巨大的天体物理中,反映出研究粒子物理或高能物理的重要性,这也是目前物理学的前沿。

一些提示

常用的网页:

  1. 一份教程:https://www.cnblogs.com/linxd/p/4955530.html
  2. https://en.wikibooks.org/wiki/LaTeX/Mathematics
  3. 官网的 Live Demo:https://www.mathjax.org/#demo

另外,由于有些语法与 Markdown 语法的冲突,因此可能会有错误,建议加转义符,比如:下标\_,换行\\\\。如果还遇到莫名的报错,在适当位置加空格,然后调试直到没问题。

最后,博主发现此方法如果想表示方程组(左边有花括号),用
\left\{
\begin{array}...\end{array}
\right.
会报错,估计是\right.的问题,不过可以用\begin{cases}...\end{cases}替代。

Enjoy it ! coffee ~


本文结束啦感谢您阅读
0%