分享+探讨:网页(博客/笔记)的 LaTeX 支持现状

关于目前各种在网页上支持 LaTeX 的方案,就博客与笔记用途写了一篇文章。

其结论是:

目前(2024 年 3 月)仍不存在支持真 LaTeX(起码要支持 LaTeX 宏包)且具有基本的笔记特性(跨页面的侧边树型导航栏与搜索栏)的博客系统,但仍存在一些理论上的可能性。

不过这未必就是正确答案,有待进一步探讨。

3 个赞
Emacs Org-mode 倒是支持完整的 LaTeX。 但是它也有一些痛点,比如 Emacs 本身是单线程,再如它倒是能输出 HTML,但是此 HTML 并非像博客站那样有导航栏、搜索栏之类的,而只是一个单文件。

可以用内置的 ox-publish ,定制性非常强。正好我刚刚折腾完,顺便分享一下我的博客:https://elilif.github.io/ ,搜索栏也在计划中。

虽然在其源码里没找到 MathJax、KaTeX 之类的,但也没找到与 LaTeX 和 SVG 同时相关的,说不定完全不处理 LaTeX。
但是,我们可以考虑自研一个这样的博客系统(或许是一个 hugo 主题),它可以像 Emacs Org-mode 那样将 LaTeX 代码用真正的 LaTeX 引擎渲染成图片(最好是 SVG)并嵌入 HTML 中。

org-mode 本身就支持在导出时将 LaTeX 转成图片嵌入,图片格式也可以自定义。详见 Math formatting in HTML export (The Org Manual)

6 个赞

感谢分享,我把你的博客链接也更新到文章里了。期待你的博客未来的样子。

我都是直接写 MathML 的

刚才去了解了一下,如果直接手打 MathML 的话,复杂度有点夸张。

是指在别的工具上编辑公式,然后导出 MathML?

用 Emacs 自带的 nxml-mode 写 content mathml,导出时加一个 XSLT pass 转成 presentation mathml

我的文章都是用 DocBook XML 写的,用 XSLT 导出 HTML5

https://ldbeth.sdf.org/articles/linear.html

1 个赞

看了你的博客,很赞啊。基本就是我希望我的博客应该有的样子,我去学习一下。

1 个赞

temml 可以转成 MathML

mathjax 不够用吗,支持完整 latex 是有什么场景吗

看主题里文章的话能知道理由是不能跑 TikZ。

当然首先要知道 TikZ 这个东西只有在输出 PDF 的时候才能用,因为本质是通过输出 PDF 的基础指令实现的画图。

我也很少直接用 TikZ,作图首选是 TeX 作者 DEK 用的 MetaPost。

用 MetaPost 画的数织问题答案

用 SVG 做公式如果內嵌的话 HTML 体积会增大太多,影响加载,另外 host 的话不方便网站结构变化,我不太喜欢这种方案。当然我也有用到 TeX 生成的 SVG 的时候,比如用 MusiXTeX 制作的五线谱 Common Lisp and Music Composition

1 个赞

能用到 LaTeX 宏包或自定义命令的场景还是很多的。Tikz 是其一。关于自定义命令我举个例子,有个符号是 d 加上一横,这个符号找不到合适的命令,只能自己定义。注:此符号的含义是“变分”,有点类似于偏微分但并不一样。

你应该是对的,因为我刚才找到一个 tex2svg 的项目,它支持 Tikz,而其中一个依赖就是 pdf2svg。

不过原来还有 dvisvgm 不能直接处理的 LaTeX 吗,我才知道。

我倒是没想过这个问题。之后如果我真的去自研这种方案,会尝试缓解(比如降低 svg 精度,或者仅在无法使用 mathjax/katex 时才转为 svg)。

顺便再请问,这种方案能处理 d 加一横这种自定义命令吗?

DVI 原生的画图能力只能画黑色长方形(比如直线),和排列黑色的字体图形。超过这个范围的画图能力都是额外实现的扩展。

你贴的回答下面有这个符号的 Unicode 字符

对于除了约定俗成符号以外,更通用的组合字符,我不推荐这种做法,因为如果字体换了的话这个横可能就不会交叉了

1 个赞

你说得对,所以我在用 LaTeX 时都会特别设置字体。换字体的时候不会只换字体,而是换一整套配置,包括 dbar 这种定义。

不知道题主有没有考虑过 Sphinx? 它在导出数学公式的时候也使用了 Emacs 的 AUCTeX, 对数学公式有完整的支持. (Math support for HTML outputs in Sphinx — Sphinx documentation)

1 个赞

简单看了一眼,它似乎就是我原文中在找的那个方案。如果是的话就太好了。

非常感谢。 有空我会详细了解一下。

1 个赞

其实我一直希望的一个效果就是, mathjax 支持的 latex 表达式都是相对简单的,复杂的比如用到 algorithm2e 的就放在 #+begin_src latex 当中,导出到 hugo 的时候,这类复杂的转为图片,以上简单的继续用 mathjax 来渲染。

不清楚 ox-hugo 是怎么实现的,但这是 ox-html 的默认行为(需要对 ob-latex 做一点设置)

我搞不定这个,选择了 #+OPTIONS: tex:dvisvgm 方式,org-latex-preview 在 org 中是正常的,导出到 svg 后,css 中的 vertical-align 应该还要 -1em 才能在网页上对齐,请问这个需要怎么修改啊。

你是用什么导出的呢?我用 ox-html 导出是没有 inline css 的。

另外用 #+OPTIONS: tex:dvisvgm 是把所有的 LaTeX 代码块导出成图片。你的需求不是 latex babel 里的才导出为图片吗?

是我使用的主题定义了 img 标签的 margin,麻烦您花费时间帮我找问题了。

我的需求确实是只有 latex babel 中导出为图片,但是我这里到了 pdf 就会报错,不会生成 svg。(退而求其次才使用了 #+OPTIONS: tex:dvisvgm 方法的)