π΅ Try it out here π΅
TOC
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