search2chart-mcp

Превращайте любые табличные данные в инлайн-графики прямо внутри диалогов агента. Ноль зависимостей в рантайме, мультиклиентская адаптивно.

Превращайте любые табличные данные в графики, встраиваемые страница в потом диалога агента. Ноль зависимостей в рантайме, адаптив для разныых клиентов.

Установка

# 方式一：DSH 原生插件（DeepSeek Harness 用户推荐，真·内联）
dsh plugin --profile web add dsh-chart

# 方式二：npx（通用 MCP server，无需 clone）
npx search2chart-mcp

# 方式三：git clone
git clone https://github.com/iqingyoung/search2chart-mcp.git

Related MCP server: Chart-Output MCP Server

Два пути

• Используете MCP-клиент → берите mcp/, графики появляются стра в диалоговом окне.

• Используете DSH и хотите нативный опыт → берите dsh/; в DSH также работат mcp/ (через файловые ссылки).

• Оба вари анта могут работать.

Быстрый старт

1. Добавьте в конфигурацию вашего MCP

{
  "mcpServers": {
    "search2chart-mcp": {
      "command": "npx",
      "args": ["search2chart-mcp"],
      "env": {}
    }
  }
}

Если npx не може в получи́t, использйте абсолютный путь после клонирования: "command": "node", "args": ["<仓库>/mcp/server.js"]

2. Первый заход: проверьте, какой формат изображения умеет рендерить ваш агент

Различные рендеры агенто по-разному поддерживают форматы изображений. Сначалом проверите вс в режиме all:

Временная конфигурация (добавьте переменные окружения в конфигурацию MCP):

{
  "env": {
    "ECHARTS_INLINE_MODE": "all"
  }
}

Тестовый промпт для агента:

用 chart_from_data 生成一个简单柱状图。
数据：[["城市","销量"],["北京",120],["上海",200],["广州",150]]
标题：城市销量对比
chartType：bar

Агент вернет 3–4 строки графиков, помеченные как:

• 【1·data URI】 — самодостаточный base64, не требует сети

• 【2·localhost http】 — локальный HTTP-сервис

• 【3·file://】 — локальный путь к файлу

• 【4·CDN 公网 https】 — GitHub + jsDelivr, публичный адрес

Какая из них в диалоговом полномо внедривается в изображение, такую ваш агент и поддерживает.

3. Фиксирование режима

Автоматическая конфигурация агентом

В результаты инструментов уже встроена инструкция для агента, которая говорит модели, как автоматически выставить режим по реакции пользователя:

[Agent]: 返回 4 行图片，哪张正常显示？
[User]:  3正常
[Agent]: 确认了。file:// 可渲染 → 请设置 ECHARTS_INLINE_MODE=file

Известные: ZCode → file，OpenCode → inline（data URI）），WorkBuddy → cdn，DSH → inline（localhost http）），Claude/Cursor → inline + returnImage:true。

Ключевые возможности

Инлайн-адаптация для множественных клиентов

Поведение инлайн-отображения управляется переменной окружения ECHARTS_INLINE_MODE:

CDN-публичный графический хостинг

• SVG → PNG 栅格化 (ttresvg/resvg-js，可选依赖)

• Загрузка через GitHub Contents API + jsDelivr CDN

• GitHub Actions 定时清理（默认保留 3 дня）

Сохранение данных в результатах

Результат содержит полные данные (JSON, в кодовом блоке), чтобы чисто текстовая модель могла продолжать анализировать доли/тенденции/сравнение в контексте, не глядя на график. returnData: false может отключить.

Самодостаточный интерактивный HTML

График также записывается в .html файл: в браузере работают наведение, масштабирование, переключение типов и настройка цвета.

Инструменты

Соглашения по полям: первый столбец — категориальная ось; остальные столбцы — числовые ряды / числовые series (多个 столбцов — многие series); chartType: auto — автоматический подбор круговой/столбцовой диаграммы по данным.

Подключение клиентов

Смотрите подробнее mcp/README.md.

Структура

search2chart-mcp/
├── mcp/              # 跨端 MCP server（内联 SVG + 可交互 HTML）
│   ├── server.js     # MCP stdio 协议 + 工具入口
│   ├── lib/
│   │   ├── chart.js      # 数据归一化 + ECharts option
│   │   ├── html.js       # 自包含可交互 HTML
│   │   ├── svg.js        # 零依赖 SVG 渲染器
│   │   ├── httpserver.js # 本地 HTTP 服务
│   │   ├── rasterize.js  # SVG→PNG
│   │   ├── upload.js     # GitHub + jsDelivr CDN
│   │   └── parse.js      # CSV/XLSX 解析
│   └── scripts/
│       ├── selftest.js    # 端到端自检
│       └── verify_cdn.cjs # CDN 端到端验证
├── dsh/              # 原生 DSH 内联插件
├── LICENSE
└── README.md

Лицензия

MIT