# nteract/semiotic [Health: Active]

**Category:** 📊 Data Visualization  
**Repository:** https://github.com/nteract/semiotic  
**GitHub Stars:** 2705  
**Views:** 5  
**Installs:** 0  
**Upvotes:** 0  
**Directory Page:** https://allmcps.com/mcp/nteract-semiotic

## Description
React data visualization MCP server with 30+ chart types. 5 tools: suggest charts for a dataset, render validated React configs to SVG, diagnose configuration anti-patterns, get component schemas, and report issues.

## Tools
Capabilities this server exposes over MCP:

- **renderChart** — Render a Semiotic chart to static SVG. Supports the components returned by `getSchema` that are marked `[renderable]`. Pass `{ component: "LineChart", props: { data: [...], xAccessor: "x", yAccessor: "y" } }`. Returns SVG string plus a "Render evidence" JSON block (mark counts by scene type, resolv…
- **renderInteractiveChart** — Render a static-data chart as a ChatGPT Apps widget. Uses the same Semiotic server render path as `renderChart`, then hydrates an iframe UI with fit, zoom, data, hover, and render-evidence controls.
- **getSchema** — Return the prop schema for a specific component. Pass `{ component: "LineChart" }` to get its props, or omit `component` to list the complete schema-backed catalog. Components marked `[renderable]` are available through `renderChart`; realtime charts require a browser/live environment.
- **suggestChart** — Sample-row recommender. Pass `{ data: [{...}, ...] }` with 1–5 sample objects plus optional broad intent/capability filters.
- **suggestCharts** — Capability-based recommender for bounded row data. Returns ranked chart suggestions with scores, reasons, caveats, import paths, and ready-to-use props.
- **suggestStreamCharts** — Recommend realtime charts from a stream schema, throughput, and retention hints.
- **suggestDashboard** — Build a multi-panel dashboard suggestion that covers distinct analytical intents.
- **suggestStretchCharts** — Recommend audience-literacy stretch picks from an `AudienceProfile`.
- **repairChartConfig** — Check whether a requested chart fits a dataset and return ranked alternatives when it does not.
- **interrogateChart** — Return a statistical summary and chart-aware context for answering natural-language questions with optional annotations.
- **diagnoseConfig** — Check a chart configuration for common problems — empty data, bad dimensions, missing accessors, wrong data shape, and more. Returns a human-readable diagnostic report with actionable fixes.
- **reportIssue** — Generate a pre-filled GitHub issue URL for bug reports or feature requests. Pass `{ title: "...", body: "...", labels: ["bug"] }`. Returns a URL the user can open to submit.
- **applyTheme** — List named theme presets or return ThemeProvider/CSS/token usage for a preset such as `{ name: "tufte" }`.
- **auditArtifact** — Evaluate an explicit artifact contract under a named policy without inferring missing source, review, or timing facts.
- **recommendRepresentation** — Compare chart and non-chart outcomes against supplied data, claims, evidence, time state, and policy requirements.
- **repairArtifact** — Propose contract repairs and optionally fill missing identity fields; existing mismatches require a revision and claim reassessment.
- **explainRefusal** — Explain which explicit policy obligations prevent publication or action and identify safe follow-up work.

## Claude Desktop Quick Installation
Install path detected from listing signals. Uses `npx` (confidence: high):

```json
"mcpServers": {
  "semiotic": {
    "command": "npx",
    "args": ["-y","semiotic-mcp"]
  }
}
```

## Documentation

## 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:

```bash
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.

_Full upstream README: https://allmcps.com/mcp/nteract-semiotic/readme_