Semiotic

What the nteract/semiotic MCP server does

The nteract/semiotic MCP server connects an MCP client to Semiotic, a React data-visualization library. It gives an agent structured ways to select chart types, inspect component props, validate configurations, and render supported charts. The available catalog covers chart families including XY, ordinal, network, realtime, geographic, value, and portable recipe surfaces, subject to the schemas exposed by the server.

The server is suited to workflows where an AI assistant needs more than a code example. It can use representative rows to recommend a chart, compare suggestions against analytical intent, identify configuration problems, and return props that can be used in generated React code. It also supports dashboard recommendations, audience-oriented chart choices, and recommendations for realtime visualizations based on stream characteristics.

How it works

Chart configuration inputs use JSON objects containing a component name and props. For example, a render request can identify LineChart and provide data together with xAccessor and yAccessor. The rendering path produces static SVG for components marked as renderable in the schema. The result also includes render evidence, such as counts by scene type, so an agent can inspect what was produced.

renderInteractiveChart follows the same server-side rendering path for static data, then supplies a ChatGPT Apps widget with controls for fitting, zooming, data inspection, hover behavior, and render evidence. Realtime components are schema-visible, but their live browser environment is not provided by the static renderer.

Recommendation and inspection tools operate at different levels. suggestChart samples one to five rows, while suggestCharts works with bounded row data and returns ranked options, explanations, caveats, import paths, and props. interrogateChart adds statistical summaries and chart-aware context for natural-language questions, with optional annotations. repairChartConfig checks whether a requested chart fits its data and proposes alternatives when it does not.

Setup and configuration

The repository documents the MCP server command as:

npx -y semiotic-mcp

Run it through an MCP client that supports local stdio servers. The provided material does not specify required environment variables, API credentials, client-specific configuration files, or a hosted endpoint. Semiotic is described as usable with MCP clients generally, while the supplied material does not identify particular client configuration examples.

Tools and capabilities

The nteract/semiotic MCP server provides tools for:

• Rendering supported Semiotic components to SVG or to an interactive static-data widget.
• Listing the complete schema catalog or retrieving a component's prop schema.
• Recommending charts, dashboards, stretch choices, and realtime charts.
• Diagnosing missing accessors, empty data, invalid dimensions, incorrect data shapes, and related configuration issues.
• Repairing unsuitable chart configurations with ranked alternatives.
• Returning statistical summaries and chart-aware answers for chart questions.
• Listing theme presets or returning usage information for a selected preset.
• Generating a prefilled GitHub issue URL from a title, body, and labels.

Limitations and notes

Only schema components marked [renderable] are available through static SVG rendering. Realtime charts require a browser or live runtime, so schema availability does not imply that they can be rendered by the static path. The material also describes Semiotic's accessibility infrastructure, but application owners remain responsible for their own product scope, surrounding controls, assistive-technology testing, and legal compliance.

The issue-reporting tool returns a URL for the user to open; it does not submit the issue automatically. Rendering and recommendation results should therefore be treated as generated configuration and evidence for the client workflow, not as a replacement for reviewing the resulting chart in the target application.