数学公式与图表

English: English · Markdown语法 · MOC-中文文档

Inimark 内置 KaTeX 与 Mermaid,写法与常见学术 / 技术笔记一致。下方每个示例都是:先源码,再渲染结果。

怎么写(先谈方法)

需求用法
句子里的一个符号行内 $…$
单独成行的公式块级 $$…$$(独占若干行)
架构 / 流程 / 时序```mermaid 围栏
精修一大块先到 编辑模式 › 源码模式,改完再切回

快捷键:用 Alt + Ctrl/⌘ + B 插入公式块。改完密集的 LaTeX 或 Mermaid 后,在 WYSIWYG 里预览;若围栏渲染失败,检查拼写以及当前 Mermaid 构建是否支持该图类型。

按场景选图表

场景Mermaid 类型
流程 / 决策flowchart
API 或用户旅程随时间展开sequenceDiagram / journey
领域模型classDiagram / erDiagram
发布计划gantt / timeline
头脑风暴结构mindmap

发布会打包 KaTeX 资源,静态站上的公式观感与编辑器一致 — 见 发布为网站。

行内公式

源码:

爱因斯坦质能关系:$E = mc^2$

欧拉公式:$e^{i\pi} + 1 = 0$

勾股定理:$a^2 + b^2 = c^2$

渲染:

爱因斯坦质能关系:E=mc2E = mc^2E=mc2

欧拉公式:eiπ+1=0e^{i\pi} + 1 = 0eiπ+1=0

勾股定理:a2+b2=c2a^2 + b^2 = c^2a2+b2=c2

块级公式

贝叶斯定理

源码:

$$
P(A\mid B) = \frac{P(B\mid A)\,P(A)}{P(B)}
$$

渲染:

P(A\mid B) = \frac{P(B\mid A)\,P(A)}{P(B)}P(A∣B)=P(B∣A) P(A)P(B)P(A\mid B) = \frac{P(B\mid A)\,P(A)}{P(B)}P(A∣B)=P(B)P(B∣A)P(A)​

矩阵乘法

源码:

$$
\begin{pmatrix}
a & b \\
c & d
\end{pmatrix}
\begin{pmatrix}
x \\
y
\end{pmatrix}
=
\begin{pmatrix}
ax + by \\
cx + dy
\end{pmatrix}
$$

渲染:

\begin{pmatrix} a & b \\ c & d \end{pmatrix} \begin{pmatrix} x \\ y \end{pmatrix} = \begin{pmatrix} ax + by \\ cx + dy \end{pmatrix}(abcd)(xy)=(ax+bycx+dy)\begin{pmatrix} a & b \\ c & d \end{pmatrix} \begin{pmatrix} x \\ y \end{pmatrix} = \begin{pmatrix} ax + by \\ cx + dy \end{pmatrix}(ac​bd​)(xy​)=(ax+bycx+dy​)

高斯积分

源码:

$$
\int_{-\infty}^{\infty} e^{-x^{2}}\,dx = \sqrt{\pi}
$$

渲染:

\int_{-\infty}^{\infty} e^{-x^{2}}\,dx = \sqrt{\pi}∫−∞∞e−x2 dx=π\int_{-\infty}^{\infty} e^{-x^{2}}\,dx = \sqrt{\pi}∫−∞∞​e−x2dx=π​

泰勒展开(指数函数)

源码:

$$
e^{x} = \sum_{n=0}^{\infty} \frac{x^{n}}{n!} = 1 + x + \frac{x^{2}}{2!} + \frac{x^{3}}{3!} + \cdots
$$

渲染:

e^{x} = \sum_{n=0}^{\infty} \frac{x^{n}}{n!} = 1 + x + \frac{x^{2}}{2!} + \frac{x^{3}}{3!} + \cdotsex=∑n=0∞xnn!=1+x+x22!+x33!+⋯e^{x} = \sum_{n=0}^{\infty} \frac{x^{n}}{n!} = 1 + x + \frac{x^{2}}{2!} + \frac{x^{3}}{3!} + \cdotsex=n=0∑∞​n!xn​=1+x+2!x2​+3!x3​+⋯

傅里叶变换

源码:

$$
\hat{f}(\xi) = \int_{-\infty}^{\infty} f(x)\,e^{-2\pi i x\xi}\,dx
$$

渲染:

\hat{f}(\xi) = \int_{-\infty}^{\infty} f(x)\,e^{-2\pi i x\xi}\,dxf^(ξ)=∫−∞∞f(x) e−2πixξ dx\hat{f}(\xi) = \int_{-\infty}^{\infty} f(x)\,e^{-2\pi i x\xi}\,dxf^​(ξ)=∫−∞∞​f(x)e−2πixξdx

薛定谔方程(含时)

源码:

$$
i\hbar\frac{\partial}{\partial t}\Psi(\mathbf{r}, t) = \hat{H}\Psi(\mathbf{r}, t)
$$

渲染:

i\hbar\frac{\partial}{\partial t}\Psi(\mathbf{r}, t) = \hat{H}\Psi(\mathbf{r}, t)iℏ∂∂tΨ(r,t)=H^Ψ(r,t)i\hbar\frac{\partial}{\partial t}\Psi(\mathbf{r}, t) = \hat{H}\Psi(\mathbf{r}, t)iℏ∂t∂​Ψ(r,t)=H^Ψ(r,t)

麦克斯韦方程组

源码:

$$
\begin{aligned}
\nabla\cdot\mathbf{E} &= \frac{\rho}{\varepsilon_{0}} \\
\nabla\cdot\mathbf{B} &= 0 \\
\nabla\times\mathbf{E} &= -\frac{\partial\mathbf{B}}{\partial t} \\
\nabla\times\mathbf{B} &= \mu_{0}\mathbf{J} + \mu_{0}\varepsilon_{0}\frac{\partial\mathbf{E}}{\partial t}
\end{aligned}
$$

渲染:

\begin{aligned} \nabla\cdot\mathbf{E} &= \frac{\rho}{\varepsilon_{0}} \\ \nabla\cdot\mathbf{B} &= 0 \\ \nabla\times\mathbf{E} &= -\frac{\partial\mathbf{B}}{\partial t} \\ \nabla\times\mathbf{B} &= \mu_{0}\mathbf{J} + \mu_{0}\varepsilon_{0}\frac{\partial\mathbf{E}}{\partial t} \end{aligned}∇⋅E=ρε0∇⋅B=0∇×E=−∂B∂t∇×B=μ0J+μ0ε0∂E∂t\begin{aligned} \nabla\cdot\mathbf{E} &= \frac{\rho}{\varepsilon_{0}} \\ \nabla\cdot\mathbf{B} &= 0 \\ \nabla\times\mathbf{E} &= -\frac{\partial\mathbf{B}}{\partial t} \\ \nabla\times\mathbf{B} &= \mu_{0}\mathbf{J} + \mu_{0}\varepsilon_{0}\frac{\partial\mathbf{E}}{\partial t} \end{aligned}∇⋅E∇⋅B∇×E∇×B​=ε0​ρ​=0=−∂t∂B​=μ0​J+μ0​ε0​∂t∂E​​

拉格朗日方程

源码:

$$
\frac{d}{dt}\left(\frac{\partial L}{\partial \dot{q}_{i}}\right) - \frac{\partial L}{\partial q_{i}} = 0
$$

渲染:

\frac{d}{dt}\left(\frac{\partial L}{\partial \dot{q}_{i}}\right) - \frac{\partial L}{\partial q_{i}} = 0ddt(∂L∂q˙i)−∂L∂qi=0\frac{d}{dt}\left(\frac{\partial L}{\partial \dot{q}_{i}}\right) - \frac{\partial L}{\partial q_{i}} = 0dtd​(∂q˙​i​∂L​)−∂qi​∂L​=0

爱因斯坦场方程

源码:

$$
R_{\mu\nu} - \frac{1}{2}Rg_{\mu\nu} + \Lambda g_{\mu\nu} = \frac{8\pi G}{c^{4}}T_{\mu\nu}
$$

渲染:

R_{\mu\nu} - \frac{1}{2}Rg_{\mu\nu} + \Lambda g_{\mu\nu} = \frac{8\pi G}{c^{4}}T_{\mu\nu}Rμν−12Rgμν+Λgμν=8πGc4TμνR_{\mu\nu} - \frac{1}{2}Rg_{\mu\nu} + \Lambda g_{\mu\nu} = \frac{8\pi G}{c^{4}}T_{\mu\nu}Rμν​−21​Rgμν​+Λgμν​=c48πG​Tμν​

纳维–斯托克斯方程(不可压)

源码:

$$
\rho\left(\frac{\partial\mathbf{u}}{\partial t} + \mathbf{u}\cdot\nabla\mathbf{u}\right) = -\nabla p + \mu\nabla^{2}\mathbf{u} + \mathbf{f}
$$

渲染:

\rho\left(\frac{\partial\mathbf{u}}{\partial t} + \mathbf{u}\cdot\nabla\mathbf{u}\right) = -\nabla p + \mu\nabla^{2}\mathbf{u} + \mathbf{f}ρ(∂u∂t+u⋅∇u)=−∇p+μ∇2u+f\rho\left(\frac{\partial\mathbf{u}}{\partial t} + \mathbf{u}\cdot\nabla\mathbf{u}\right) = -\nabla p + \mu\nabla^{2}\mathbf{u} + \mathbf{f}ρ(∂t∂u​+u⋅∇u)=−∇p+μ∇2u+f

柯西积分公式

源码:

$$
f(a) = \frac{1}{2\pi i}\oint_{C}\frac{f(z)}{z-a}\,dz
$$

渲染:

f(a) = \frac{1}{2\pi i}\oint_{C}\frac{f(z)}{z-a}\,dzf(a)=12πi∮Cf(z)z−a dzf(a) = \frac{1}{2\pi i}\oint_{C}\frac{f(z)}{z-a}\,dzf(a)=2πi1​∮C​z−af(z)​dz

布莱克–斯科尔斯 PDE

源码:

$$
\frac{\partial V}{\partial t} + \frac{1}{2}\sigma^{2}S^{2}\frac{\partial^{2}V}{\partial S^{2}} + rS\frac{\partial V}{\partial S} - rV = 0
$$

渲染:

\frac{\partial V}{\partial t} + \frac{1}{2}\sigma^{2}S^{2}\frac{\partial^{2}V}{\partial S^{2}} + rS\frac{\partial V}{\partial S} - rV = 0∂V∂t+12σ2S2∂2V∂S2+rS∂V∂S−rV=0\frac{\partial V}{\partial t} + \frac{1}{2}\sigma^{2}S^{2}\frac{\partial^{2}V}{\partial S^{2}} + rS\frac{\partial V}{\partial S} - rV = 0∂t∂V​+21​σ2S2∂S2∂2V​+rS∂S∂V​−rV=0

大段公式建议在 源码模式 里微调,再切回 WYSIWYG 查看。

Mermaid 图表示例

每个图种先给出可复制的源码,再给出渲染结果。渲染时写在 ```mermaid 代码块中即可。

