Mcp Server Jsxgraph

Name: Mcp Server Jsxgraph
Author: dxd214

@dxd214

关于 Mcp Server Jsxgraph

A Model Context Protocol server for generating mathematical visualizations using JSXGraph. This is a TypeScript-based MCP server that provides interactive mathematical chart generation capabilities for functions, geometry, parametric curves, and more.

#jsxgraph #mcp #mathematical-visualization #geometry #functions #parametric-curves #mathematics

基本信息

分类

其他

传输方式

stdio

发布者

dxd214

提交者

xiaodong dong

配置

使用下面的配置,将此服务器添加到你的 MCP 客户端。

{
  "mcpServers": {
    "mcp-server-jsxgraph": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-server-jsxgraph"
      ]
    }
  }
}

工具

Function Graph Tool — render single or multiple functions with JSXGraph. Use when the problem asks to plot or sketch y = f(x), compare curves, or show calculus features such as tangents, derivatives, or integrals. ⚠️⚠️⚠️ CRITICAL TYPE REQUIREMENTS ⚠️⚠️⚠️ - points[].x, points[].y, domain[], integralBounds[]: MUST be NUMBERS (no quotes) - expression: MUST be STRING (with quotes) Capabilities: - Plot one or many expressions with custom colors, labels, and domains. - Include points, tangent lines, derivative traces, and shaded integral bands. - Configure axes, bounding boxes, themes, zooming, and panning. Examples: 1. Plot a single function: { "functions": [{ "expression": "x^2" }] } 2. Function with marked points: { "functions": [{ "expression": "x^2" }], "points": [{ "x": 0, "y": 0, "name": "Vertex" }, { "x": 2, "y": 4 }] } 3. Multiple functions with custom colors: { "functions": [ { "expression": "x^2", "color": "blue", "name": "f(x)" }, { "expression": "x^3", "color": "red", "name": "g(x)" } ] } Common mistakes to AVOID: - ✗ { points: [{ x: "Math.PI", y: "0" }] } → ✓ { points: [{ x: 3.14159, y: 0 }] } - ✗ { points: [{ name: 'A' }] } → ✓ Missing x and y coordinates - ✗ { points: [{ x: 1 }] } → ✓ Missing y coordinate - ✗ { points: [{ y: 2 }] } → ✓ Missing x coordinate - ✗ { domain: ["0", "10"] } → ✓ { domain: [0, 10] } Keywords: plot function, function graph, sketch curve, calculus visualization, compare functions

Parametric Curve Tool — plot curves defined by x(t) and y(t) with JSXGraph. ⚠️⚠️⚠️ CRITICAL TYPE REQUIREMENTS ⚠️⚠️⚠️ - tMin, tMax, points[].x, points[].y: MUST be NUMBERS (no quotes) - xExpression, yExpression: MUST be STRINGS (with quotes) Use when the prompt describes parameterized motion, circles, cycloids, Lissajous patterns, or any curve specified as functions of t. Capabilities: - Draw one or multiple parametric curves with custom domains and styling. - Enable animated tracing to illustrate movement along the path. - Overlay reference points and adjust axes, bounding boxes, and themes. Examples: 1. Circle (unit circle): { "curves": [{ "xExpression": "Math.cos(t)", "yExpression": "Math.sin(t)", "tMin": 0, "tMax": 6.283185307179586 }] } 2. Parabola in parametric form: { "curves": [{ "xExpression": "t", "yExpression": "t^2", "tMin": -5, "tMax": 5 }] } 3. Curve with points (x = 5sin(t), 0 ≤ t ≤ π/6): { "curves": [{ "xExpression": "5 * Math.sin(t)", "yExpression": "t", "tMin": 0, "tMax": 0.5236 }], "points": [{ "x": 0, "y": 0 }, { "x": 2.5, "y": 0.5236 }] } Common mistakes to AVOID: - ✗ { tMax: "Math.PI/6" } → ✓ { tMax: 0.5236 } - ✗ { tMax: "2*Math.PI" } → ✓ { tMax: 6.2832 } - ✗ { tMin: "0" } → ✓ { tMin: 0 } - ✗ { points: [{x: "2.5", y: "0.5236"}] } → ✓ { points: [{x: 2.5, y: 0.5236}] } Keywords: parametric plot, x of t, y of t, motion path, curve animation

