Draw.io Scientific Illustrator plugin
A Codex plugin that redraws a scientific figure from a reference on the live draw.io canvas step by step, then validates and exports the file
- 1,461 ★ on the repository
- Last commit
- MIT
Extended access
Why this level
- Launches draw.io with a local debugging port and two Node.js servers on your machine
- Reads the attached reference and writes `.drawio` files and exports to disk
- The installer can be fetched from the network and run through the shell in one command
Install
- Works in
Manual install
git clone https://github.com/icebird1998/drawio-scientific-illustrator.gitNeeds Codex with plugin support, desktop draw.io, Git and Node.js (22 or newer recommended). Installer scripts `install.sh` and `install.ps1` also exist; read them before running.
Access and checks
How we reviewExtended accessThe tool runs code or makes network calls and only reads external data.
- Launches draw.io with a local debugging port and two Node.js servers on your machine
- Reads the attached reference and writes `.drawio` files and exports to disk
- The installer can be fetched from the network and run through the shell in one command
This is third-party code. Review the repository files before installing.
What it does
Draw.io Scientific Illustrator is a Codex plugin that redraws a scientific figure inside the desktop draw.io window: shapes, labels and arrows appear on the canvas one at a time, and you can watch it happen. You attach a reference (PNG, JPEG, SVG or a PDF page rendered to an image), name the plugin in the task and set the pause between steps and the output formats. The plugin does not touch the system mouse or keyboard and does not build XML up front: its `drawio-live` MCP server launches draw.io with a local debugging port and calls the editor's own graph model API. The skill walks the agent through a fixed order. The agent breaks the reference into editable parts (panels, nodes, text, arrows, legend), starts the editor with `drawio_live_launch` and waits for the graph to be ready. It then adds shapes and edges with `drawio_live_add_shape` and `drawio_live_add_edge`, or in a series with `drawio_live_draw_sequence` and a nonzero pause. After each section it takes a `drawio_live_screenshot`, compares it with the reference and fixes labels, styles and sizes through `drawio_live_inspect` and `drawio_live_update_cell`. The `.drawio` file is saved only when the drawing on the canvas is finished (`drawio_live_save_snapshot`). The second MCP server, `drawio-file-utils`, validates the saved document (`drawio_validate`) and exports PNG, SVG, PDF or JPG (`drawio_export`). For review the skill asks for a 2000-pixel PNG without embedded XML, and for final files it embeds the draw.io XML where the format allows it.
Who it is for. For researchers, graduate students and science editors who work with Codex and want an editable diagram instead of a flat image, and for anyone preparing illustrations for papers and talks.
Good fit when
- You have a raster diagram from a paper and need to rebuild it from editable shapes, text and arrows
- You want to watch the agent build the figure and step in along the way
- A finished diagram needs fixing in the open draw.io window: labels, colors, sizes, element positions
- You need the result as `.drawio`, PNG, SVG, PDF or JPG, with the file structure checked automatically
Not a fit when
- You need microscopy images, photographs, heatmaps or dense data plots: the plugin builds editable draw.io shapes and has no live image insertion yet
- You do not work in Codex: the plugin is packaged as a Codex plugin with its own install catalog, and the documentation says nothing about other agents
- You need new features and fixes: development has moved to the project listed in the catalog as Scientific Illustrator
- The desktop version of draw.io is not installed: the plugin drives only that app
Example request
Use Draw.io Scientific Illustrator: launch live draw.io and redraw this diagram from the paper step by step with a 100 ms pause, keep labels and arrows editable, then save a .drawio file and export a 2000-pixel PNGLimitations
- The repository is no longer updated: the author moved development and releases to the scientific-illustrator project and recommends installing it. The old one stays public and is not archived. Version 1.0.0 came out on 12 July 2026 under the MIT license.
- Windows is the tested platform. For macOS and Linux the author promises best-effort support until the community tests it.
- There is no live image insertion. If the figure is made of photographs, heatmaps or complex plots, the skill tells the agent to say so instead of quietly building XML up front.
- For complex redraws the author recommends the GPT-5.6 Sol model with maximum reasoning effort. That mode answers more slowly and spends more tokens.
- If the reference is hard to read, the skill requires listing the uncertain labels and elements instead of inventing them. A person still checks the final result against the reference for meaning.
How to disable. The documentation has no uninstall command. Remove the plugin through Codex plugin management or delete the directory the installer cloned the repository into (by default `~/.codex/marketplaces/drawio-scientific-illustrator` for `install.sh`), then restart Codex. Saved `.drawio` files and exports stay wherever you wrote them.
FAQ
Does the plugin control the mouse and keyboard?
No. It calls the graph model API inside draw.io through a debugging channel that listens only on 127.0.0.1. The skill explicitly forbids operating-system mouse, keyboard and window automation.
How do the drawio-live and drawio-file-utils servers differ?
`drawio-live` launches or finds a visible draw.io and changes its graph in real time. `drawio-file-utils` works on an already saved file: it checks the structure and exports PNG, SVG, PDF or JPG.
Which port does the plugin use and where does it keep the profile?
The preferred debugging port is 9333; if it is taken, the nearest free one is chosen, and `DRAWIO_LIVE_PORT` sets it explicitly. A dedicated draw.io profile lives in `~/.drawio-live-mcp/<port>`, and `DRAWIO_LIVE_PROFILE` changes the path.
What if draw.io is not found?
The plugin looks in the usual install locations on Windows, macOS and Linux. For a custom path set `DRAWIO_PATH` before starting Codex, for example `$env:DRAWIO_PATH = "D:\Apps\draw.io\draw.io.exe"` in PowerShell.
Why does the skill not build the XML first?
By the skill's rules the figure has to appear on the visible canvas step by step, and only then is the `.drawio` file serialized. You see the progress and can stop the agent on a section that went wrong.
Do I need to restart Codex after installing?
Yes. Restart Codex and start a new task, otherwise the new skill and MCP tools are not loaded.
Discussion
No questions or reviews yet.
Related
PluginsNext AI Draw.io is an MCP server and plugin where the agent draws draw.io diagrams on a live browser canvas that you can edit by hand
The official draw.io MCP server: an agent builds diagrams from XML or Mermaid and opens them in the draw.io editor
Scientific Illustrator
scientific-illustrator
A plugin for Codex: redraws a scientific figure from a reference image as editable objects in PowerPoint, WPS or draw.io. The README is in Chinese
A skill for editable draw.io diagrams from text, code, Terraform, Kubernetes, SQL and OpenAPI, with export and self-checks
Draw.io Skill
Draw.io Skill for Claude & Codex
Skills for draw.io diagrams: architecture, networks, flowcharts, import from Terraform and code, offline generation from YAML and PNG and SVG export
A skill that draws editorial diagrams as standalone HTML and SVG files: architecture, flowcharts, ER, funnels and about forty more types
Comparison with similar tools
Entries that share the main search query, and how they differ.
| Entry | Official | Repository stars | Main difference |
|---|---|---|---|
| Draw.io Scientific Illustrator (this entry) | no | 1,461 | |
| Scientific Illustrator | no | 960 | the same author's newer project where development moved; also draws in PowerPoint and WPS |
| drawio-skill | no | 10,307 | a skill that builds draw.io diagrams from text, code, Terraform and SQL rather than redrawing a scientific figure from a reference |
README in short
The repository holds the plugin in `plugins/drawio-scientific-illustrator`: a manifest, two Node.js MCP servers and a skill, next to a root install catalog for Codex, the `install.sh` and `install.ps1` scripts, the `validate-repo.mjs` and `smoke-test.mjs` checks, a privacy policy and a changelog. The description, in English and Chinese, opens with a notice about the project move, followed by requirements, three install routes, a sample prompt, the tool order, environment variables, troubleshooting and known limits.
README badge
Original SKILL.md
--- name: recreate-scientific-figure-in-drawio description: Recreate, trace, revise, inspect, or export static scientific figures and schematic illustrations live inside the visible draw.io desktop canvas through draw.io's own graph API. Use when the user wants to watch an MCP draw a reference figure step by step in draw.io, explicitly rejects XML-first generation or operating-system mouse/screen control, provides a PNG/JPEG/SVG/PDF reference to rebuild as editable draw.io geometry, requests targeted live changes, or needs final .drawio/PNG/SVG/PDF/JPG deliverables. --- # Recreate Scientific Figures in draw.io Use the plugin's live MCP tools whose names end in `drawio_live_launch`, `drawio_live_status`, `drawio_live_screenshot`, `drawio_live_add_shape`, `drawio_live_add_edge`, `drawio_live_update_cell`, `drawio_live_draw_sequence`, `drawio_live_fit`, `drawio_live_inspect`, and `drawio_live_save_snapshot`. Use file tools ending in `drawio_validate` and `drawio_export` only after the visible drawing has been saved. ## Hard boundary - Control only draw.io's internal graph/model API through the live MCP server. - Never use operating-system mouse, keyboard, window, or full-screen automation for this workflow. - Never pre-build XML and then open it as the drawing method. Serialize `.drawio` only after live shapes and edges already exist on the visible canvas. - Renderer screenshots are allowed only to inspect the draw.io canvas itself; they are not general computer-screen control. ## Workflow 1. Inspect every provided reference image with vision before creating XML. For a PDF, render the relevant page first. Do not merely embed the raster image and call it recreated. 2. Decompose the figure into editable primitives: canvas/aspect ratio, panels, containers, nodes, text, arrows, legends, repeated motifs, colors, stroke widths, fonts, and z-order. Identify any portions that must remain raster because draw.io primitives cannot reproduce them faithfully. 3. Call `drawio_live_launch` with a visible per-step delay, normally 400–1000 ms. Call `drawio_live_status` and require `graph_ready=true` before drawing. 4. Add geometry directly to the live canvas: - Use `drawio_live_add_shape` and `drawio_live_add_edge` for one deliberate visible step at a time. - Use `drawio_live_draw_sequence` only with a nonzero `step_delay_ms`; each operation must remain a separate draw.io model update so the user can watch it appear. - Use stable semantic cell ids from the beginning so later edges and edits can target exact elements. 5. Call `drawio_live_screenshot` after each logical section, not after every trivial cell. Inspect only the draw.io renderer and compare it with the reference. 6. Iterate directly in the live graph. Use `drawio_live_inspect` followed by `drawio_live_update_cell` for labels, styles, position, and size. Use `drawio_live_fit` to keep progress visible. 7. After the visible figure is complete, call `drawio_live_save_snapshot`. This is the first point at which `.drawio` XML should be serialized. 8. Call `drawio_validate`. Fix structural errors through the live graph when possible, then save again. 9. Export a review PNG with `embed=false` and `width=2000`. Check element count, wording, topology, alignment, overlap, clipping, arrow direction, color, whitespace, and correspondence to the reference. 10. After approval, export the requested deliverables. Default to an editable `.drawio` plus PNG. Use `embed=true` for final PNG/SVG/PDF so draw.io XML remains embedded where supported. ## Fidelity rules - Match scientific meaning before decoration: labels, relationships, directionality, grouping, and panel structure must be correct. - Recreate text as text and arrows as connectors; do not flatten them into a screenshot. - Keep coordinates on a 10 px grid unless matching the reference requires finer placement. - Use consistent fonts, stroke widths, arrowheads, corner radii, and semantic colors. - Route connectors around unrelated shapes. Pin entry/exit points where multiple edges share a node. - For microscopy, photographs, heatmaps, molecular renderings, or dense plotted data, explain that the live API currently focuses on editable draw.io primitives. Add a dedicated live image-insertion operation before attempting hybrid figures; do not silently fall back to XML-first construction. - If a reference is ambiguous or too low-resolution to read, state the uncertain labels/elements instead of inventing them. ## Delivery Return clickable paths for the `.drawio` source and each export. State validation status and briefly identify any intentionally rasterized portions.