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 캔버스 MCP 서버

공식 사양 에 따라 JSON Canvas 파일을 처리하는 도구를 제공하는 모델 컨텍스트 프로토콜(MCP) 서버 구현입니다. 이 서버를 사용하면 무한한 Canvas 데이터 구조를 생성, 수정 및 검증할 수 있습니다.

개요

JSON Canvas MCP 서버는 JSON Canvas 1.0 사양의 완전한 구현을 제공하여 다음을 가능하게 합니다.

무한 캔버스 데이터의 생성 및 조작
모든 노드 유형(텍스트, 파일, 링크, 그룹) 지원
스타일링 및 라벨을 사용한 엣지 연결
사양에 대한 검증
구성 가능한 출력 경로

구성 요소

자원

서버는 다음과 같은 리소스를 제공합니다.

canvas://schema : 캔버스 파일 검증을 위한 JSON 스키마
canvas://examples : 다양한 기능을 보여주는 예시 캔버스 파일
canvas://templates : 새로운 캔버스를 생성하기 위한 템플릿

도구

노드 작업

노드 생성
- 지원되는 모든 유형의 새 노드를 만듭니다.
- 입력:
  - type (문자열): 노드 유형("텍스트", "파일", "링크", "그룹")
  - properties (객체): 노드별 속성
    - 공통: id , x , y , width , height , color
    - 유형별: text , file , url 등
- 반환: 노드 객체 생성됨
업데이트_노드
- 기존 노드의 속성 업데이트
- 입력:
  - id (문자열): 업데이트할 노드 ID
  - properties (객체): 업데이트할 속성
- 반환: 업데이트된 노드 객체
삭제_노드
- 노드와 연결된 에지를 제거합니다.
- 입력:
  - id (문자열): 삭제할 노드 ID
- 반환: 성공 확인

엣지 운영

크리에이트_에지
- 노드 사이에 새로운 에지를 만듭니다
- 입력:
  - id (문자열): 고유한 에지 식별자
  - fromNode (문자열): 소스 노드 ID
  - toNode (문자열): 대상 노드 ID
  - fromSide (선택적 문자열): 시작 측면("top", "right", "bottom", "left")
  - toSide (선택적 문자열): 끝 쪽
  - color (선택적 문자열): 가장자리 색상
  - label (선택적 문자열): Edge 레이블
- 반환: 생성된 에지 객체
업데이트_에지
- 기존 모서리 속성 업데이트
- 입력:
  - id (문자열): 업데이트할 Edge ID
  - properties (객체): 업데이트할 속성
- 반환: 업데이트된 에지 객체
삭제_가장자리
- 모서리 제거
- 입력:
  - id (문자열): 삭제할 Edge ID
- 반환: 성공 확인

캔버스 운영

유효성 검사_캔버스
- 사양에 맞춰 캔버스 검증
- 입력:
  - canvas (객체): 검증할 Canvas 데이터
- 반환: 오류가 있는 검증 결과
내보내기_캔버스
- 캔버스를 다양한 형식으로 내보내기
- 입력:
  - format (문자열): 대상 형식("json", "svg", "png")
  - canvas (객체): 내보낼 캔버스 데이터
- 반환: 요청된 형식으로 캔버스를 내보냈습니다.

Claude Desktop과 함께 사용

도커

claude_desktop_config.json 에 다음을 추가하세요:

지엑스피1

자외선

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

구성

서버는 환경 변수를 사용하여 구성할 수 있습니다.

OUTPUT_PATH : 캔버스 파일이 저장될 디렉토리(기본값: "./output")
FORMAT : 캔버스 파일의 기본 출력 형식(기본값: "json")

건물

도커 빌드

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 파일을 참조하세요.

This server cannot be installed

-

security - not tested

A

license - permissive license

-

quality - not tested

JSON Canvas 1.0 사양에 따라 무한한 캔버스 데이터 구조를 생성, 수정 및 검증할 수 있는 모델 컨텍스트 프로토콜 서버입니다.

Related Resources

Reddit Discussion about this server

Appeared in Searches

A tool for creating 3D models and animations