Generate interactive geometry diagrams using JSXGraph. Create points, lines, circles, polygons, angles, and geometric constructions. Perfect for visualizing geometric concepts, theorems, and constructions like triangles, perpendiculars, angle bisectors, etc.

Generate vector field visualizations using JSXGraph. Display 2D vector fields with arrows showing direction and magnitude at each point. Supports streamlines, singular points, and color-coded magnitudes. Ideal for visualizing gradient fields, flow fields, electromagnetic fields, etc. ⚠️⚠️⚠️ CRITICAL TYPE REQUIREMENTS ⚠️⚠️⚠️ - fieldFunction.dx, fieldFunction.dy: MUST be STRINGS (with quotes), even for constants like '1' or '0' - startX, startY: MUST be NUMBERS (no quotes) Examples: 1. Circular vector field F(x,y) = (-y, x): { "fieldFunction": { "dx": "-y", "dy": "x" } } 2. Direction field for y' = 9 + 9y: { "fieldFunction": { "dx": "1", "dy": "9 + 9*y" }, "streamlines": [{ "startX": 0, "startY": -1 }, { "startX": 0, "startY": 0 }] } 3. Radial field F(x,y) = (x, y): { "fieldFunction": { "dx": "x", "dy": "y" } } 4. Gradient field ∇f where f(x,y) = x² + y²: { "fieldFunction": { "dx": "2*x", "dy": "2*y" } } Common mistakes to AVOID: - ✗ { fieldFunction: { dx: 1, dy: "9 + 9*y" } } → ✓ { fieldFunction: { "dx": "1", "dy": "9 + 9*y" } } - ✗ { fieldFunction: "x^2 + y^2" } → ✓ { fieldFunction: { "dx": "2*x", "dy": "2*y" } } - ✗ { streamlines: true } → ✓ { streamlines: [{ startX: 0, startY: 0 }] } or omit - ✗ Missing fieldFunction → ✓ Always include fieldFunction

Linear System Tool — graph linear equations and inequalities using JSXGraph. Use when the prompt asks to solve or visualise systems of linear equations, highlight intersection points, or show feasible regions for inequalities/objectives. Capabilities: - Plot multiple lines defined in ax + by = c form with automatic intersection markers. - Shade inequality regions, overlay objective functions, and mark optimal points. - Add auxiliary points and configure axes, bounds, and styling. Quick start example: { "equations": [{ "a": 1, "b": 1, "c": 5 }, { "a": 1, "b": -1, "c": 1 }] } Keywords: linear system, intersection graph, inequality shading, objective line, simultaneous equations

Function Transformation Tool — illustrate how a base function changes under common operations. Use when the question mentions translations, stretches, reflections, absolute values, inverses, or composite functions based on an original curve. Capabilities: - Render a base function alongside any number of transformed variants. - Support translation, scaling, reflection, absolute value, inverse, and composition scenarios. - Highlight key points, vectors, animations, and comparison layouts. IMPORTANT: transformation 'type' MUST be one of: 'translate', 'scale', 'reflect', 'absolute', 'inverse', 'composite'. Examples: 1. Horizontal shift (translation): { "baseFunction": { "expression": "x^2" }, "transformations": [{ "type": "translate", "parameters": { "h": 2, "k": 1 } }] } 2. Vertical stretch (scaling): { "baseFunction": { "expression": "Math.sin(x)" }, "transformations": [{ "type": "scale", "parameters": { "a": 2 } }] } 3. Horizontal compression: { "baseFunction": { "expression": "x^2" }, "transformations": [{ "type": "scale", "parameters": { "b": 2 } }] } 4. Reflection across x-axis: { "baseFunction": { "expression": "x^2" }, "transformations": [{ "type": "reflect", "parameters": { "axis": "x" } }] } 5. Multiple transformations: { "baseFunction": { "expression": "x^2" }, "transformations": [ { "type": "translate", "parameters": { "h": 1 } }, { "type": "scale", "parameters": { "a": 2 } } ] } Common mistakes: - ✗ { type: 'stretch' } → ✓ { type: 'scale' } - ✗ { type: 'verticalStretch' } → ✓ { type: 'scale', parameters: { a: 2 } } - ✗ { type: 'horizontalStretch' } → ✓ { type: 'scale', parameters: { b: 0.5 } } - ✗ { type: 'shift' } → ✓ { type: 'translate' } - ✗ { type: 'move' } → ✓ { type: 'translate' } Keywords: transform function, translate graph, stretch function, reflect curve, composition

