MCP Catalogs
首页

mcp-server-chart vs mcp-pointer

并排对比,帮你在这两个 MCP server 之间做选择。

mcp-server-chart
by antvis
mcp-pointer
by etsd-tech
Stars★ 4,068★ 574
30天用量10,239
综合分8450
官方
分类
AI / LLM 工具开发者工具效率工具
开发者工具浏览器自动化AI / LLM 工具
实现语言TypeScriptTypeScript
最近提交本月6 个月前

mcp-server-chart · 概述

使用 AntV 生成 26+ 种图表的 TypeScript MCP 服务器,支持多种图表类型和部署方式。

mcp-pointer · 概述

MCP Pointer 通过浏览器选择和 MCP 协议,让 AI 助手能查看和分析特定的 DOM 元素。

mcp-server-chart · 使用场景

  • 数据分析师从数据集中创建可视化报告
  • AI 助手根据用户请求生成自定义图表
  • Web 应用通过 HTTP API 嵌入可视化功能

mcp-pointer · 使用场景

  • 使用 AI 编码助手分析特定的 UI 元素
  • 调试网页开发中的 CSS 和布局问题
  • 理解 React 应用程序中的组件结构

mcp-server-chart · 安装

安装

全局安装:

npm install -g @antv/mcp-server-chart

对于桌面应用(如 Claude Desktop、VSCode):

{
  "mcpServers": {
    "mcp-server-chart": {
      "command": "npx",
      "args": ["-y", "@antv/mcp-server-chart"]
    }
  }
}

Windows 系统:

{
  "mcpServers": {
    "mcp-server-chart": {
      "command": "cmd",
      "args": ["/c", "npx", "-y", "@antv/mcp-server-chart"]
    }
  }
}

mcp-pointer · 安装

安装步骤

  1. 安装 Chrome 扩展程序:

- 从 Chrome 商店安装:[从 Chrome 商店安装](https://chromewebstore.google.com/detail/mcp-pointer/jfhgaembhafbffidedhpkmnaajdfeiok) - 或从发布版本手动安装

  1. 配置 MCP 服务器:
npx -y @mcp-pointer/server config claude  # 或 cursor、windsurf、manual
  1. 重启您的 AI 编码工具以加载 MCP 连接。

Claude Desktop 配置

添加到您的 claude_desktop_config.json 文件中:

{
  "mcpServers": {
    "mcp-pointer": {
      "command": "npx",
      "args": ["-y", "@mcp-pointer/server@latest", "start"]
    }
  }
}
对比内容由 README + GitHub 公开数据自动生成,定期更新。