Mind Map Generator - Small Study Tools
Mind Map Generator Build a visual mind map starting from a central topic and branching outward into ideas, sub-ideas and details. Drag, organise and connect instantly. Pro Mode adds custom colours, icons, themes, more levels and SVG/PDF export.
● Pro Version is Free for now
(All Base Features)
(Unlock All Features)
Pro Mode active — custom colours, icons, themes, more branch levels & SVG/PDF export unlocked
Click a node and use the green + button to add a branch
Privacy Guaranteed — Your mind map is saved only in your browser. Nothing is sent to any server.
Colour Themes — applies a palette across all branches
Ocean
Sunset
Forest
Candy
Royal
Mono Pick an icon for the selected branch
🧠 Central Topic: —
🌿 Branches: 0
📊 Max Depth: 0
`;
const blob = new Blob([html],{type:'text/html'});
const a=document.createElement('a'); a.download='smallstudytools-mindmap-print.html'; a.href=URL.createObjectURL(blob); a.click();
toast('Print-ready file downloaded — open it to save as PDF');
}function downloadOutlineTXT() {
if (!nodes.length) { toast('Add some branches first'); return; }
function buildOutline(parentId, indent) {
const children = nodes.filter(n=>n.parentId===parentId);
let lines = [];
children.forEach(c => {
lines.push(' '.repeat(indent) + '- ' + c.label);
lines = lines.concat(buildOutline(c.id, indent+1));
});
return lines;
}
const central = nodes.find(n=>n.id===0);
const lines = ['=== MIND MAP OUTLINE — SmallStudyTools.com ===','', central.label, ...buildOutline(0,1), '', 'Generated by SmallStudyTools.com'];
const blob = new Blob([lines.join('\n')],{type:'text/plain'});
const a=document.createElement('a'); a.download='smallstudytools-mindmap-outline.txt'; a.href=URL.createObjectURL(blob); a.click();
toast('Downloaded outline as TXT!');
}// ── MODE ──────────────────────────────────────────────────────
function setMode(mode) {
isPro = mode==='pro';
document.getElementById('btnSimple').classList.toggle('active',!isPro);
document.getElementById('btnPro').classList.toggle('active',isPro);
document.body.classList.toggle('pro-mode',isPro);
document.getElementById('proModeBar').style.display=isPro?'flex':'none';
document.getElementById('modeHint').textContent=isPro
?'Custom colours, icons, themes, auto-arrange and up to 4 branch levels'
:'Click a node and use the green + button to add a branch';
render();
try{localStorage.setItem(SK+'_mode',mode);}catch(e){}
}function toast(msg){const t=document.getElementById('toast');t.textContent=msg;t.classList.add('show');setTimeout(()=>t.classList.remove('show'),2400);}
function save(){try{localStorage.setItem(SK,JSON.stringify({nodes,nextId}));}catch(e){}}// ── SAMPLE DATA ───────────────────────────────────────────────
function loadSampleData() {
nodes = [
{id:0, parentId:null, x:1000, y:340, w:200, h:70, level:0, label:'Exam Revision Plan', color:'#0d1f3c', icon:''},{id:1, parentId:0, x:760, y:160, w:150, h:54, level:1, label:'Subjects', color:'#1a7fc1', icon:'📚'},
{id:2, parentId:0, x:1230, y:160, w:150, h:54, level:1, label:'Study Methods', color:'#10b981', icon:'💡'},
{id:3, parentId:0, x:760, y:560, w:150, h:54, level:1, label:'Schedule', color:'#f59e0b', icon:'⏰'},
{id:4, parentId:0, x:1230, y:560, w:150, h:54, level:1, label:'Wellbeing', color:'#7c3aed', icon:'❤️'},{id:5, parentId:1, x:540, y:80, w:130, h:46, level:2, label:'Mathematics', color:'#1a7fc1', icon:''},
{id:6, parentId:1, x:540, y:200, w:130, h:46, level:2, label:'Biology', color:'#1a7fc1', icon:''},
{id:7, parentId:1, x:540, y:320, w:130, h:46, level:2, label:'History', color:'#1a7fc1', icon:''},{id:8, parentId:2, x:1480, y:80, w:140, h:46, level:2, label:'Active Recall', color:'#10b981', icon:''},
{id:9, parentId:2, x:1480, y:200, w:140, h:46, level:2, label:'Spaced Repetition', color:'#10b981', icon:''},
{id:10, parentId:2, x:1480, y:320, w:140, h:46, level:2, label:'Past Papers', color:'#10b981', icon:''},{id:11, parentId:3, x:540, y:480, w:140, h:46, level:2, label:'Daily Timetable', color:'#f59e0b', icon:''},
{id:12, parentId:3, x:540, y:600, w:140, h:46, level:2, label:'Deadline Tracker', color:'#f59e0b', icon:''},{id:13, parentId:4, x:1480, y:480, w:130, h:46, level:2, label:'Sleep', color:'#7c3aed', icon:''},
{id:14, parentId:4, x:1480, y:600, w:130, h:46, level:2, label:'Breaks', color:'#7c3aed', icon:''},
];
nextId = 15;
selectedNodeId = 0;
render(); save();
scrollToCentral();
toast('Sample mind map loaded!');
}// ── INIT ──────────────────────────────────────────────────────
function scrollToCentral() {
const central = nodes.find(n=>n.id===0);
if (!central) return;
const canvas = document.getElementById('canvasArea');
const targetLeft = Math.max(0, (central.x + central.w/2) - canvas.clientWidth/2);
const targetTop = Math.max(0, (central.y + central.h/2) - canvas.clientHeight/2);
canvas.scrollLeft = targetLeft;
canvas.scrollTop = targetTop;
}try{
const saved=JSON.parse(localStorage.getItem(SK)||'{}');
if(saved.nodes && saved.nodes.length){ nodes=saved.nodes; nextId=saved.nextId||1; }
else initCentralNode();
const savedMode=localStorage.getItem(SK+'_mode');
if(savedMode==='pro') setMode('pro'); else render();
scrollToCentral();
}catch(e){ initCentralNode(); render(); scrollToCentral(); }
