DOCSEARCHbyAlgolia
Submit Docs

AutoFigure

repository·main·Indexed 23 days ago

https://github.com/researai/autofigure

An AI-powered system for generating and refining publication-ready scientific illustrations from text descriptions, research papers (PDF/Markdown), or content files. It utilizes LLMs and an iterative Review-Refine loop to produce figures in SVG or mxGraphXML formats, with optional AI image enhancement for high-quality aesthetic variants.

Tokens
25.6K
Snippets
49
Records
130
Agent score
82%

What's inside autofigure

  1. Core features of Next AI Draw.io

    main

    Next AI Draw.io is an AI-driven diagramming tool that integrates with draw.io. Key capabilities include:

    • LLM-driven creation: Create and modify draw.io diagrams using natural language commands.
    • Image-to-diagram: Upload existing diagrams or images for the AI to replicate or enhance.
    • Document-to-diagram: Upload PDF or text files to extract content and generate diagrams from them.
    • Cloud Architecture Support: Specialized support for generating AWS, GCP, and Azure architecture diagrams.
    • Animated Connectors: Create dynamic animations between diagram elements for better visualization.
    • Version History: Full version control to track changes and restore previous diagram states.
    • AI Reasoning Visibility: View the thinking process of supported models (e.g., OpenAI o1/o3, Gemini, Claude).

  2. AutoFigure Project Structure

    main

    The project is organized into several key components:

    • autofigure/: The Python SDK containing the core logic (agent.py, generator.py, enhancer.py, and extractor.py).
    • frontend/: The Next.js Web UI.
    • backend/: The Flask API Server.
    • scripts/: Utility scripts.
    • pyproject.toml: Project configuration.

  3. Understand the Draw.io XML Hierarchy

    main

    A Draw.io (diagrams.net) XML file follows a specific nested hierarchy. To create a valid diagram, you must follow this structure:

    1. <mxfile>: The root element.
    2. <diagram>: Represents a single page/diagram within the file.
    3. <mxGraphModel>: Contains the actual diagram data and configuration.
    4. <root>: The container for all cells.
    5. <mxCell>: The individual building blocks (shapes, connectors, text, etc.).

    CRITICAL RULE: All mxCell elements must be direct children of the <root> element. You must never nest one mxCell inside another mxCell in the XML structure; instead, use the parent attribute to establish relationships.

    <mxfile>
  <diagram>
    <mxGraphModel>
      <root>
        <mxCell /> <!-- Cells that make up the diagram -->
      </root>
    </mxGraphModel>
  </diagram>
</mxfile>

  4. How AI Provider Auto-Detection works

    main

    The system uses the following logic to determine which provider to use:

    • Single Key: If you only configure one provider's API key, the system automatically detects and uses that provider. You do not need to set AI_PROVIDER.
    • Multiple Keys: If you configure multiple API keys, you must explicitly set the AI_PROVIDER environment variable to one of the following: google, openai, anthropic, deepseek, siliconflow, azure, bedrock, openrouter, or ollama.
    AI_PROVIDER=google

  5. Use AI image enhancement for figures

    main

    Enable enable_enhancement=True to generate high-quality, beautified image variants of your generated figure.

    Enhancement Modes (enhancement_input_type):

    • 'none': Direct beautification without code reference.
    • 'code': Uses the generated SVG/XML code as a reference.
    • 'code2prompt' (Recommended): Uses an LLM to analyze the code and generate a detailed prompt for the enhancement model.

    You can specify the art_style and the number of variants via enhancement_count.

    from autofigure import AutoFigureAgent, Config

config = Config(
    generation_api_key="your-api-key",
    generation_model="google/gemini-3.1-pro-preview",

    # Enhancement settings
    enhancement_api_key="your-enhancement-api-key",
    enhancement_provider="openrouter",
    enhancement_model="google/gemini-3.1-flash-image-preview",
    enhancement_input_type="code2prompt",  # 'none', 'code', 'code2prompt'
    enhancement_count=3,  # Generate 3 enhanced variants
    art_style="Modern scientific illustration with clean lines and professional colors",
)

agent = AutoFigureAgent(config)

result = agent.generate(
    description="Neural network architecture diagram",
    enable_enhancement=True,
    enhancement_count=3,  # Can override config at call time
)

if result.success:
    print(f"Preview: {result.preview_path}")
    print(f"First enhanced: {result.enhanced_path}")
    print(f"All enhanced images ({len(result.enhanced_paths)}):")
    for path in result.enhanced_paths:
        print(f"  - {path}")

  6. Implement Grouping, Swimlanes, and Tables

    main

    Grouping

    To group elements, create a parent mxCell (e.g., with style="group") and set the parent attribute of the child cells to the group's ID.

    Swimlanes

    Swimlanes use style="swimlane;...". IMPORTANT: While children (steps) are nested under the swimlane via the parent attribute, edges (connectors) must be siblings of the swimlane under <root>, not nested inside it.

    Tables

    Tables are constructed using a container cell with style="shape=table;..." and child cells representing rows or columns using shape=tableRow or similar, with the parent attribute pointing to the table container.

    <!-- Swimlane Example -->
