Create diagrams as editable .drawio files and export them to PNG, SVG, or PDF with embedded diagram data for later editing. A bundled PNG export script uses the desktop app or a browser to render diagrams.
中文简介正在准备中。当前显示英语简介。
Generate draw.io diagrams as .drawio files and export to PNG/SVG/PDF with embedded XML
安装前可以查看交给 AI 代理的指令内容。
Generate draw.io diagrams as native .drawio files and export them to PNG images that can be embedded in Word documents.
mxGraphModel format for the requested diagram.drawio file using the create/edit file toolThis skill includes drawio-to-png.mjs, a Node.js export script with two rendering backends:
# Install dependencies (one-time, from the scripts folder)
cd skills/drawio/scripts && npm install
# Export a single diagram
node skills/drawio/scripts/drawio-to-png.mjs <input.drawio> [output.png]
# Export all .drawio files in a directory
node skills/drawio/scripts/drawio-to-png.mjs --dir <directory>
# Force a specific renderer
node skills/drawio/scripts/drawio-to-png.mjs --renderer=cli|viewer|auto <input.drawio>
| File | Purpose |
|---|---|
SKILL.md | This instruction file |
scripts/drawio-to-png.mjs | Node.js export script (CLI + browser fallback) |
scripts/package.json | Dependencies (puppeteer-core) |
| Format | Embed XML | Notes |
|---|---|---|
png | Yes | Viewable everywhere, editable in draw.io |
svg | Yes | Scalable, editable in draw.io |
pdf | Yes | Printable, editable in draw.io |
Use these styles for consistent, professional diagrams:
<!-- Primary service (highlighted) -->
<mxCell style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;strokeWidth=2;arcSize=12;shadow=1;" />
<!-- External system -->
<mxCell style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f5f5f5;strokeColor=#666666;" />
<!-- Success/processing stage -->
<mxCell style="rounded=1;whiteSpace=wrap;html=1;fillColor=#d5e8d4;strokeColor=#82b366;" />
<!-- Warning/quality gate -->
<mxCell style="rounded=1;whiteSpace=wrap;html=1;fillColor=#fff2cc;strokeColor=#d6b656;" />
<!-- Error/failure path -->
<mxCell style="rounded=1;whiteSpace=wrap;html=1;fillColor=#f8cecc;strokeColor=#b85450;" />
<!-- Data store (cylinder) -->
<mxCell style="shape=cylinder3;whiteSpace=wrap;html=1;fillColor=#fff2cc;strokeColor=#d6b656;" />
<!-- Arrow -->
<mxCell style="edgeStyle=orthogonalEdgeStyle;rounded=1;strokeColor=#6c8ebf;strokeWidth=2;" />
Try drawio first (works if on PATH), then fall back:
"C:\Program Files\draw.io\draw.io.exe"/Applications/draw.io.app/Contents/MacOS/draw.iodrawio (via snap/apt/flatpak)drawio -x -f png -e -b 10 -o <output.png> <input.drawio>
Flags: -x (export), -f (format), -e (embed diagram XML), -b (border), -o (output path).
还没有评价。欢迎分享你的使用感受。
无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
Map an existing codebase into seven documents covering its technology, structure, architecture, conventions, integrations, tests, and concerns. Link findings to file evidence, mark unknowns, and highlight differences between stated plans and the actual implementation.
中文简介正在准备中。当前显示英语简介。
Assess a repository’s readiness for AI agents with AgentRC and generate a standalone HTML dashboard. Review scores across nine areas, see prioritized improvements, and optionally apply scoring policies tailored to an organization.
中文简介正在准备中。当前显示英语简介。
Generate coding agent instruction files from a project's actual code using AgentRC. Capture detected languages, frameworks, and conventions in one shared file or split rules by topic and project area, with a preview before writing.
中文简介正在准备中。当前显示英语简介。
Customize AgentRC readiness assessments to match team or organization standards. Choose or create policies that adjust check importance, disable irrelevant checks, set pass thresholds, and define requirements for automated checks in CI workflows.
中文简介正在准备中。当前显示英语简介。
Analyze supplied ad performance data to identify wasted spend, strong campaigns, and next tests. Compare channels, assess whether test differences are meaningful, and produce budget reallocation recommendations with a prioritized action plan.
中文简介正在准备中。当前显示英语简介。
Turn code files into learning resources by adding comments that explain syntax, programming concepts, and design choices. Adjust explanation depth and repetition to the reader’s knowledge while preserving file structure, encoding, and syntax.
中文简介正在准备中。当前显示英语简介。