直觉与形式：交互式数学图表与公式变形演进

在我看来，数学从来不应该只是教科书里凝固的冰冷符号，它是我观察物理现实、信号系统与算法本质的透镜。

在撰写 Nodes · 实践 与 Notes · 随笔 时，静态的 $\LaTeX$ 公式固然严谨庄重，但当需要向读者（或者未来的自己）阐述一个参数如何影响动态响应、积分面积如何随边界漂移、或者一个公式如何步步演变变形时，文字往往显得苍白。

我希望 Maplen 的页面能够像一张数字互动草稿纸：既有出版级质感的排版推演，又能通过公式步进变形动画与交互图表，把直觉亲手交还给读者。

在这篇手记中，我向大家展示 Maplen 里的数学公式渲染、步进变形与动态函数交互功能。

一、高阶数学公式排版范式

Maplen 的数学公式在构建期通过 KaTeX 预渲染为静态 MathML 与 SVG，零客户端抖动，支持多种复杂的数学排版范式：

使用 \begin{aligned} ... \end{aligned} 展示多步严密的代数变换：

\begin{aligned} \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} \\ \nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \\ \nabla \cdot \mathbf{B} &= 0 \end{aligned} \tag{1}

在描述状态方程与非线性控制时，分段与矩阵是不可或缺的工具：

f(x) = \begin{cases} 0, & x < 0 \\ \frac{1}{2} x^2, & 0 \le x < 1 \\ x - \frac{1}{2}, & x \ge 1 \end{cases} \qquad \mathbf{A} = \begin{bmatrix} 0 & 1 \\ -\frac{k}{m} & -\frac{c}{m} \end{bmatrix} \tag{2}

最令人心动的数学体验，往往不是看到最终那行孤立的恒等式，而是亲眼目睹公式内部的项如何如同细胞裂变般展开、重组、对称相消，最终优雅地坍缩为一个至简定理。

为此，我编写了专门的公式变形演进组件 <FormulaDerivation />。你可以通过下方的控制栏单步推导，或者点击「自动推导演进」，观察著名的欧拉公式与二阶传递函数的动态诞生过程：

交互推导 · 数学公式变形演示

见证人类数学史上最美公式的推演变形：指数函数如何在虚数维度与三角谐波完美相遇。

第一步：指数函数 e^u 的无穷泰勒级数步骤 1 / 6

e^u = \sum_{n=0}^{\infty} \frac{u^n}{n!} = 1 + u + \frac{u^2}{2!} + \frac{u^3}{3!} + \frac{u^4}{4!} + \frac{u^5}{5!} + \cdots

推导演进解析： 在实数域中，这是定义指数增长的自然级数。我们尝试赋予变量虚数单位 u = i\theta。

这个组件通过安全的客户端状态驱动，结合 KaTeX 实时矢量重绘，将原本枯燥的长篇推导分解为节奏明晰的视觉序列。

除了公式本身的变形，参数改变对空间曲线形态的塑造同样需要动态探索。

在交流电路与机械振动中，正弦波是最基础的积木。它的解析式及其导数为：

f(x) = a\sin(bx + c), \qquad f'(x) = ab\cos(bx + c) \tag{3}

拖动下方参数滑块，点击「导数 $f'(x)$ 」或「积分面积」，直观比对原函数与其导函数的正交相位差：

在量子力学与小波变换中，我经常遇到能量局域化的「波包」（Wave Packet）：

f(x) = a \cdot \exp\left(-\sigma x^2\right) \cdot \cos(b x) \tag{4}

高斯衰减项 $e^{-\sigma x^2}$ 会迅速压制振荡，使能量严格约束在有限的时间视窗内：

从受资源上限约束的种群繁衍，到神经网络中经典的 Sigmoid 激活函数，逻辑斯蒂曲线描绘了一种非线性的平滑阈值过程：

f(x) = \frac{L}{1 + e^{-k(x - x_0)}} \tag{5}

在将高交互代码直接嵌入 Markdown 文章时，我时刻保持着对工程边界的敬畏：

拒绝 eval() 与任意代码执行：数学表达式由安全沙盒 expr-eval 进行词法解析，只开放受控的基础初等函数与算符，杜绝任何 XSS 攻击的隐患；
纯矢量与轻量岛屿：图表采用原生 SVG 与轻量 Canvas 渲染，公式变形引擎直接复用 KaTeX 语法树，整包体积极小；
原生无缝的双主题契合：全部图表坐标轴与曲线均绑定全站 CSS 变量，切换「褐页」与「暖墨」双主题时即刻无感自适应。

把直觉交还给双手，让公式不再孤立。这正是我在 Maplen 中想要守护的严谨与生动。