animate-diagram 0.1.0

CLI tool to animate data-flow arrows in SVG diagrams and export a GIF.

Animate Diagram

CLI tool to animate data-flow arrows in SVG diagrams and export a GIF. This project was created by Codex.

Notes:

• Works with Excalidraw diagrams today.
• Other SVG sources are not fully tested but may work.

How It Works

The tool detects arrow groups in the SVG (as Excalidraw exports them), infers the arrow direction, and applies a dashed stroke animation only to the arrow bodies. Each frame is rendered to PNG and then assembled into an animated GIF.

Before (source SVG):

After (animated GIF):

Build and Run

Requires Python 3.9+.

1. Install dependencies:

pip install -e .

2. Install Chromium for the default renderer:

playwright install chromium

3. Run the CLI:

python -m animate_diagram path/to/diagram.svg output.gif

Or via the console script:

animate-diagram path/to/diagram.svg output.gif

Useful flags:

animate-diagram input.svg output.gif --frames 12 --dash-length 6 --gap-length 6 --step 2 --duration 80

Renderer selection (default is Chromium for better font fidelity):

animate-diagram input.svg output.gif --renderer chromium
animate-diagram input.svg output.gif --renderer cairosvg

License

MIT. See LICENSE.