流程图(flowchart)

源码:

flowchart LR
  Note[笔记] -->|wikilink| Note2[另一篇]
  Note2 --> Graph[关系图谱]
  Note --> Site[Publish 站点]

渲染:

flowchart LR
  Note[笔记] -->|wikilink| Note2[另一篇]
  Note2 --> Graph[关系图谱]
  Note --> Site[Publish 站点]

时序图(sequenceDiagram)

源码:

sequenceDiagram
  participant Author
  participant Editor
  participant SSG
  Author->>Editor: 写作 Markdown
  Author->>SSG: Publish
  SSG-->>Author: 静态 HTML

渲染:

sequenceDiagram
  participant Author
  participant Editor
  participant SSG
  Author->>Editor: 写作 Markdown
  Author->>SSG: Publish
  SSG-->>Author: 静态 HTML

类图(classDiagram)

源码:

classDiagram
  class Note {
    +string path
    +string body
    +save()
  }
  class Library {
    +string root
    +open(path)
  }
  Library "1" --> "*" Note : contains

渲染:

classDiagram
  class Note {
    +string path
    +string body
    +save()
  }
  class Library {
    +string root
    +open(path)
  }
  Library "1" --> "*" Note : contains

状态图(stateDiagram)

源码:

stateDiagram-v2
  [*] --> Idle
  Idle --> Editing: 打开笔记
  Editing --> Preview: Publish
  Preview --> Editing: 继续改
  Editing --> [*]: 关闭