<root>
  <mxCell id="0"/>
  <mxCell id="1" parent="0"/>
  <!-- Swimlane -->
  <mxCell id="lane1" value="Frontend" style="swimlane;startSize=30;" vertex="1" parent="1">
    <mxGeometry x="40" y="40" width="200" height="300" as="geometry"/>
  </mxCell>
  <!-- Step inside lane1 -->
  <mxCell id="step1" value="Send Request" style="rounded=1;" vertex="1" parent="lane1">
    <mxGeometry x="20" y="60" width="160" height="40" as="geometry"/>
  </mxCell>
  <!-- Edge (Sibling of lane1, NOT nested in step1) -->
  <mxCell id="edge1" style="edgeStyle=orthogonalEdgeStyle;endArrow=classic;" edge="1" parent="1" source="step1" target="step2">
    <mxGeometry relative="1" as="geometry"/>
  </mxCell>
</root>

  7. How Next AI Draw.io works

    main

    Next AI Draw.io is a Next.js application that integrates AI capabilities with draw.io diagrams.

    Core Mechanism:

    • Diagram Representation: Diagrams are represented as XML that can be rendered by draw.io.
    • AI Interaction: The AI processes natural language commands and generates or modifies this XML to create, update, or enhance diagrams.
    • Tech Stack: Built using Next.js, Vercel AI SDK (for streaming responses and multi-provider support), and react-drawio (for diagram manipulation).

  8. Follow AutoFigure trademark and branding guidelines

    main

    When using the AutoFigure name, logo, or branding, you must ensure your use does not confuse users regarding the official source, sponsorship, or status of the project. These guidelines are separate from the software license and focus on branding and naming.

    Generally Allowed Use

    You can use the name AutoFigure for factual reference without permission:

    • Referencing the project: Built with AutoFigure.
    • Indicating origin: This project is a fork of AutoFigure.
    • Indicating compatibility: Compatible with AutoFigure SVG output.
    • Linking to official repositories, papers, or documentation.
    • Discussing, reviewing, or benchmarking the project.

    Prohibited/Restricted Use

    Do not use branding in ways that imply official status or endorsement by ResarAI without permission. Avoid:

    • Presenting a fork or hosted service as the "official" project.
    • Using the AutoFigure logo as the primary brand for a third-party product.
    • Using names like Official AutoFigure Cloud or AutoFigure Enterprise for unrelated services.
    • Registering domain names or package names that imply you are the official offering.
    • Implying endorsement, certification, or partnership by ResarAI.

    Guidelines for Forks and Modified Versions

    You are free to fork and modify the code under the existing software license. If distributing a modified version, clearly state its status using patterns like:

    • ProjectName, based on AutoFigure
    • AutoFigure fork by <your org>
    • Modified AutoFigure build for internal use

    If a fork becomes a distinct public product, it is strongly preferred that you adopt your own primary product name and branding.

    Citation and Attribution

    If AutoFigure is used in a paper, report, or public artifact, you are strongly encouraged to cite the AutoFigure paper and disclose the use of AI assistance.

    Contact for Permissions

    Contact resear.ai@gmail.com for:

    • Commercial use of the AutoFigure logo.
    • Using the name for a public hosted service.
    • Co-branding or partnership requests.

  9. Acknowledge AutoFigure assistance

    main

    When AutoFigure materially assists a project, it is suggested to include an acknowledgment in your work. You can adapt the following text to match your venue's norms:

    "We used AutoFigure to assist parts of the figure-generation workflow, including selected drafting, refinement, and/or evaluation of scientific illustrations. Final scientific claims, reported results, and publication decisions remain the responsibility of the human authors."

    We used AutoFigure to assist parts of the figure-generation workflow, including selected drafting, refinement, and/or evaluation of scientific illustrations. Final scientific claims, reported results, and publication decisions remain the responsibility of the human authors.

  10. Run the AutoFigure Web Interface

    main

    For an interactive visual experience for generating and editing figures, use the provided shell script to start the web interface.

    ./start.sh

    After running, open http://localhost:6002 in your browser.

    ./start.sh
# Then open http://localhost:6002 in your browser

  12. Deploy Next AI Draw.io offline using Docker Compose

    main

    To deploy Next AI Draw.io in an offline environment, you must self-host draw.io to replace the default embed.diagrams.net dependency. This is achieved by running a jgraph/drawio container and configuring the frontend to point to it.

    Setup Steps

    1. Clone the repository and define your API keys in a .env file.
    2. Create a docker-compose.yml file with the following configuration:
    services:
  drawio:
    image: jgraph/drawio:latest
    ports: ["8080:8080"]
  next-ai-draw-io:
    build:
      context: .
      args:
        - NEXT_PUBLIC_DRAWIO_BASE_URL=http://localhost:8080
    ports: ["3000:3000"]
    env_file: .env
    depends_on: [drawio]
    1. Run docker compose up -d.
    2. Access the application at http://localhost:3000.