函数图像可视化工具

一个基于 HTML5 Canvas 的函数图像绘制器，专为微积分学习设计。无需安装任何依赖，直接用浏览器打开即可使用。

在线体验

下载或克隆仓库后，用浏览器打开 index.html 文件即可。

git clone https://github.com/dialling/Visualization-function.git
cd Visualization-function
open index.html

主要功能

• 函数图像绘制：输入任意一元函数，实时绘制图像。
• 导函数可视化：勾选后可叠加显示数值导函数 f'(x)，并在画布上标注导数定义式。
• 视图交互：
  • 按住鼠标左键拖动：平移图像
  • 点击 + / − 按钮：以视图中心为基准缩放
• 点定位：
  • 已知 x 求 f(x) 和 f'(x)
  • 已知 f(x) 求 x（在当前视图范围内搜索所有解）
• 常用函数快捷插入：幂函数、三角函数、指数/对数、复合函数等分类按钮，点击即可在光标位置插入。

支持的表达式

运算符

+、-、*、/、^（乘方）、()

函数与常量

sin、cos、tan、exp、ln、log、sqrt、abs、pi、e

示例

• x^2
• sin(x) + cos(x)
• x^3 - 3*x
• e^(-x^2)
• ln(x)
• sin(x)/x

技术说明

• 纯前端实现，单文件 index.html，无需构建工具。
• 表达式解析使用自定义的调度场算法（Shunting-yard），避免使用 eval()。
• 导数采用中心差分计算：f'(x) ≈ [f(x+h) - f(x-h)] / (2h)，在边界处自动退化为单边差分。
• 由 y 反查 x 时，采用采样加二分法求根。

适用场景

• 微积分入门学习：理解函数、导数、单调性、极值等概念。
• 快速验证函数图像形态。
• 课堂教学演示。

许可证

MIT License