npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

mathgraphs-mcp

v2.2.0

Published

MCP server for interactive math graphing, 3D scene building, and presentations

Readme

mathgraphs-mcp

MCP server for interactive math graphing, 3D scene building, and presentations.

MathTalking computes and renders interactive visualizations. Plot 2D functions, geometry, and 3D scenes. Results are graph-verified — roots, extrema, and intersections are computed from actual plotted curves, not generated by AI.

Zero install. Browser-native. Every result is a shareable interactive URL.

Quick Start

Claude Desktop

Settings → Connectors → Add custom connector → paste:

https://mathtalking.com/api/mcp

No account or API key needed.

Claude Code

claude mcp add --transport http mathtalking https://mathtalking.com/api/mcp

Any MCP Client

POST https://mathtalking.com/api/mcp
Content-Type: application/json

Standard JSON-RPC 2.0 over Streamable HTTP.

Tools

plot_graph — 2D Math Visualization

Plot functions, points, segments, labels, and shapes on an interactive graph. Auto-computes roots, extrema, and intersections for plotted functions.

Input: Array of elements, each with a type and type-specific fields:

| Type | Fields | Example | |---|---|---| | function | expression (required), color | {"type":"function", "expression":"x^2-4", "color":"#4A90D9"} | | points | points [{x,y}] (required), color, label | {"type":"points", "points":[{"x":2,"y":0}], "label":"root"} | | segment | x1,y1,x2,y2 (required), color, label, arrow, dashed | {"type":"segment", "x1":0, "y1":0, "x2":3, "y2":4, "label":"hypotenuse"} | | label | text (required), x,y (required), color, fontSize | {"type":"label", "text":"vertex", "x":0, "y":-4} | | triangle | x1,y1,x2,y2,x3,y3 (required), color, opacity, border | {"type":"triangle", "x1":0, "y1":0, "x2":3, "y2":0, "x3":3, "y3":4} | | box | x1,y1,x2,y2 (required), height (required), color, opacity | {"type":"box", "x1":0, "y1":0, "x2":1, "y2":0, "height":5} | | circle | cx,cy,radius (required), color, opacity, border | {"type":"circle", "cx":0, "cy":0, "radius":3} |

Supports: Explicit y=f(x), implicit x²+y²=1, parametric (cos(t),sin(t)), polar, piecewise, domain restrictions.

Optional params:

  • viewport{xmin, xmax, ymin, ymax} to set coordinate range
  • title — graph title
  • summary — frosted glass overlay text on the graph
  • gridStyle"polar" (concentric circles + radial lines), "axes" (axes only), "none" (clean canvas)
  • output"url" (default, interactive page), "embed" (iframe URL), or "svg" (vector image)
  • animations — array of {tool, name, from, to, loop} for animated parameters
  • theme"default", "terminal", "wallstreet", "science", or "finance"

Returns: Interactive URL with zoom, pan, and sliders. Auto-computed roots, extrema, and intersections in the response text.

plot_3d — 3D Scene Builder

Create interactive 3D scenes with shapes, lights, and particle effects. Build anything — snowmen, castles, robots, geometry.

Input: Array of elements, each with a type and type-specific fields:

| Type | Fields | Example | |---|---|---| | mesh | shape (required), color, opacity, position, rotation, metalness, roughness, wireframe | {"type":"mesh", "shape":"sphere", "r":1, "metalness":0.8, "position":[0,1,0]} | | compound | compound (required), position, scale, color | {"type":"compound", "compound":"house", "color":"#cc2222", "position":[0,0,0]} | | surface | expression (required), color, xmin, xmax, ymin, ymax, resolution | {"type":"surface", "expression":"sin(x)*cos(y)", "color":"#4A90D9"} | | light | kind (point/spot/directional), color, intensity, position | {"type":"light", "kind":"point", "color":"#ff8800", "position":[0,5,0]} | | particle | preset (fire/smoke/rain/snow/sparkle/mist/splash), position, count, spread | {"type":"particle", "preset":"fire", "position":[3,0,0]} | | water | position, size, waveHeight, color, opacity | {"type":"water", "position":[0,0,0], "size":10} | | line3d | from [x,y,z], to [x,y,z], color | {"type":"line3d", "from":[0,0,0], "to":[1,1,1]} | | label3d | text, position [x,y,z] | {"type":"label3d", "text":"origin", "position":[0,0,0]} | | text3d | text, position [x,y,z], color, fontSize | {"type":"text3d", "text":"HELLO", "position":[0,2,0], "color":"#ff0000", "fontSize":1} |

