codegen-diagram

基于当前项目/代码生成 Draw.io 图表,支持技术栈图、系统架构图、数据结构图、E-R 图四种类型。输出符合 Draw.io 语法的 .drawio 文件(mxGraph XML),可直接导入 Draw.io 编辑。当用户提到技术栈、系统架构、数据结构、E-R 图时使用。

Safety Notice

This listing is imported from skills.sh public index metadata. Review upstream SKILL.md and repository scripts before running.

Copy this and send it to your AI assistant to learn

Install skill "codegen-diagram" with this command: npx skills add xstongxue/best-skills/xstongxue-best-skills-codegen-diagram

代码生成·项目图表

本 Skill 指导 Agent 基于当前项目/代码仓库生成 Draw.io 格式图表,支持四种类型:技术栈图、系统架构图、数据结构图、E-R 图。

Step 0:任务识别

用户表述 / 关键词执行
技术栈、整体技术栈、组件选型reference/tech-stack.md
系统架构、分层结构、调用流程reference/system-arch.md
数据结构图、表结构图、实体字段关系图reference/data-structure.md
E-R 图、实体关系图、数据库关系图reference/er-diagram.md

使用时机

  • 用户需要根据当前项目画技术栈图、系统架构图、数据结构图或 E-R 图
  • 用户提到「根据当前项目」「根据代码」「画我们系统的……」

通用规范(四种图表共用)

Draw.io 基础

  • 使用 mxGraphModel,画布背景 #FFFFFF
  • 仅使用 Draw.io 内置形状,确保可立即打开与编辑
  • 节点标签简洁,符合技术文档表达习惯

色彩与字体

用途颜色值
主色调#3366CC
副色调#7FBFFF
强调色#FF9966
深色背景字体#FFFFFF
浅色背景字体#333333
画布背景#FFFFFF
  • 字体:Helvetica,字号 11–13
  • 连接线:endArrow=classicBlockThinblockThin

输出要求

  1. 图表总览(1–2 段文字)
  2. 完整 mxGraph XML(可保存为 .drawio)
  3. 导入与使用说明
  4. 图题与论文引用建议

Source Transparency

This detail page is rendered from real SKILL.md content. Trust labels are metadata-based hints, not a safety guarantee.

Related Skills

Related by shared tags or category signals.

Coding

dev-workflow

No summary provided by upstream source.

Repository SourceNeeds Review
Coding

codegen-doc

No summary provided by upstream source.

Repository SourceNeeds Review
General

wechat-article-writer

No summary provided by upstream source.

Repository SourceNeeds Review
Research

paper-write

No summary provided by upstream source.

Repository SourceNeeds Review