JSON Canvas MCP Server

by Cam10001110101
Verified

hybrid server

The server is able to function both locally and remotely, depending on the configuration or use case.

Integrations

  • Supports exporting canvas data to SVG format through the export_canvas tool, allowing visualization of JSON Canvas content.

JSON Canvas MCP 服务器

模型上下文协议 (MCP) 服务器实现,提供根据官方规范处理 JSON Canvas 文件的工具。此服务器支持创建、修改和验证无限的画布数据结构。

概述

JSON Canvas MCP 服务器提供了 JSON Canvas 1.0 规范的完整实现,支持:

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

成分

资源

服务器公开以下资源:

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

工具

节点操作

  • 创建节点
    • 创建任何受支持类型的新节点
    • 输入:
      • type (字符串):节点类型(“文本”,“文件”,“链接”,“组”)
      • properties (对象):节点特定的属性
        • 常见: idxywidthheightcolor
        • 特定类型: textfileurl等。
    • 返回:创建的节点对象
  • 更新节点
    • 更新现有节点的属性
    • 输入:
      • id (字符串):要更新的节点 ID
      • properties (对象):要更新的属性
    • 返回:更新后的节点对象
  • 删除节点
    • 删除节点及其连接的边
    • 输入:
      • id (字符串):要删除的节点 ID
    • 返回:成功确认

边缘操作

  • 创建边
    • 在节点之间创建新边
    • 输入:
      • id (字符串):唯一边缘标识符
      • fromNode (字符串):源节点 ID
      • toNode (字符串):目标节点 ID
      • fromSide (可选字符串):起始侧(“顶部”、“右侧”、“底部”、“左侧”)
      • toSide (可选字符串):结束侧
      • color (可选字符串):边缘颜色
      • label (可选字符串):边缘标签
    • 返回:创建的边缘对象
  • 更新边
    • 更新现有边的属性
    • 输入:
      • id (字符串):要更新的边缘 ID
      • properties (对象):要更新的属性
    • 返回:更新的边缘对象
  • 删除边
    • 移除边
    • 输入:
      • id (字符串):要删除的边 ID
    • 返回:成功确认

画布操作

  • 验证画布
    • 根据规范验证画布
    • 输入:
      • 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" } } } }

紫外线

{ "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 .

本地构建

# Install uv if not already installed curl -LsSf https://astral.sh/uv/install.sh | sh # Create virtual environment and install dependencies uv venv source .venv/bin/activate # On Windows: .venv\Scripts\activate uv pip install -e . # Run tests pytest

示例用法

创建画布

from jsoncanvas import Canvas, TextNode, Edge # Create nodes 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" # Using preset color ) # Create canvas canvas = Canvas() canvas.add_node(title) canvas.add_node(info) # Connect nodes edge = Edge( id="edge1", from_node="title", to_node="info", from_side="right", to_side="left", label="Connection" ) canvas.add_edge(edge) # Save canvas canvas.save("example.canvas")

执照

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

-
security - not tested
A
license - permissive license
-
quality - not tested

模型上下文协议服务器,可根据 JSON Canvas 1.0 规范创建、修改和验证无限画布数据结构。

  1. Overview
    1. Components
      1. Resources
      2. Tools
    2. Usage with Claude Desktop
      1. Docker
      2. UV
    3. Configuration
      1. Building
        1. Docker Build
        2. Local Build
      2. Example Usage
        1. Creating a Canvas
      3. License
        ID: ajj64p9c3i