Skip to main content
Glama
deenesjakoruzh
Figsh

provchart-mcp

by Figsh
OverviewSchemaRelated ServersScoreDiscussions
JavaScript
Remote

provchart-mcp

面向 ProvChart 的 MCP 服务器 — 智能体可生成纯 CSS 图表（HTML + CSS）或 SVG，用于 README/文档。

无需 Chart.js。绘制时无需客户端图表运行时。与你的仪表盘使用的 JSON 相同。

npm

provchart-mcp（就绪后发布）

API

chart.devtem.org/docs

Keys

Dashboard → Developer API

License

MIT

功能

工具

输出

provchart_generate

用于网页的 HTML + CSS

provchart_generate_svg

用于 Markdown / 文档的 SVG（+ data URI）

provchart_explain

简短的注入 / SVG / 运行时 / 错误说明（不调用 API）

智能体调用这些工具，而不是自行编写 Chart.js 代码片段。

Related MCP server: ECharts ChartPage MCP Server

环境要求

  • Node.js 18+（原生 fetch）

  • ProvChart API 密钥 — 免费注册账户包含每月有限的测试生成额度

export PROVCHART_API_KEY=pc_live_xxxxxxxx

切勿提交真实密钥。建议使用环境变量 / MCP env 配置。

安装与运行

从源码运行（本仓库）

cd provchart-mcp
npm install
export PROVCHART_API_KEY=pc_live_xxxxxxxx
node src/index.js

该进程通过 stdio 使用 MCP 协议（在客户端连接之前保持静默）。

发布后

npx -y provchart-mcp

Claude Desktop

编辑 claude_desktop_config.json：

{
  "mcpServers": {
    "provchart": {
      "command": "node",
      "args": ["/absolute/path/to/provchart-mcp/src/index.js"],
      "env": {
        "PROVCHART_API_KEY": "pc_live_xxxxxxxx"
      }
    }
  }
}

或使用 npx（发布后）：

{
  "mcpServers": {
    "provchart": {
      "command": "npx",
      "args": ["-y", "provchart-mcp"],
      "env": {
        "PROVCHART_API_KEY": "pc_live_xxxxxxxx"
      }
    }
  }
}

保存后重启 Claude Desktop。

Cursor

mcp.json（项目级或全局）：

{
  "mcpServers": {
    "provchart": {
      "command": "node",
      "args": ["/absolute/path/to/provchart-mcp/src/index.js"],
      "env": {
        "PROVCHART_API_KEY": "pc_live_xxxxxxxx"
      }
    }
  }
}

示例提示词

  • 使用 provchart_generate 生成午夜主题面积图：流量 vs 注册量，周一至周日。

  • 为 GitHub README 生成 p50/p95 延迟的 SVG 折线图。

  • 说明如何在不使用图表库的情况下注入 ProvChart HTML/CSS。

工具参数示例（provchart_generate）

{
  "type": "area",
  "theme": "midnight",
  "series": [
    { "name": "Traffic", "color": "#4fd8c4", "points": [30, 45, 40, 60, 55, 70, 65] },
    { "name": "Signups", "color": "#f0a860", "points": [8, 12, 11, 18, 16, 22, 20] }
  ],
  "axisX": ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
}

将返回的 CSS 注入 <style> 标签，将 HTML 注入容器。可选：provchart-runtime 用于提示框 — 绘制时非必需。

环境变量

变量

是否必需

说明

PROVCHART_API_KEY

是*

API 密钥（X-API-Key）

PROVCHART_API_BASE

否

默认 https://provchart-api.devtem.org

*也可以在工具参数中传入 apiKey（推荐使用环境变量）。

错误

代码 / 消息

含义

缺少 API 密钥

请设置 PROVCHART_API_KEY

INVALID_API_KEY

密钥无效或已被吊销

MONTHLY_LIMIT_REACHED

配额已用尽（HTML 与 SVG 共享额度池）

SUBSCRIPTION_REQUIRED

当前套餐不包含此功能

项目结构

provchart-mcp/
  package.json
  README.md
  src/
    index.js    # MCP stdio server
    client.js   # ProvChart HTTP helper
    tools.js    # Tool schemas + handlers

相关链接

This server cannot be installed

RayrunBuild, deploy, and operate MCP servers without becoming an infrastructure team.ray.runAd
A
license - permissive license
Not graded
quality - not tested
B
maintenance

How are these scores calculated?

Maintenance

–Maintainers
–Response time
–Release cycle
–Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Related MCP Servers

View all related MCP servers

Related MCP Connectors

  • netcafe-images

    Diagrams, badges, charts and QR codes as plain image URLs you can paste into Markdown.

  • ChartPane

    Renders interactive Chart.js charts and dashboards inline in AI conversations.

  • hustcc-mcp-mermaid

    Generate dynamic Mermaid diagrams and charts with AI assistance. Customize styles and export diagr…

View all MCP Connectors

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/Figsh/provchart-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server