Dugong
Dugong is a simple, un-sexy, mind-mapping application. If you squint - or if you’ve spent too long at sea - it might look a bit like a mermaid.
Dugong lets you quickly turn a list like this:
1 | Sandwiches |
2 | Egg-related |
3 | Egg and cress |
4 | Fried egg-chilli-chutney |
5 | Meaty |
6 | Chicken |
7 | Ham and cheese |
8 | Vegetarian |
9 | Salad? |
10 | Other misc. |
into an SVG image like this:
Even better: Dugong will do this automatically, inline, in your browser. Simply include the library somewhere on your page, and then call it:
1 | Dugong.populate("dugong") //Turn any element with a class "dugong" into a diagram |
Your mind maps are so ugly!
Good thing these mind maps are stylable then!
1 | /*Let's style the root*/ |
2 | svg.dugong.gen-0{ stroke-width: 4; } |
3 | |
4 | /*Connecting lines to first children are dashed*/ |
5 | line.gen-1{ stroke-dasharray: 10 10; } |
6 | |
7 | /*etc. etc.*/ |
Or maybe you want to edit some of the more basic properties of your mind-map, like:
1 | Dugong.stalkLength = 100; // Distance between nodes |
2 | Dugong.boxMinHeight = 50; // How big are the smallest boxes? |
3 | Dugong.boxRatio = 2; // Width-to-height ratio of boxes. |
4 | Dugong.canvasMargin = 100; //Margin around outside of map |
5 | Dugong.boxMargin = 10; //Margin inside each box |
(Just run these before populating.)
Can I include this in my thing?
That’s kind of why I put it on the internet. If it’s public, feel free to credit me! It does the ego good. (Actually, if you do use this, I’d love to know. Drop me a line!)
Can I modify this?
Sure! I’d love to know what you’ve done with it. Unless you did something terrible with it. No one needs to see that.