🔵 Try it out here 🔵

TOC

• Features
• Use cases
• How to install
• Screenshots
• Alternatives

Features

• Self-hostable
  • It is fully self-contained (one HTML file, one JS file, and one CSS file) with no backend required
• Very fast
  • It uses WebGL and optimised JavaScript
  • Alternatives tend to use SVG or very abstract (and inefficient) libraries, which don't scale well for thousands of nodes
• Very robust
  • Browsers tend to unload WebGL after a long time if you change tabs - you can still save or export your data if this occurs
• Import and export (as JSON files)
• Layout is automatically generated
  • Nodes never overlap
  • Nodes scale according to the size available to them and their descendants
• Nodes can be moved from one 'parent' to another
• Nodes can also have 'adopted siblings'
• Nodes can have custom background colours
  • It can be inherited from parents
• RegEx and normal search

Uses

What this software is for:

• To represent huge mindmaps
• To represent mindmaps that are not simple trees
  • Which have parent, child and 'adopted sibling' relations
• It feels most natural when nodes have titles
  • Each node only displays its first line of text, until it is clicked on

What this software lacks:

• Presentation style
  • It only renders Unicode characters
  • It's not pretty enough for PowerPoint presentations
• Version control

Installation

Copy mindmap.html, mindmap.js and mindmap.css, and access mindmap.html directly in a browser (file:///path/to/mindmap.html) or serve them from any file server.

Example

Alternatives

🟢 Feature that my project does not have
🟡 Rare feature that it shares with my project
🔴 Failure that my project does not have

• MindmapTree • Code • Example
  • 🟢 Click and drag
  • 🟢 Undo/redo
  • 🔴 Uses SVG, so:
    • 🔴 it cannot handle thousands of nodes
  • 🔴 Limited to left-right line
  • 🔴 Awkward to display many nodes
• Mindmap by Awehook Code Example
  • 🟢 Collapse/expand branches
  • 🟢 Flowcharts
  • 🔴 Nodes are HTML <div>s, so it has the downsides of svg and more limitations on functionality
• TeamMapper • Code • Example
  • 🟢 Allows simultaneous collaborative editing
  • 🟢 Inline images, colours, and hyperlinks
  • 🟢 Undo/redo
  • 🟢 Export to image
  • 🔴 Requires backend server
  • 🔴 More fragile (breaks with too many nodes, lags due to server synchronisation)
• MarkMap • Code • Example
  • 🔴 Uses SVG, so:
    • 🔴 it cannot handle thousands of nodes
  • 🟢 Converts MarkDown text into a mindmap, so:
    • 🟢 it can be used with version control utilities (e.g. git)
    • 🟢 it can place inline HTML (tables, LaTex) into the mindmap
  • Similar to dundalek's MarkMap but serves the opposite purpose
  • Similar to a Obsidian plugin
• MyMind by Ondřej Žára • Code • Example
  • 🟢 Nodes can do basic math operations
  • 🟢 Undo/redo
  • 🟢 Export to image
  • 🟢 Collapse/expand branches
  • 🔴 Uses SVG, so:
    • 🔴 it cannot handle thousands of nodes
    • 🟢 it supports rich text formatting (hyperlinks, colours)
• Mindmaps by David Richard • Code • Example
  • 🟢 Undo/redo (but undo sometimes fails)
  • 🔴 Uses SVG, so:
    • 🔴 it cannot handle thousands of nodes
  • 🔴 No ability to save your changes when SVG crashes (to save RAM, browsers often unload SVG/WebGL assets without unloading the page)
  • Can import from this, using import-from-mymind.py
• Minder • Code
  • 🟡 Nodes can have 'adopted siblings'
  • 🟢 Undo/redo
  • 🟢 Can place text on lines
  • 🟢 Import from many different formats
  • 🟢 Export to image or markdown
  • 🟢 Some stylisation options for nodes
  • 🔴 Native app
    • Less portable, but presumably handles large mindmaps better than the other alternatives
• MindMup • Code • Example
• Neurite • Code • Example
  • For visualising mathematical systems