Files
chill_notes/AI工程/fireworks-tech-graph技术图表.md
2026-04-22 23:59:39 +08:00

154 lines
3.6 KiB
Markdown
Executable File
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# fireworks-tech-graph 技术图表生成 Skill
> 自然语言描述生成专业 SVG+PNG 技术图表
>
> 归档2026-04-22
---
## 项目信息
| 项目 | 数据 |
|------|------|
| **仓库** | https://github.com/yizhiyanhua-ai/fireworks-tech-graph |
| **Stars** | ⭐ 4,168 |
| **Forks** | 364 |
| **最后更新** | 2026-04-20 |
| **许可证** | MIT |
| **定位** | Claude Code 专用 Skill |
---
## 核心功能
| 功能 | 说明 |
|------|------|
| 🗣️ **自然语言驱动** | 直接用中文/英文描述图表,无需拖拽 |
| 📐 **8 种图表类型** | UML 全部 14 种 + AI/Agent 专用图 |
| 🎨 **7 种视觉风格** | Flat、Dark、Blueprint、Notion、Glass、Claude官方、OpenAI官方 |
| 🖼️ **SVG + PNG 输出** | SVG 可编辑PNG 1920px 高清 |
| 🤖 **AI/Agent 领域知识** | 内置 RAG、Mem0、Multi-Agent、Tool Call 等模式 |
---
## 7 种视觉风格
| # | 风格 | 适用场景 |
|---|------|---------|
| 1 | Flat Icon | 扁平化产品文档 |
| 2 | Dark Terminal | 暗黑终端风格 |
| 3 | Blueprint | 工程蓝图风格 |
| 4 | Notion Clean | 极简白底 |
| 5 | Glassmorphism | 磨砂玻璃风格 |
| 6 | Claude Official | Anthropic 品牌色 |
| 7 | OpenAI Official | OpenAI 品牌色 |
---
## AI/Agent 领域专用图案
| 图案类型 | 说明 |
|---------|------|
| RAG | 检索增强生成流程 |
| Mem0 | 记忆架构 |
| Multi-Agent | 多智能体协作 |
| Tool Call | 工具调用流程 |
| Agentic Search | 智能体搜索 |
---
## 语义图形词汇
| 元素 | 图形 |
|------|------|
| LLM | 双边框矩形 |
| Agent | 六边形 |
| Vector Store | 带环圆柱体 |
| 数据库 | 圆柱体 |
---
## 语义箭头系统
| 箭头类型 | 含义 |
|---------|------|
| 实线箭头 | 数据流 |
| 虚线箭头 | 异步/控制流 |
| 颜色区分 | write vs read vs loop |
---
## 安装方式Claude Code
```bash
npx skills add yizhiyanhua-ai/fireworks-tech-graph --force -g -y
```
**依赖**
```bash
# macOS
brew install librsvg
# Ubuntu/Debian
sudo apt install librsvg2-bin
# 验证
rsvg-convert --version
```
---
## 优势对比
| 对比项 | Mermaid | draw.io | fireworks-tech-graph |
|--------|---------|---------|---------------------|
| 自然语言输入 | ❌ | ❌ | ✅ |
| AI/Agent 领域图 | ❌ | ❌ | ✅ |
| 多种视觉风格 | ❌ | 手动 | ✅ 7种内置 |
| 高清 PNG 导出 | ❌ | 手动 | ✅ 自动 1920px |
| 语义箭头颜色 | ❌ | 手动 | ✅ 自动 |
| 无需在线工具 | ✅ | ❌ | ✅ |
---
## OpenClaw 兼容性
⚠️ **这是 Claude Code 专用 Skill**OpenClaw 不能直接使用。
**原因**
- OpenClaw 使用 Skill 系统clawhub
- Claude Code 的 `skills add` 命令是 Claude Code 特有的
**解决方案**
- 手动适配:克隆仓库,提取 prompt 和模板,转换为 OpenClaw 格式
---
## 使用示例
```
Draw a Mem0 memory architecture diagram in style 1 (Flat Icon).
Use four horizontal sections: Input Layer, Memory Manager, Storage Layer, Output / Retrieval.
Include User, AI App / Agent, LLM, mem0 Client, Memory Manager, Vector Store, Graph DB, Key-Value Store, History Store, Context Builder, Ranked Results, Personalized Response.
Use semantic arrows for read, write, control, and data flow.
```
---
## 相关资源
| 资源 | 链接 |
|------|------|
| GitHub | https://github.com/yizhiyanhua-ai/fireworks-tech-graph |
| npm | https://www.npmjs.com/package/@yizhiyanhua-ai/fireworks-tech-graph |
---
## AI工程索引
其他笔记:
- [[INDEX_AI工程]] - AI工程知识索引
---
*整理:知识库管理员 | 归档2026-04-22*