使用你喜欢的包管理器,秒速上手 Figcraft。
完全在 Node.js 中运行,无浏览器依赖。
内置完整类型定义,也支持纯 JavaScript。
创建 flowchart.ts
import { Figure } from 'figcraft'
const fig = new Figure(800, 350, { bg: '#fff' })
const data = fig.rect('Raw Data', {
size: [100, 50], fill: 'none', radius: 6,
color: '#000', bold: true,
})
const preprocess = fig.rect('Preprocess', {
size: [120, 120], fill: 'none', radius: 8,
color: '#000', bold: true, padding: 20,
})
preprocess.rect('Clean', { ... })
preprocess.rect('Tokenize', { ... })
const model = fig.rect('Model', {
size: [120, 120], fill: 'none', radius: 8,
stroke: { color: '#000', dash: [6, 3] },
color: '#000', bold: true, padding: 20,
})
const evaluate = fig.rect('Evaluate', { ... })
const deploy = fig.rect('Deploy', { radius: 25 })
fig.row([data, preprocess, model, evaluate, deploy])
fig.arrow(data, preprocess, { head: 'stealth' })
fig.arrow(evaluate, preprocess, {
path: 'curve', curve: -80,
style: 'dashed', head: 'vee', label: 'feedback',
})
fig.export('flowchart.svg', { fit: true })
运行脚本
打开 flowchart.svg
让 AI 智能体直接生成图表 —— 无需编写代码。
添加到你的 MCP 设置文件中:
{
"mcpServers": {
"figcraft": {
"command": "npx",
"args": ["figcraft-mcp"]
}
}
}
然后用自然语言描述你的图表:"画一个三层神经网络架构图"