渲染:

stateDiagram-v2
  [*] --> Idle
  Idle --> Editing: 打开笔记
  Editing --> Preview: Publish
  Preview --> Editing: 继续改
  Editing --> [*]: 关闭

实体关系图(erDiagram)

源码:

erDiagram
  LIBRARY ||--o{ NOTE : contains
  NOTE ||--o{ LINK : has
  NOTE {
    string path
    string title
  }
  LINK {
    string target
  }

渲染:

erDiagram
  LIBRARY ||--o{ NOTE : contains
  NOTE ||--o{ LINK : has
  NOTE {
    string path
    string title
  }
  LINK {
    string target
  }

甘特图(gantt)

源码:

gantt
  title 帮助库写作节奏
  dateFormat  YYYY-MM-DD
  section 内容
  安装与欢迎           :a1, 2026-09-01, 3d
  Markdown 与公式      :a2, after a1, 4d
  section 发布
  主题与站点           :b1, after a2, 3d

渲染:

gantt
  title 帮助库写作节奏
  dateFormat  YYYY-MM-DD
  section 内容
  安装与欢迎           :a1, 2026-09-01, 3d
  Markdown 与公式      :a2, after a1, 4d
  section 发布
  主题与站点           :b1, after a2, 3d

饼图(pie)

源码:

pie showData
  title 笔记时间分配(示意)
  "写作" : 45
  "整理双链" : 25
  "主题与发布" : 20
  "其他" : 10

渲染:

pie showData
  title 笔记时间分配(示意)
  "写作" : 45
  "整理双链" : 25
  "主题与发布" : 20
  "其他" : 10

脑图(mindmap)

源码:

mindmap
  root((Inimark))
    编辑
      WYSIWYG
      源码模式
    知识
      库
      双链
      图谱
    发布
      主题
      静态站

渲染:

mindmap
  root((Inimark))
    编辑
      WYSIWYG
      源码模式
    知识
      库
      双链
      图谱
    发布
      主题
      静态站

时间线(timeline)

源码:

timeline
  title Inimark 文档阅读路径
  section 入门
    安装 : 下载 Releases
    界面 : 认识侧栏与编辑区
  section 深入
    Markdown : 语法与公式
    双链 : 把笔记连成网
  section 输出
    Publish : 导出静态站点

渲染:

timeline
  title Inimark 文档阅读路径
  section 入门
    安装 : 下载 Releases
    界面 : 认识侧栏与编辑区
  section 深入
    Markdown : 语法与公式
    双链 : 把笔记连成网
  section 输出
    Publish : 导出静态站点

Git 图(gitGraph)

源码:

gitGraph
  commit id: "init"
  branch feature
  checkout feature
  commit id: "docs"
  checkout main
  merge feature
  commit id: "release"

渲染:

gitGraph
  commit id: "init"
  branch feature
  checkout feature
  commit id: "docs"
  checkout main
  merge feature
  commit id: "release"

旅程图(journey)

源码:

journey
  title 从安装到发布
  section 安装
    打开 Releases: 5: 用户
    安装应用: 4: 用户
  section 写作
    打开 docs 库: 5: 用户
    编辑笔记: 5: 用户
  section 发布
    Publish 预览: 4: 用户

渲染:

journey
  title 从安装到发布
  section 安装
    打开 Releases: 5: 用户
    安装应用: 4: 用户
  section 写作
    打开 docs 库: 5: 用户
    编辑笔记: 5: 用户
  section 发布
    Publish 预览: 4: 用户

象限图(quadrantChart)

源码:

quadrantChart
  title 功能取舍(示意)
  x-axis 低投入 --> 高投入
  y-axis 低价值 --> 高价值
  quadrant-1 优先做
  quadrant-2 评估后做
  quadrant-3 少做
  quadrant-4 谨慎
  WYSIWYG: [0.7, 0.85]
  双链图谱: [0.65, 0.8]
  Publish: [0.55, 0.75]
  插件市场: [0.9, 0.35]

渲染:

quadrantChart
  title 功能取舍(示意)
  x-axis 低投入 --> 高投入
  y-axis 低价值 --> 高价值
  quadrant-1 优先做
  quadrant-2 评估后做
  quadrant-3 少做
  quadrant-4 谨慎
  WYSIWYG: [0.7, 0.85]
  双链图谱: [0.65, 0.8]
  Publish: [0.55, 0.75]
  插件市场: [0.9, 0.35]

需求图(requirementDiagram)

源码:

requirementDiagram
  requirement stable {
    id: R1
    text: 公式与图表在 WYSIWYG 中可渲染
    risk: low
    verifymethod: test
  }
  element editor {
    type: component
  }
  editor - satisfies -> stable

渲染:

requirementDiagram
  requirement stable {
    id: R1
    text: "公式与图表在 WYSIWYG 中可渲染"
    risk: low
    verifymethod: test
  }
  element editor {
    type: component
  }
  editor - satisfies -> stable

部分较新的 Mermaid 图种(如 sankey、xychart、block)取决于内置 Mermaid 版本。上表所列均为常用、稳定类型。

与发布的关系

Publish 会打包 KaTeX 资源,使站点中的公式尽可能保持一致。主题与站点配置见 发布为网站、主题与外观。


上一篇:代码与语法高亮 · 下一篇:查找替换与快捷键