ASCII图表生成服务

一个基于MonoSketch渲染引擎的MCP服务器,为AI代理提供使用Unicode框线字符创建精美ASCII图表的能力。

  • by supersterling
  • TypeScript
  • 本地部署
  • 2 星标
  • 更新于
在 GitHub 查看 supersterling/monosketch-mcp

使用说明

单开关mcp

一个MCP服务器,使AI代理能够使用Unicode方框图字符创建漂亮的ASCII图。基于来自的渲染引擎构建 MonoStack.

┌──────────────────┐       ┌──────────────────┐
│                  │       │                  │
│     Frontend     │──────▶│      API         │
│                  │       │                  │
└──────────────────┘       └────────┬─────────┘
                                    │
                                    │
                           ┌────────▼─────────┐
                           │                  │
                           │    Database      │
                           │                  │
                           └──────────────────┘

设置

需要 包子 运行时。

git clone https://github.com/supersterling/monosketch-mcp.git
cd monosketch-mcp
bun install

添加到克劳德代码

claude mcp add monosketch -- bun run /path/to/monosketch-mcp/index.ts

添加到克劳德桌面

添加到您的 claude_desktop_config.json:

{
  "mcpServers": {
    "monosketch": {
      "command": "bun",
      "args": ["run", "/path/to/monosketch-mcp/index.ts"]
    }
  }
}

工具

render_scene

无状态单次渲染。传递一组形状,返回ASCII艺术。

{
  "shapes": [
    {
      "type": "rectangle",
      "x": 0, "y": 0, "width": 20, "height": 5,
      "border": { "enabled": true }
    },
    {
      "type": "text",
      "x": 0, "y": 0, "width": 20, "height": 5,
      "content": "Hello World",
      "horizontalAlign": "center",
      "verticalAlign": "middle",
      "border": { "enabled": true }
    }
  ]
}

输出:

┌──────────────────┐
│                  │
│   Hello World    │
│                  │
└──────────────────┘

画布工具(有状态)

在多个工具调用中逐步构建图表:

工具 说明
create_canvas 创建命名画布会话
add_shape 将形状添加到画布
modify_shape 更新形状属性
remove_shape 删除形状
render_canvas 将当前状态渲染为ASCII
list_canvases 列出活动会话
clear_canvas 删除所有形状

公用事业

工具 说明
list_styles 列出所有可用的边框、填充和锚点样式
measure_text 计算单词包装文本的边界框

形状类型

矩形

{ "type": "rectangle", "x": 0, "y": 0, "width": 10, "height": 4,
  "border": { "enabled": true, "style": "S1", "corner": "rounded" },
  "fill": { "enabled": true, "style": "F1" } }

文本

{ "type": "text", "x": 0, "y": 0, "width": 20, "height": 3,
  "content": "Centered text", "horizontalAlign": "center", "verticalAlign": "middle",
  "border": { "enabled": true } }

线路

{ "type": "line",
  "points": [{"x": 0, "y": 2}, {"x": 10, "y": 2}, {"x": 10, "y": 5}],
  "stroke": { "enabled": true },
  "endAnchor": "A1" }

群组

{ "type": "group", "children": [
  { "type": "rectangle", "x": 0, "y": 0, "width": 10, "height": 3, "border": { "enabled": true } },
  { "type": "rectangle", "x": 15, "y": 0, "width": 10, "height": 3, "border": { "enabled": true } }
]}

样式参考

边框/笔划样式

ID 名称 字符
S1 薄型(默认) ─ │ ┌ ┐ └ ┘
S2 粗体 ━ ┃ ┏ ┓ ┗ ┛
S3 双 ═ ║ ╔ ╗ ╚ ╝
S4 圆形 ─ │ ╭ ╮ ╰ ╯

填充样式

ID 名称 字符
F1 空间 (不透明空白)
F2 实心 █
F3 中等色调 ▒
F4 浅色 ░
F5 对角线 ▚

锚点样式(线端点)

ID 姓名 L R U D
A1 填充箭头 ◀ ▶ ▲ ▼
A12 空心箭头 ◁ ▷ △ ▽
A2 填充正方形 ■ ■ ■ ■
A21 空心方形 □ □ □ □
A220 填充钻石 ◆ ◆ ◆ ◆
A221 空心钻石 ◇ ◇ ◇ ◇
A3 空心圆 ○ ○ ○ ○
A5 实心圆 ● ● ● ●

短跑图案

添加 "dash": { "dash": 3, "gap": 1 } 对于虚线边框/笔划,可以设置为任何形状。

线路穿越

当线条交叉时,连接字符会自动解析:

    │
────┼────
    │

该引擎使用正确的Unicode连接字符(T形连接、十字、角)处理单线、粗体和双线样式的所有组合。

测试

bun test

208个测试,涵盖几何图元、位图渲染、电路板合成、交叉分辨率、形状层次、渲染器管道、画布管理和端到端集成场景。

建筑

渲染引擎是从以下位置提取的 MonoStack,一个开源的ASCII图编辑器。

Shape Description (JSON)
  → BitmapFactory (per shape type)
    → MonoBitmap (sparse character matrix)
      → MonoBoard (tiled canvas with crossing resolution)
        → ASCII string output

发动机模块:

  • engine/geo/ --点、矩形、大小几何图元
  • engine/shape/ --形状层次结构(矩形、文本、线条、组)
  • engine/style/ --笔划、填充、锚点和对齐样式
  • engine/bitmap/ --稀疏位图矩阵和按形状渲染工厂
  • engine/board/ --采用Unicode行交叉分辨率的平铺画布合成

许可证

麻省理工学院