kongkongyo/Ai-Markmap

What it solves

Reading long articles, news, or notes and pulling out the main structure is time-consuming. AiMarkmap lets you paste raw text or a topic, and a large language model (LLM) automatically extracts the key points and organizes them into a clear, interactive mind map — no backend, no installation, no external framework.

How it works

You open a single index.html file in any modern browser. You configure an API endpoint (any service that supports the OpenAI chat/completions format, including self-hosted models) and provide your API key. Then you type a topic or paste content, optionally pick how many alternative mind-map versions you want (1–5), and click generate. The app sends your content (plus an editable prompt template) to the LLM, receives a structured Markdown outline, and renders it as an interactive mind map. You can edit the Markdown on the left and see the map update live, right-click any node to edit or delete it, switch between generated versions, and export the result as PNG or SVG with a smart filename derived from the central topic. Everything — including your API key — stays in your browser's localStorage; nothing is uploaded to any server.

Who it’s for

Anyone who frequently needs to digest long-form text — journalists, students, researchers, product managers, or general knowledge workers. It is especially useful for quickly summarizing news, analyzing article structures, or organizing meeting notes. Since it requires configuring an API key, it suits users who already have access to an OpenAI-compatible LLM service or are willing to use a free-tier provider like SiliconFlow (mentioned in the README).

Highlights

• Zero dependency, pure frontend: A single HTML file; open it directly in a browser — no build step, no server, no npm install.
• AI-generated mind maps: Paste any text or topic, and the LLM creates a structured, visual map of the key ideas.
• Multiple versions at once: Use a slider to generate 1–5 different map styles/structures and pick the best one.
• Real-time editing: Edit the Markdown source on the left; the map updates instantly. Right-click nodes to edit or delete them.
• Bring your own LLM: Works with any OpenAI-compatible API endpoint, including self-hosted models; auto-queries available models or accepts custom model names.
• Customizable prompts: Modify the AI instruction template via a dedicated settings panel (must keep {{CONTENT}} placeholder).
• Smart export: Export high-resolution PNG or SVG files with filenames like topic_timestamp.png/svg.
• Mobile friendly: Full support for phones and tablets, with a bottom tab bar, hamburger menu, and landscape preview.
• Privacy: All configuration and API keys are stored only in your local browser's localStorage.
• Over 90% of code written by AI: The project itself is an interesting example of AI-assisted development, with most HTML, CSS, and JavaScript generated and refactored by models like GPT-4o-mini, Gemini 2.5 Pro, and Claude 3.7 Sonnet.
• Keyboard shortcuts: Quick actions like Ctrl+Enter to generate, F11 for fullscreen, Ctrl+S to export PNG, and arrow keys to switch versions.