EasyMind is a D3.js powered svg concept mapping tool.
It's mainly written in D3.js and jQuery.
EasyMind is entirely client-side, so you can simply download and run it locally by clicking on index.html (be aware that when you run it locally, the saving as png function loses some style control).
It can also be accessed on GitHub page (RECOMMENDED).
- Add / Delete a node
- Hover on a node and you will see a green button (add a child node) and a red button (delete the current node)
- You can also delete a node by clicking on it and pressing the delete key
- Edit text
- Click on the text in the node to edit it
- Style text / node
- Style text and node by clicking on options in the navbar
- Save as png
- Save the map in png format by clicking on the image icon in the navbar
- Drag and Zoom
- Technical Help: Christopher MacLellan
- Paper Prototyping: Yining Zhao and Shaun Burley
- User Testing: Zhihong Guo
http://www.d3noob.org/2014/01/tree-diagrams-in-d3js_11.html
http://stackoverflow.com/questions/17558649/d3-tree-layout-separation-between-nodes-using-nodesize
https://gist.github.com/GerHobbelt/2653660
https://coderwall.com/p/psogia/simplest-way-to-add-zoom-pan-on-d3-js
http://stackoverflow.com/questions/17435280/resetting-zooming-properties-d3
http://stackoverflow.com/questions/5447312/jquery-event-handler-only-works-for-first-element
http://stackoverflow.com/questions/14354040/jquery-1-9-live-is-not-a-function
http://stackoverflow.com/questions/20211890/svg-change-fill-color-on-button-click
https://bgrins.github.io/spectrum/
http://stackoverflow.com/questions/1636842/svg-get-text-element-width
http://stackoverflow.com/questions/3216013/get-the-last-item-in-an-array
http://stackoverflow.com/questions/20797521/increasing-gap-between-nodes-of-my-d3-tree-layout
http://stackoverflow.com/questions/21248641/how-do-i-get-the-event-keycode-of-the-delete-key
http://stackoverflow.com/questions/11786023/how-to-disable-double-click-zoom-for-d3-behavior-zoom