JSON Canvas MCP 服务器

一个遵循官方规范的模型上下文协议（MCP）服务器实现，提供操作JSON Canvas文件的工具。该服务器支持创建、修改和验证无限画布数据结构。

概述

JSON Canvas MCP服务器完整实现了JSON Canvas 1.0规范，提供以下功能：

• 创建和操作无限画布数据
• 支持所有节点类型（文本、文件、链接、群组）
• 带样式和标签的边连接
• 规范验证功能
• 可配置的输出路径

组件

资源

服务器提供以下资源：

• canvas://schema：用于验证画布文件的JSON Schema
• canvas://examples：展示不同功能的示例画布文件
• canvas://templates：创建新画布的模板

工具

节点操作

• create_node

  • 创建任意支持类型的新节点
  • 输入：
    • type (字符串)：节点类型（"text", "file", "link", "group"）
    • properties (对象)：节点特定属性
      • 通用属性：id, x, y, width, height, color
      • 类型特定属性：text, file, url等
  • 返回：创建的节点对象

• update_node

  • 更新现有节点属性
  • 输入：
    • id (字符串)：要更新的节点ID
    • properties (对象)：要更新的属性
  • 返回：更新后的节点对象

• delete_node

  • 删除节点及其连接的边
  • 输入：
    • id (字符串)：要删除的节点ID
  • 返回：成功确认

边操作

• create_edge

  • 在节点间创建新边
  • 输入：
    • id (字符串)：唯一边标识符
    • fromNode (字符串)：源节点ID
    • toNode (字符串)：目标节点ID
    • fromSide (可选字符串)：起始边（"top", "right", "bottom", "left"）
    • toSide (可选字符串)：终止边
    • color (可选字符串)：边颜色
    • label (可选字符串)：边标签
  • 返回：创建的边对象

• update_edge

  • 更新现有边属性
  • 输入：
    • id (字符串)：要更新的边ID
    • properties (对象)：要更新的属性
  • 返回：更新后的边对象

• delete_edge

  • 删除边
  • 输入：
    • id (字符串)：要删除的边ID
  • 返回：成功确认

画布操作

• validate_canvas

  • 根据规范验证画布
  • 输入：
    • canvas (对象)：要验证的画布数据
  • 返回：包含所有错误的验证结果

• export_canvas

  • 将画布导出为不同格式
  • 输入：
    • format (字符串)：目标格式（"json", "svg", "png"）
    • canvas (对象)：要导出的画布数据
  • 返回：请求格式的导出画布

与Claude Desktop配合使用

Docker

在claude_desktop_config.json中添加：

{
  "mcpServers": {
    "jsoncanvas": {
      "command": "docker",
      "args": [
        "run",
        "-i",
        "--rm",
        "-v",
        "canvas-data:/data",
        "mcp/jsoncanvas"
      ],
      "env": {
        "OUTPUT_PATH": "/data/output"
      }
    }
  }
}

UV

{
  "mcpServers": {
    "jsoncanvas": {
      "command": "uv",
      "args": [
        "--directory",
        "/path/to/jsoncanvas",
        "run",
        "mcp-server-jsoncanvas"
      ],
      "env": {
        "OUTPUT_PATH": "./output"
      }
    }
  }
}

配置

可通过环境变量配置服务器：

• OUTPUT_PATH：画布文件保存目录（默认："./output"）
• FORMAT：画布文件默认输出格式（默认："json"）

构建

Docker构建

docker build -t mcp/jsoncanvas .

本地构建

# 如未安装uv则先安装
curl -LsSf https://astral.sh/uv/install.sh | sh

# 创建虚拟环境并安装依赖
uv venv
source .venv/bin/activate  # Windows系统: .venv\Scripts\activate
uv pip install -e .

# 运行测试
pytest

示例用法

创建画布

from jsoncanvas import Canvas, TextNode, Edge

# 创建节点
title = TextNode(
    id="title",
    x=100,
    y=100,
    width=400,
    height=100,
    text="# Hello Canvas\n\nThis is a demonstration.",
    color="#4285F4"
)

info = TextNode(
    id="info",
    x=600,
    y=100,
    width=300,
    height=100,
    text="More information here",
    color="2"  # 使用预设颜色
)

# 创建画布
canvas = Canvas()
canvas.add_node(title)
canvas.add_node(info)

# 连接节点
edge = Edge(
    id="edge1",
    from_node="title",
    to_node="info",
    from_side="right",
    to_side="left",
    label="Connection"
)
canvas.add_edge(edge)

# 保存画布
canvas.save("example.canvas")

许可证

本MCP服务器采用MIT许可证授权。这意味着您可以自由使用、修改和分发该软件，但需遵守MIT许可证的条款和条件。详情请参阅项目仓库中的LICENSE文件。