cloud
2.4 KiB
2.4 KiB
name, description
| name | description |
|---|---|
| edge-svg-diagram | edge_collector 可编辑 SVG 图示规范。用于用户要求画架构图、部署拓扑图、协议链路图、流程图、方案配图、报告示意图时，生成可提交到 docs 的静态 SVG，并结合当前边缘/云平台/鲁班猫/协议采集场景设计。 |
edge_collector SVG 图示
适用场景
- 云边架构图
- 边缘 runtime 目录结构图
- 协议采集链路图
- FANUC helper / proxy 架构图
- OTA 升级流程图
- AI 本地模型部署图
- WiFi/4G/frpc/端口转发 agent 关系图
输出位置
- 文档配图优先放在对应文档旁边的子目录，例如
docs/assets/或专题目录下。 - 文件名使用清晰中文或
snake_case，扩展名.svg。 - Markdown 中使用相对路径引用。
设计要求
- SVG 必须可编辑、可 diff。
- 使用真实项目元素命名：
collector、configurator、cloud_server、runtime/edge、scripts/migrate_edge.sh。 - 不使用复杂渐变和难维护滤镜。
- 字号、间距、线条保持清晰，适合 Markdown 预览。
- 区域超过 3 个或节点超过 8 个时，先做布局骨架，再补细节。
风格规则
按用途选择风格，不要混用：
- 文档/方案/报告配图：优先浅色、打印友好，白色或近白背景，深色文字，少量蓝/绿/橙用于区分云端、边缘、设备、风险。
- 前端原型/交互说明图：应贴近当前前端暗色风格，参考
frontend/config_app和frontend/cloud_app的视觉基线：- 背景：
#0d0d14、#14141e - 边框：
#2a2a3a - 主文字：
#e0e0e0 - 标题/高亮文字：
#ffffff - 强调色：
#6366f1 - 状态色按现有页面语义选择，避免一整张图只有紫蓝色
- 避免营销页式大渐变和装饰感过强的科技视觉
- 背景：
- 用户故事中的业务场景图：优先清晰、业务化，不必强行模拟前端 UI；如果故事本身是前端页面或交互改造，再使用暗色项目风格。
推荐布局
- 云边拓扑：左边缘、右云端，中间网络/隧道。
- 进程架构：上层 UI/API，中层服务，底层配置/数据库/设备。
- 部署流程：从构建主机到 runtime 到目标主机。
验证
- 用浏览器或图片查看工具打开 SVG。
- 确认文字不重叠、不截断。
- 确认中文显示正常。
- 确认风格与用途匹配：文档图可打印，前端原型图与项目暗色主题一致。
- 文档引用路径有效。