Show HN: Diagram as code tool with draggable customizations
6 months ago
- #diagramming
- #Rust
- #Mermaid
- Oxdraw aims to simplify the creation and maintenance of high-quality diagrams using a declarative and reproducible syntax.
- Diagrams are written in Mermaid syntax, with a web interface for fine-tuning positions, paths, colors, and styling.
- Visual tweaks are saved back to the source file as declarative code, ensuring determinism and version control.
- Changes are stored as comments in Mermaid files to maintain compatibility with other Mermaid tools.
- The project combines a Rust CLI for compiling .mmd files into images and a React-based web interface for editing.
- Motivation stems from the limitations of Mermaid in detailed editing, prompting a move to tools like Lucidchart.
- Oxdraw seeks to merge the benefits of code-generated diagrams with the customizability of traditional diagram software.
- Installation and usage instructions are provided, including command-line flags for input, output, and editing.
- Interactive editor features include node and edge styling, control points, and canvas interactions like dragging and nudging.
- The path drawing algorithm is discussed, highlighting preferences for clarity and the potential for future improvements.