AntV mcp-server-chart Alternative: Charts From Your Real Query Data

AntV’s mcp-server-chart is a standalone MCP server with 25+ chart types. The agent passes it data and a chart config, and it returns a rendered chart. It is a good fit when the agent already has the numbers and wants a picture.

@bonnard/mcp-charts solves a different problem. You add one visualize tool to your own MCP server. The agent writes SQL, your database returns the rows, and the chart renders from those real results, as an interactive widget inside the agent. The data the chart shows is the data your query returned, not data the model typed into a tool call.

At a glance

	AntV mcp-server-chart	@bonnard/mcp-charts
Primary job	Generate a chart from data the agent supplies	Add charting to your own MCP server, from your query results
Data source	The agent passes the data in the tool call	Your runSql callback returns rows from your database
Where it runs	A separate MCP server the agent connects to	A few lines inside your existing MCP server
Output	A rendered chart (image)	An interactive widget (MCP Apps), with a text fallback
Chart types	25+ (incl. radar, fishbone, flow, maps)	8 core types + variants (stacked, grouped, 100%, horizontal, combo, dual-axis, bubble, reference lines)
Grounded in real data	The agent provides the values	The chart renders exactly the rows your query returned
Frontend work	None	None
Warehouse adapters	Bring your own data	Bundled for BigQuery, Postgres, Snowflake, Databricks, DuckDB
Clients	Claude, Cursor, VS Code, and others	Claude, ChatGPT, and other MCP Apps clients
License	MIT	MIT

The core difference: where the data comes from

With mcp-server-chart, the agent is the data source. It decides what numbers go into the chart and passes them in the tool call. That is exactly what you want when the agent already holds the data and needs a visual of it.

Bonnard puts your query between the agent and the chart:

import { addCharts } from "@bonnard/mcp-charts";

addCharts(server, {
  runSql: async (sql) => ({ rows: await db.query(sql) }),
  discovery: { toolName: "explore_schema" },
});

The agent calls visualize with SQL. Your database runs it and returns rows. The chart renders those rows. The model never hand-types the values, so the chart can’t drift from the data. Run runSql through a read-only role and the agent’s SQL stays scoped to what you allow.

Interactive widget, not a static image

mcp-server-chart returns a generated chart. Bonnard renders an interactive widget through the MCP Apps standard: tooltips, legends, and axis formatting, native to the client. The same widget works across Claude, ChatGPT, and other MCP Apps hosts, so you don’t maintain per-client rendering.

Bundled warehouse adapters

Point Bonnard at your warehouse and it maps native column types to chart roles (dimension, measure, time) for you:

import { postgresRunSql } from "@bonnard/mcp-charts/postgres";
addCharts(server, { runSql: postgresRunSql(pool) });

Adapters ship for BigQuery, Postgres, Snowflake, Databricks, and DuckDB. See the docs.

When to use AntV mcp-server-chart

Reach for mcp-server-chart when:

• The agent already has the data and you want a chart of it
• You need chart types Bonnard doesn’t cover (radar, fishbone, flow diagrams, maps)
• You want one shared chart server that any client can call, independent of your data

Reach for @bonnard/mcp-charts when the chart should come from your own query results, render as an interactive widget inside the agent, and add to a server you already run.

Getting started

npm install @bonnard/mcp-charts

import { addCharts } from "@bonnard/mcp-charts";
addCharts(server, { runSql: async (sql) => ({ rows: await db.query(sql) }) });

Read the documentation or the source on GitHub.

FAQ

Is @bonnard/mcp-charts a standalone MCP server like mcp-server-chart?

No. It is a package you add to your own MCP server with addCharts(server, { runSql }). mcp-server-chart is a separate server the agent connects to and feeds data.

Does the agent pass the chart data?

No. The agent writes SQL. Your runSql callback runs it and returns the rows, and the chart renders those. The model doesn’t supply the values, so the chart matches your data.

How many chart types does Bonnard support?

Eight core types (bar, line, area, pie, scatter, funnel, waterfall, table) plus variants: stacked, grouped, 100% stacked, horizontal, combo, dual-axis, bubble, and reference lines. mcp-server-chart covers a wider catalog, including diagram types Bonnard does not.

Does it work in ChatGPT?

Yes. The widget uses the MCP Apps standard, so it renders in Claude, ChatGPT, and other MCP Apps clients.

Does Bonnard connect to my database?

No. You own the connection. Bonnard calls your runSql callback; run it through a read-only role. See Security.