Quadratic Analysis Tool — visualize parabolas and their key features using JSXGraph. Use when the prompt asks to analyse or sketch quadratic functions, compare parabolas, or explain vertex, intercepts, symmetry, or discriminant behavior. Capabilities: - Plot one or more quadratic functions with optional styling. - Highlight vertices, intercepts, axis of symmetry, focus/directrix, and discriminant notes. - Display vertex or factorized forms, tangent lines, shaded regions, and comparison layouts. Quick start example: { "quadratics": [{ "a": 1, "b": 0, "c": 0 }] } Keywords: quadratic graph, parabola analysis, vertex form, factor form, compare parabolas

Exponential and Logarithmic Tool — plot growth, decay, and log curves with JSXGraph. Use when the problem references exponential or logarithmic expressions, asymptotes, inverse relationships, or needs comparisons between bases. Capabilities: - Plot exponential or logarithmic functions, optionally mixing multiple curves. - Display asymptotes, intercepts, inverse reflections, and logarithmic scales. - Highlight comparison points, tangent lines, and growth or decay analysis blocks. IMPORTANT: - type: MUST be 'exponential' or 'logarithm' (NOT 'logarithmic', 'exp', 'log') - base: MUST be a NUMBER like 2, 10, or 2.718281828459045 (NOT string 'e' or 'E') - For natural log (ln), use type: 'logarithm' and omit base (defaults to e) - For natural exponential (e^x), use type: 'exponential' and omit base Examples: 1. Natural logarithm y = ln(x): { "functions": [{ "type": "logarithm" }] } 2. Common logarithm y = log₁₀(x): { "functions": [{ "type": "logarithm", "base": 10 }] } 3. Exponential growth y = 2^x: { "functions": [{ "type": "exponential", "base": 2 }] } 4. Natural exponential y = e^x: { "functions": [{ "type": "exponential" }] } 5. Exponential decay y = (0.5)^x: { "functions": [{ "type": "exponential", "base": 0.5 }] } 6. Compare ln(x) with log₂(x): { "functions": [ { "type": "logarithm", "name": "ln(x)", "color": "blue" }, { "type": "logarithm", "base": 2, "name": "log₂(x)", "color": "red" } ] } 7. Logarithm with special points and asymptote: { "functions": [{ "type": "logarithm", "base": 10 }], "showAsymptotes": true, "specialPoints": [{ "x": 1, "y": 0, "label": "(1, 0)" }, { "x": 10, "y": 1, "label": "(10, 1)" }] } Common mistakes to avoid: - ✗ { type: 'logarithmic' } → ✓ { type: 'logarithm' } - ✗ { base: 'e' } → ✓ { base: 2.718281828459045 } or omit base - ✗ { base: 'E' } → ✓ omit base (defaults to e) - ✗ { expression: 'ln(x)' } → ✓ { type: 'logarithm' } (simpler) Keywords: exponential graph, logarithmic curve, growth rate, decay model, inverse functions

