MCP-painter

基本能力

产品定位

MCP-painter是一个基于MCP协议的绘图工具示例项目，主要用于测试和学习MCP协议的使用。

核心功能

• 画笔工具：支持设置画笔线宽和颜色
• 绘图结果获取：支持以PNG格式获取当前画布图像
• 实时可视化：通过WebSocket实现服务端和前端之间的实时通信
• API接口：提供多种绘图相关的API接口

适用场景

• MCP协议的学习和测试
• 绘图工具的开发示例
• 实时绘图应用的开发

工具列表

1. 画笔工具：支持设置线宽和颜色
2. 橡皮擦工具：支持设置线宽
3. 画布操作工具：支持清空画布、设置画布尺寸等
4. 图像获取工具：支持获取PNG格式的画布图像

常见问题解答

无

使用教程

使用依赖

需要安装Node.js和npm

安装教程

1. 克隆项目
2. 安装依赖

cd whiteBoard
npm install

1. 运行开发服务器

npm run dev

1. 访问localhost:3000查看画板页面

调试方式

1. 运行测试脚本

python draw_start.py

1. 查看运行结果

MCP-server使用说明

1. 编译mcp-painter

cd mcp-painter
npm install
npm run build

1. 在支持MCP协议的客户端中添加mcp-painter
2. 配置客户端

"DrawingBoard": {
  "command": "yournodepath/node.exe",
  "args": [
    "yourpathto/mcppainter/build/index.js"
  ],
  "env": {},
  "disabled": false,
  "autoApprove": [
    "set_brush",
    "use_eraser",
    "draw_on_canvas",
    "set_color",
    "get_image",
    "clear_canvas",
    "get_canvas_size",
    "set_canvas_size",
    "get_current_draw_parameters"
  ]
}

许可证

None