结论先行:Manim 可以在浏览器里直接运行。极坐标XYZ(jizuobiao.xyz)用 Pyodide 把 Manim Community 0.20.1 搬进浏览器,渲染落在 Canvas2D 上,不装 Python / LaTeX / ffmpeg 就能写 Scene 出动画,导出 mp4/gif,还能把代码压进 URL 分享。对"想验证一段 manim 代码又不想配环境"的开发者特别顺手。
痛点:本地 Manim 的依赖地狱
想在本地跑 Manim,得先装 Python,再装 LaTeX、ffmpeg、cairo、pango 一整套依赖,光配环境就能耗掉一下午;渲染还得走命令行。想快速试一段代码、查个 API 行为,成本高得离谱。
上手:打开就是可运行的示例
Playground 免登录,内置 5 个覆盖常见场景的示例,直接 Run:基础动画、图表 + updater、中文 + MathTex 公式、3D、布尔运算。比如最基础的一个:
from manim import *
class Demo(Scene):
def construct(self):
c = Circle(color=BLUE, fill_opacity=0.5)
s = Square(color=YELLOW, fill_opacity=0.5)
self.play(Create(c))
self.play(Transform(c, s))
self.play(c.animate.shift(RIGHT * 2).rotate(PI / 4))
self.wait(0.3)
updater / ValueTracker 这类"值驱动"的动画也照跑——一个点沿正弦曲线实时移动:
t = ValueTracker(0.0)
dot = always_redraw(lambda: Dot(ax.c2p(t.get_value(), np.sin(t.get_value()*PI)), color=RED))
self.play(t.animate.set_value(3.0), run_time=2)
2D / 3D / animation / updater / 中文 Text / MathTex / 布尔运算都跑得通。
对开发者友好的那些点
- 编辑器有类型感知:基于 jedi 内省真 manim,敲
Circle().弹方法补全、敲Circle(提示参数签名、hover 看 docstring,跟 VSCode 体验接近; - 报错给完整 traceback:出错底部直接显示 Python 栈,不白屏,调起来不抓瞎;
- 渲染不卡死:逐帧让出事件循环,长动画不触发浏览器"页面无响应",还实时显示已生成帧数;
- 导出:ffmpeg.wasm 导出 mp4(libx264)/ gif,分辨率到 1080p、帧率可选;
- 分享靠 URL:代码压缩后编码进链接,无需后端,打开即还原——发同事、贴文档都方便;
- 天然沙盒:用户代码跑在 Pyodide 里,不触达服务器。
它凭什么做得到(技术点到为止)
- 真 Manim 本体:跑的是官方 Community 0.20.1,不是"像 Manim"的重写实现,所以 API 全量、随官方升级——学了、写了都不过时;
- Canvas2D 落点:渲染不挑 WebGPU,国内主流浏览器、老设备乃至微信里都能跑,中文原生支持;
- 全自托管:资源不走 CDN,国内访问稳定。
思路上就是用 Pyodide 跑 Python,把 Manim 的原生依赖在浏览器里替换实现(渲染→Canvas2D、公式→MathJax、导出→ffmpeg.wasm、中文→CJK 字体子集),而不是另造引擎。
想深入:23 节系统教程
站里的教程有 23 节、分 6 个阶段,从"第一次渲染""改一行"到三要素、坐标系、3D,每节视频旁就是可运行代码,边看边改。