Generate rational and irrational function visualizations using JSXGraph. Plot rational functions with asymptotes (vertical, horizontal, oblique), holes, intercepts, and critical points. Visualize irrational functions with domain restrictions. Supports factorization, partial fractions, and end behavior analysis. ⚠️⚠️⚠️ CRITICAL TYPE REQUIREMENTS ⚠️⚠️⚠️ - numerator, denominator: MUST be STRINGS (with quotes), even for constants like '1' or '0' - expression: MUST be STRING (with quotes) Examples: 1. Simple rational function f(x) = 1/x: { "rationalFunctions": [{ "numerator": "1", "denominator": "x" }] } 2. Rational function f(x) = (x² - 1)/(x - 2): { "rationalFunctions": [{ "numerator": "x^2 - 1", "denominator": "x - 2" }] } 3. Multiple rational functions: { "rationalFunctions": [ { "numerator": "x + 1", "denominator": "x^2 - 4", "color": "blue" }, { "numerator": "x^2", "denominator": "x - 1", "color": "red" } ] } 4. Irrational function f(x) = √x: { "irrationalFunctions": [{ "expression": "Math.sqrt(x)", "domain": [0, 10] }] } Common mistakes to AVOID: - ✗ { "numerator": 1, "denominator": "x" } → ✓ { "numerator": "1", "denominator": "x" } - ✗ { "numerator": 0 } → ✓ { "numerator": "0", "denominator": "1" } - ✗ { numerator: 2*x } → ✓ { "numerator": "2*x", "denominator": "1" } - ✗ { numerator: x } → ✓ { "numerator": "x", "denominator": "1" }

Generate systems of equations visualization using JSXGraph. Solve and visualize linear and nonlinear equation systems, find intersection points, show solution sets, and analyze system properties. Supports implicit equations, parametric systems, numerical solutions, and advanced analysis including matrix representation and phase portraits.

Generate conic sections and high-degree polynomials using JSXGraph. Visualize circles, ellipses, parabolas, hyperbolas with their foci, directrices, vertices, and asymptotes. Plot polynomials with roots, critical points, and inflection points. Supports general conic equations, rotated conics, and intersection analysis. IMPORTANT: Each conic in the 'conics' array MUST have a 'type' field. Examples: 1. Circle with radius 5: { "conics": [{ "type": "circle", "center": { "x": 0, "y": 0 }, "radius": 5 }] } 2. Parabola y² = 4px: { "conics": [{ "type": "parabola", "vertex": { "x": 0, "y": 0 }, "p": 1 }] } 3. Ellipse with semi-axes a=4, b=2: { "conics": [{ "type": "ellipse", "center": { "x": 0, "y": 0 }, "a": 4, "b": 2 }] } 4. Hyperbola: { "conics": [{ "type": "hyperbola", "center": { "x": 0, "y": 0 }, "a": 3, "b": 2 }] } 5. General conic Ax² + Bxy + Cy² + Dx + Ey + F = 0: { "generalConics": [{ "A": 1, "B": 0, "C": 1, "D": 0, "E": 0, "F": -25 }] } Common mistakes: - ✗ { conics: [{ radius: 5 }] } → ✓ Missing 'type' field - ✗ { type: 'circular' } → ✓ Use 'circle' - ✗ { type: 'para' } → ✓ Use 'parabola'

Number Line Inequality Tool — illustrate solution sets on a one-dimensional axis with JSXGraph. Use when the task asks to plot inequality solutions, show interval notation, or visualise unions/intersections on a number line. Capabilities: - Display one or many inequalities with open or closed endpoints and custom styling. - Adjust tick spacing, numeric labels, and the vertical placement of the line. - Combine multiple segments to showcase compound inequalities or piecewise regions. IMPORTANT: Each inequality MUST have an 'expression' field (string). DO NOT use 'start/end' or 'includeStart/End' fields. Examples: 1. Single inequality (x ≤ 3): { "inequalities": [{ "expression": "x <= 3" }] } 2. Union of intervals (x ≤ 3 or 4 ≤ x ≤ 5): { "inequalities": [ { "expression": "x <= 3", "color": "blue" }, { "expression": "4 <= x <= 5", "color": "blue" } ] } 3. Compound inequality with custom range: { "inequalities": [{ "expression": "-2 < x < 3" }], "boundingBox": [-5, 1, 5, -1] } 4. Multiple separate regions: { "inequalities": [ { "expression": "x < -1", "color": "red" }, { "expression": "2 <= x <= 4", "color": "green" }, { "expression": "x > 6", "color": "blue" } ] } Expression format guide: - 'x > 2' → (2, ∞) open endpoint at 2 - 'x >= 2' → [2, ∞) closed endpoint at 2 - 'x <= 3' → (-∞, 3] closed endpoint at 3 - '2 < x < 5' → (2, 5) both open - '2 <= x <= 5' → [2, 5] both closed - '2 <= x < 5' → [2, 5) left closed, right open Keywords: number line, inequality graph, interval notation, solution set, one dimensional plot

