Introduction to Simple Mind Map
The Simple Mind Map project provides a comprehensive solution for creating and managing mind maps on the web. It is both simple and powerful, offering a versatile approach to mind mapping with a focus on ease of use and flexibility.
Project Components
The project is divided into two primary components:
-
JavaScript Mind Map Library
This standalone library does not depend on any specific framework, making it easy to integrate into web projects for the rapid development of mind mapping products. Detailed documentation is available, guiding developers in implementation and customization. -
Web-Based Mind Map Application
Built using the mind map library, along with Vue2.x and ElementUI, this application can handle local file operations on a computer. It serves as both an online mind mapping tool and a base for further development and self-hosting.
Availability and Access
- Online Version: The most recent features and updates can be accessed through the online version.
- Client Downloads: For those who prefer offline capabilities, client versions are available for Windows, Mac, and Linux. These can be downloaded via GitHub or Baidu Cloud. Note that client versions may lag behind the online version.
Features
- Modular Architecture: Core functionality is enhanced by optional plugins, reducing unnecessary package size.
- Versatile Diagram Support: Includes various diagram structures such as logical, organizational, timeline, and fishbone diagrams.
- Customizable Themes: Users can select from built-in themes or create new ones, ensuring visual consistency or creativity as needed.
- Rich Node Content: Support for text (standard and rich), images, icons, hyperlinks, comments, labels, summaries, and mathematical formulas.
- Interactive and Responsive: Features like drag-and-drop nodes, varied node shapes, custom node content, canvas zoom and pan, and multiple node selection methods enhance user interaction.
- Import and Export Options: Includes support for diverse formats such as JSON, PNG, SVG, PDF, Markdown, XMind, and TXT.
- Collaboration and Presentation: Allows for collaborative editing and includes presentation mode for streamlined project sharing and demonstration.
Available Plugins
The project offers a wide array of plugins for additional functionality. Users can choose specific plugins according to their needs, including RichText, Drag, Export, MiniMap, Watermark, and more. Some plugins are available for purchase, enhancing the library’s capability with special features.
Installation
To incorporate the Simple Mind Map into a project, use the following npm command:
npm i simple-mind-map
Usage Example
To get started, create a container with non-zero dimensions and apply basic CSS:
<div id="mindMapContainer"></div>
#mindMapContainer * {
margin: 0;
padding: 0;
}
Instantiate a mind map with:
import MindMap from "simple-mind-map";
const mindMap = new MindMap({
el: document.getElementById("mindMapContainer"),
data: {
data: {
text: "Root Node",
},
children: [],
},
});
For more advanced configurations and options, refer to the developer documentation.
Supporting and Contact
If you appreciate the simplicity and utility of Simple Mind Map, please consider starring the project on GitHub. Contributions and discussions are welcomed through the GitHub issues section. For custom development needs, the team offers paid service options catering to bespoke requirements.
Simple Mind Map embodies a commitment to providing accessible and robust mind mapping tools, continually evolving with community support and participation.