TikZ Editor v0.4.0 Release

TikZ Editor v0.4.0 Release

TikZ Editor v0.4.0 provides a what-you-see-is-what-you-get (WYSIWYG) interface for creating and editing TikZ diagrams in LaTeX. This tool eliminates the need for the traditional compile-and-check cycle by allowing users to drag elements, resize objects, and modify styles visually, with the underlying TikZ code updating in real-time.

Real-Time Visual Editing and Code Synchronization

TikZ Editor allows users to modify figures visually while maintaining a direct link to the source code. Instead of manually adjusting coordinates in the LaTeX source, users can drag paths or nodes to new locations, and the app instantly updates the coordinates in the code.

Key capabilities include:

  • Direct Manipulation: Users can move, resize, rotate, duplicate, and flip objects directly on the canvas.
  • Source Preservation: The editor updates the TikZ code using small patches rather than rewriting the entire file in a canonical format, which preserves the user's original indentation, line breaks, and formatting.
  • Integrated Source Editor: The source panel features syntax highlighting, code folding for scopes, and inline color swatches and number scrubbing for quick adjustments without typing.

Comprehensive Toolset for Diagramming

The editor provides a wide array of tools to build complex idiomatic TikZ figures, ranging from basic shapes to advanced structures:

Drawing Tools

  • Basic Elements: Tools for adding nodes, rectangles, circles, ellipses, and straight lines or arrows.
  • Advanced Paths: Support for Bezier curves, multi-segment paths, and freehand drawing with smoothing.
  • Advanced Layouts: Tools for creating matrices of nodes, grids, and complex shapes from the shape library (e.g., diamonds, stars, clouds).

Layout and Precision

  • Snapping and Alignment: The app includes snapping to grids, guides, object points, and gaps, alongside rulers and a magnifying glass tool for fine-tuning.
  • Grouping and Distribution: Multi-selection allows users to group objects using TikZ scopes and use align and distribute functions to ensure consistent spacing.

Multi-Figure and Document Support

TikZ Editor can open entire .tex paper files, allowing users to navigate between multiple tikzpicture environments using thumbnail previews. The app is designed to understand many custom macros, making it compatible with a broader range of academic papers.

Import and Export Capabilities

To facilitate the transition from other tools, TikZ Editor supports a variety of import and export formats:

  • Imports: Users can import figures from SVG, Ipe (.ipe), and PowerPoint (.pptx). The desktop version also supports pasting objects directly from PowerPoint and Keynote.
  • Exports: Figures can be exported to SVG, PNG, PDF, or standalone LaTeX code.

Technical Implementation

Built with TypeScript and Tauri (with a Rust backend for the desktop version), TikZ Editor uses a semantic layer to resolve coordinates, styles, and loops into editable scene elements.

Parsing and Rendering

  • TeX Parsing: The app parses frequently used TikZ commands to build an internal representation. Because it does not use a standard TeX compiler, it can provide instant diagnostics and error highlighting.
  • Text and Math: Rendering is handled via MathJax. To ensure visual fidelity with LaTeX, the app implements the TeX hyphenation algorithm and the Knuth-Plass line-breaking algorithm for multi-line text.
  • Color Conversion: A custom color picker converts RGB values to the closest representable xcolor strings (e.g., converting a hex code to violet!88!white!45!green).

AI Integration

The desktop version integrates with OpenAI Codex via the Codex App Server, allowing users to ask an AI assistant to edit figures directly within the app using TikZ-specific tools.

Availability

TikZ Editor is free and open source under the MIT license. It is available as a web application and as a lightweight desktop application.

Sources