Desmos 图形计算器 MCP 服务

MCP-Desmos 是面向 AI 助手与 MCP 客户端的 Desmos 图形计算器服务,通过 LaTeX 表达式生成出版级二维数学图形、截取共享图表并提取表达式数据,适用于数学可视化与图表复用等场景。

  • by AndresMuelas2004
  • TypeScript
  • 本地部署
  • 2 星标
  • 更新于
在 GitHub 查看 AndresMuelas2004/MCP-Desmos

使用说明

MCP-Desmos

MCP server for Desmos graphing calculator. Generate publication-quality 2D math graphs from LaTeX expressions, capture screenshots of shared Desmos graphs, and extract expression data — all through the Model Context Protocol.

Overview

MCP-Desmos launches a headless Chromium browser via Playwright, loads the Desmos API v1.11, and exposes three tools over MCP's stdio transport. An AI assistant (Claude Desktop, Claude Code, or any MCP client) can call these tools to plot functions, inequalities, parametric curves, labeled points, and more — returning PNG images or structured JSON.

Tech stack: TypeScript, Node.js, Playwright, Desmos API v1.11, Zod, MCP SDK.

Features

  • plot_graph — Render any combination of LaTeX expressions into a Desmos graph (PNG).
  • load_desmos_url — Screenshot an existing shared Desmos calculator URL.
  • get_expressions — Extract LaTeX expressions, colors, and graph settings from a Desmos URL.

Prerequisites

  • Node.js >= 18
  • npm

Installation

git clone https://github.com/AndresMuelas2004/MCP-Desmos.git
cd MCP-Desmos
npm install
npx playwright install chromium
npm run build

Configuration

Claude Desktop

Add the following to your claude_desktop_config.json:

{
  "mcpServers": {
    "desmos": {
      "command": "node",
      "args": ["/absolute/path/to/MCP-Desmos/dist/index.js"]
    }
  }
}

Claude Code

claude mcp add desmos node /absolute/path/to/MCP-Desmos/dist/index.js

Tools

plot_graph

Generate a Desmos-style 2D graph from mathematical expressions. Returns a PNG image.

Parameters

Parameter Type Required Default Description
expressions array yes — List of expressions to plot (see below)
points array no — Individual labeled points
bounds object no auto-fit Viewport bounds (left, right, bottom, top)
xAxisLabel string no — Label for the x-axis
yAxisLabel string no — Label for the y-axis
width number no 800 Image width in pixels
height number no 800 Image height in pixels
showGrid boolean no true Show grid lines
degreeMode boolean no false Use degrees instead of radians

Expression object:

Field Type Required Description
latex string yes LaTeX expression (e.g. y = x^2)
color string no Hex color (e.g. #c74440)
label string no Label text
showLabel boolean no Whether to show the label
lineStyle "solid" | "dashed" | "dotted" no Line style
lineWidth number no Line width (default ~2.5)
pointStyle "POINT" | "OPEN" | "CROSS" no Point rendering style
hidden boolean no Hide this expression

Point object:

Field Type Required Description
latex string yes Point as LaTeX (e.g. (2, 3))
color string no Hex color
label string no Label text
showLabel boolean no Whether to show the label

load_desmos_url

Load an existing Desmos calculator graph from its URL and capture a screenshot.

Parameter Type Required Default Description
url string yes — Desmos calculator URL (e.g. https://www.desmos.com/calculator/4wkcpbapnv)
width number no 800 Screenshot width in pixels
height number no 800 Screenshot height in pixels

get_expressions

Extract mathematical expressions, settings, and configuration from a Desmos calculator URL. Returns JSON.

Parameter Type Required Description
url string yes Desmos calculator URL

Usage Examples

Plot a simple function:

"Plot y = sin(x) and y = cos(x) from -2pi to 2pi"

Visualize data points with a curve fit:

"Plot these sensor readings as points: (0, 1.2), (1, 2.8), (2, 4.1), (3, 8.3) and overlay y = 1.2 * e^(0.6x)"

Extract and re-plot a shared graph:

"Get the expressions from https://www.desmos.com/calculator/4wkcpbapnv and re-plot them with a dark color scheme"

Development

npm run build     # Compile TypeScript to dist/
npm run dev       # Watch mode (recompile on changes)
npm start         # Run the compiled server

Project Structure

MCP-Desmos/
├── src/
│   ├── index.ts              # MCP server entry point, tool registration
│   ├── browser.ts            # Playwright browser singleton
│   ├── desmos-renderer.ts    # Desmos API integration, rendering logic
│   └── tools/
│       ├── plot-graph.ts     # plot_graph tool (Zod schema + handler)
│       ├── load-url.ts       # load_desmos_url tool
│       └── get-expressions.ts # get_expressions tool
├── templates/
│   └── calculator.html       # HTML template with Desmos API script
├── capture-diagrams.mjs      # Standalone diagram generator utility
├── package.json
└── tsconfig.json

License

MIT