11 mesh shapes: cube, box, sphere, cylinder, cone, tetrahedron, octahedron, dodecahedron, icosahedron, torus, prism

36 compound presets: tree, house, castle_tower, fence, campfire, rock, stairs, arch, table, chair, person, car, road_sign, windmill, dog, cat, flag, bed, sofa, bookshelf, lamp, desk, bush, flower, bridge, lamp_post, bench, apartment, skyscraper, shopping_center, hospital, ambulance, truck, boat, traffic_light, water_tower, fountain

Color-driven building styles: Buildings change architectural style based on color — red=Chinese, blue=modern, yellow=cozy, green=eco, brown=rustic. The actual hex color is used for materials; the hue just selects the geometry variant.

Shape params: cube→size, box→width/height/depth, sphere→r, cylinder→r/h, cone→r/h, torus→r/tube, prism→points/h

Material params: metalness (0=plastic, 1=chrome), roughness (0=mirror, 1=matte), wireframe (boolean)

Animation: animate: {type, speed, ...} — spin, bounce, orbit, waypoint, follow (tracks player)

Physics & controls: physics: {velocity, mass}, controls: {type:"wasd", speed}, collision: true

Incremental building:

  • base_render_id — build on an existing scene (appends elements, creates new URL)
  • remove_indices — remove elements by index from base (use get_3d to see indices)

Optional: title, summary, camera {position, target}, skybox (day/sunset/night/overcast), gravity (-9.8), follow (boolean)

Returns: Interactive 3D URL with orbit controls + inline PNG thumbnail for chat preview.

get_3d — Inspect 3D Scene

Retrieve the full element list of an existing 3D render by ID. Use this before base_render_id to see what a scene contains and plan modifications.

Input: render_id (the short alphanumeric ID from the URL)

Returns: All elements with their properties (shapes, positions, colors, materials).

create_show — Slideshow Presentations

Bundle multiple plot_graph results into a slideshow. Create each slide with plot_graph first, then pass the render IDs here.

Input: title (string), slide_ids (array of render IDs from plot_graph results), summary (optional per-slide text).

Returns: Interactive show URL with prev/next navigation, keyboard controls, and auto-play.

Example Prompts

  1. "Plot x³ - 3x + 1 and show me its roots and extrema" → Interactive graph with computed roots (x ≈ -1.88, 0.35, 1.53) and extrema
  2. "Build a village with a red house, trees, and a campfire" → 3D scene with Chinese-style house (red color triggers Chinese variant), PNG thumbnail in chat
  3. "Plot the surface z = sin(x) * cos(y)" → Interactive 3D surface plot with orbit controls
  4. "Create a 3-slide show: y=x², y=x²+2 shifted up, y=(x-3)² shifted right" → Slideshow URL with navigation

When to Use

  • User asks to graph, plot, or visualize any math
  • You need to verify a mathematical result visually
  • Geometry needs precise rendering (triangles, circles, constructions)
  • 3D scenes — shapes, architecture, creative builds
  • Multi-step explanations — create slides, bundle into shows
  • You want a shareable URL the user can explore interactively

Why Use This (vs generating images)

  • Computed, not hallucinated — roots from actual zero-crossings, not LLM guesses
  • Interactive — zoom, pan, rotate (3D), adjust sliders
  • Shareable — permanent URL for every result
  • Token efficient — ~500 output tokens vs ~3,000-5,000 for generated code
  • 9 languages — en, zh, zh-TW, ja, ko, es, fr, de, pt-BR

Quick Test

# 2D graph
curl -X POST https://mathtalking.com/api/mcp \
  -H 'Content-Type: application/json' \
  -d '{"jsonrpc":"2.0","id":1,"method":"tools/call","params":{"name":"plot_graph","arguments":{"elements":[{"type":"function","expression":"sin(x)","color":"#4A90D9"}]}}}'

# 3D scene
curl -X POST https://mathtalking.com/api/mcp \
  -H 'Content-Type: application/json' \
  -d '{"jsonrpc":"2.0","id":1,"method":"tools/call","params":{"name":"plot_3d","arguments":{"elements":[{"type":"mesh","shape":"sphere","r":1,"color":"#ff0000","position":[0,1,0]}]}}}'

Links