一个基于 JSXGraph 的现代化交互式数学几何可视化工具，支持动态几何图形绘制、函数图像、统计图表和数学公式编辑。
- 基础几何元素: 点、线、圆、椭圆、抛物线、双曲线
- 高级图形: 多边形、星形、心形、玫瑰线、螺旋线
- 向量和线段: 支持向量绘制和线段测量
- 切线: 自动计算和绘制切线
- 数学函数: 支持任意数学函数绘制
- 三角函数: 正弦、余弦等三角函数可视化
- 参数方程: 支持参数方程绘制椭圆、圆等
- LaTeX 公式: 支持 LaTeX 数学公式输入和渲染
- 柱状图: 可拖拽的交互式柱状图
- 饼图: 动态饼图展示
- 散点图: 数据点可视化
- 实时编辑: 支持图表数据的实时修改
- 拖拽操作: 所有图形元素支持拖拽移动
- 缩放和平移: 支持画布缩放和平移
- 撤销/重做: 完整的操作历史记录
- 多画布: 支持多个工作画布切换
- 动画: 支持几何图形的动画演示
- 公式编辑器: 集成 MathLive 数学公式编辑器
- 计算引擎: 基于 MathJS 的数学计算
- 概率分布: 正态分布、指数分布、泊松分布等
- 几何构造: 支持复杂的几何构造过程
- 提示词绘图: 输入自然语言描述，由本地 Ollama 模型生成可预览的绘图方案
- 图片辅助绘图: 上传数学图、手绘草图或截图，由视觉模型尝试还原为 JSXGraph 图形
- 模型可切换: 可在 AI 面板里为单次请求指定本地模型，也可通过环境变量设置默认模型
- 安全应用: AI 只返回受控 JSON 绘图方案，前端校验后再应用到当前画板
- Node.js 18+
- Yarn 或 npm
- Ollama（使用本地 AI 绘图功能时需要）
# 使用 yarn (推荐)
yarn install
# 或使用 npm
npm install# 使用 yarn
yarn dev
# 或使用 npm
npm run dev打开 http://localhost:3000 开始使用。
AI 绘图功能通过本机 Ollama 服务生成绘图方案。请先安装 Ollama，再准备文本模型和视觉模型。以下是示例命令；项目安装和构建不会自动下载或启动模型：
# 下载内置默认模型
ollama pull qwen3
ollama pull qwen3-vl:8b
# 启动本地 Ollama 服务
ollama serve
# 可选：在另一个终端中运行模型，确认安装成功
ollama run qwen3
ollama run qwen3-vl:8b也可以换成你本机已经安装的模型，例如文本绘图使用 gemma4:latest、llama3:latest 等；图片绘图需要使用支持图片输入的视觉模型，例如 qwen2.5vl:3b、qwen3-vl:8b 等。
可通过启动应用时设置以下环境变量覆盖服务端默认配置：
| 环境变量 | 内置默认值 | 用途 |
|---|---|---|
OLLAMA_BASE_URL |
http://localhost:11434 |
Ollama 服务地址 |
OLLAMA_TEXT_MODEL |
qwen3 |
文本绘图请求使用的模型 |
OLLAMA_VISION_MODEL |
qwen3-vl:8b |
图片绘图请求使用的模型 |
OLLAMA_TIMEOUT_MS |
120000 |
请求超时时间（毫秒；最大2147483647） |
例如：
OLLAMA_BASE_URL=http://localhost:11434 \
OLLAMA_TEXT_MODEL=qwen3 \
OLLAMA_VISION_MODEL=qwen3-vl:8b \
OLLAMA_TIMEOUT_MS=120000 \
npm run dev本地开发时也可以创建 .env.local，让 Next.js 自动读取默认配置：
OLLAMA_TEXT_MODEL=gemma4:latest
OLLAMA_VISION_MODEL=qwen2.5vl:3bAI 绘图面板中的“本地模型”输入框支持单次请求覆盖：去除首尾空白后非空的模型名优先于环境变量；留空时使用对应环境变量，未配置环境变量时使用上表的内置默认值。
- 点击右侧的 AI 绘图与公式 面板。
- 输入绘图描述，例如“画一个单位圆和 y = sin(x)，并标注原点”。
- 如需临时换模型，在“本地模型（可选）”里输入 Ollama 模型名，例如
gemma4:latest。 - 如需从图片生成图形，选择一张图片；此时模型应填写或默认使用视觉模型。
- 点击“生成绘图方案”，确认预览通过后，再点击“应用到当前画板”。
当前 AI 绘图方案支持的命令类型包括：函数、点、直线、线段、圆、椭圆、多边形、文本和柱状图。为避免模型输出失控，单次最多应用 80 条绘图命令，坐标范围限制在 -1000 到 1000，图片上传大小限制为 10MB。
# 构建
yarn build
# 启动支持 API 路由的生产服务器
yarn start- 前端框架: Next.js 15 + React 19
- 几何引擎: JSXGraph 1.11
- 数学计算: MathJS + MathLive
- UI 组件: Radix UI + Tailwind CSS
- 图表库: D3.js
- 公式渲染: KaTeX
- 开发工具: TypeScript + ESLint
- 添加几何图形: 点击左侧工具栏的图形按钮
- 绘制函数: 使用公式编辑器输入数学函数
- 创建图表: 选择图表类型并输入数据
- 交互操作: 拖拽图形、缩放画布、平移视图
- 多画布管理: 创建多个工作画布进行复杂项目
- 动画演示: 使用动画工具展示几何变换
- 数据导入: 支持外部数据导入到图表
- 导出功能: 支持图像和数据的导出
欢迎提交 Issue 和 Pull Request！
- Fork 本仓库
- 创建功能分支 (
git checkout -b feature/AmazingFeature) - 提交更改 (
git commit -m 'Add some AmazingFeature') - 推送到分支 (
git push origin feature/AmazingFeature) - 打开 Pull Request
本项目采用 MIT 许可证 - 查看 LICENSE 文件了解详情。