Generate economic competition market analysis charts including MC (Marginal Cost), AC (Average Cost), AVC (Average Variable Cost) curves, price line, and profit/loss areas. Ideal for perfect competition market analysis.

Generate structural engineering shear force and bending moment diagrams. Displays beam with loads, support reactions, and resulting force diagrams. All calculations should be done externally - this tool only visualizes the results.

Generate economics isoquant and isocost analysis charts. Displays isoquant curves (equal output), isocost lines (equal cost), and optimal production points. Ideal for production theory and cost minimization analysis. IMPORTANT: 'isoquants' is a REQUIRED field. Each isoquant MUST have 'Q' and 'points' properties. Examples: 1. Basic isoquant analysis: { "isoquants": [ { "Q": 100, "points": [[1, 4], [2, 2], [4, 1]] } ] } 2. Multiple isoquants with isocost: { "isoquants": [ { "Q": 100, "points": [[1, 4], [2, 2], [4, 1]] }, { "Q": 200, "points": [[2, 8], [4, 4], [8, 2]] } ], "isocosts": [{ "C": 100, "slope": -1 }] } 3. With optimal point: { "isoquants": [{ "Q": 100, "points": [[1, 4], [2, 2], [4, 1]] }], "optimum": { "K": 2, "L": 2 } } Common mistakes: - ✗ { isoquants: [{ Q: 100 }] } → ✓ Missing 'points' array - ✗ { isoquants: [{ points: [[1,2]] }] } → ✓ Missing 'Q' value - ✗ { isoquants: [] } → ✓ Array cannot be empty, must have at least one isoquant - ✓ { isoquants: [{ Q: 100, points: [[1,4], [2,2]] }] } → Correct

Normal Distribution Tool — visualize probability density curves with JSXGraph. Use when the prompt references a normal distribution, z-scores, shaded probability intervals, or hypothesis-testing thresholds. Capabilities: - Render the bell curve with configurable mean, standard deviation, and plotting range. - Shade intervals, annotate standard scores, and display probability labels. - Customize labels, styles, and auxiliary axes for teaching or analysis. Quick start example: { } // produces N(0, 1) with default settings Keywords: normal curve, bell curve, z score, probability shading, statistics

Generate function transformation sequence visualizations. Shows how a base function is transformed through a series of translations, scalings, and reflections. Ideal for teaching transformation concepts.

Generate geometric logo designs using conic sections, polygons, and curves. Combines multiple geometric shapes with customizable styles to create logos and emblems.

Linear Feasible Region Tool — visualise constraint systems and objectives with JSXGraph. Use when the prompt involves linear programming, feasible regions, constraint sets, or identifying optimal points for an objective. Capabilities: - Plot constraint lines and shade the feasible polygon. - Highlight vertices, objective direction, and best point when an objective is supplied. - Configure domain bounds, labels, and styling for instructional diagrams. Quick start example: { "constraints": [{ "a": 1, "b": 1, "c": 10 }, { "a": 1, "b": 0, "c": 0, "type": ">=" }] } Keywords: feasible region, linear programming, constraint graph, objective optimization, LP diagram

概览

What is Mcp Server Jsxgraph?

Mcp Server Jsxgraph is a Model Context Protocol server for generating interactive mathematical visualizations using JSXGraph. It provides 12 mathematical chart generation tools for functions, geometry, parametric curves, and educational mathematics.

How to use Mcp Server Jsxgraph?

Install via npm globally (npm install -g mcp-server-jsxgraph) or use npx with desktop MCP clients like Claude, VSCode, or Cline. Configure the MCP client with a stdio transport command, or run the server independently with --transport sse or --transport streamable for HTTP-based access. Use the DISABLED_TOOLS environment variable to disable specific visualization tools.