API
Create instance
The library uses an OOP paradigm and allows you to create multiple instances.
mmp.create(id, [options])
Creates a mmp instance. Draw the mind map creating an svg element with the root node within the div element with id equal to the id string passed as parameter. You can optionally pass various options as the following example:
var map = mmp.create("map", {
fontFamily: "Arial, Helvetica, sans-serif",
centerOnResize: true,
drag: false,
zoom: false,
defaultNode: {
name: "Default node name",
image: {
src: "",
size: 60
},
colors: {
name: "#787878",
background: "#f9f9f9",
branch: "#577a96"
},
font: {
size: 16,
style: "normal",
weight: "normal"
},
locked: true
},
rootNode: {
name: "Default root node name",
image: {
src: "",
size: 70
},
colors: {
name: "#787878",
background: "#f0f6f5",
branch: ""
},
font: {
size: 20,
style: "normal",
weight: "normal"
}
}
});
You can change these options later using the function map.updateOptions.
Library version
mmp.version
Contains the version of the current used mmp library.
Remove instance
map.remove()
Removes the map instance and the svg element of the mind map.
New map
map.new([map])
Creates a new empty mind map. If map is specified, creates a new mind map using mmp json structure. The map parameter must be a JSON-like object, here an example. The function map.exportAsJson is available to obtain the json of a map.
Zoom in
map.zoomIn([duration])
Zooms in the mind map. If duration (int, milliseconds) is specified, sets the duration of the zoom animation.
Zoom out
map.zoomOut([duration])
Zooms out the mind map. If duration (int, milliseconds) is specified, sets the duration of the zoom animation.
Update options
map.updateOptions(property, value)
Updates the option property (string, "fontFamily", "centerOnResize", "drag", "zoom", "defaultNode", "rootNode") with the relative value passed as parameter.
Export as JSON
map.exportAsJson()
Returns a json with the structure of the current mind map.
Export as image
map.exportAsImage(callback, [type])
Calls the callback passing the URI of the map image as parameter. The type (string) optional parameter is the standard MIME type for the image format to return. If you do not specify this parameter, the default value is a PNG format image.
Undo
map.undo()
Allows to reverse the last one change.
Redo
map.redo()
Repeats a previously undoed change.
History
map.history()
Return all snapshots of the map.
Center
map.center([type], [duration])
Places the root node in the middle of the map and sets the zoom to the original state. If type (string, "position" or "zoom") is specified, updates only the location or updates only the zoom. If duration (int, milliseconds) is specified, sets the duration of the center animation.
Events
map.on(event, callback)
Calls the callback of the related event passing some parameters.
Events | Callback parameters |
---|---|
create | (nothing) |
center | (nothing) |
undo | (nothing) |
redo | (nothing) |
exportJSON | (nothing) |
exportImage | (nothing) |
zoomIn | (nothing) |
zoomOut | (nothing) |
nodeSelect | (node*) |
nodeDeselect | (nothing) |
nodeUpdate | (node*) |
nodeCreate | (node*) |
nodeRemove | (node*) |
*node properties:
{
id: string;
parent: string;
k: number;
name: string;
coordinates: {
x: number;
y: number;
};
image: {
src: string;
size: number;
};
colors: {
name: string;
background: string;
branch: string
};
font: {
size: number;
style: string;
weight: string
};
locked: boolean;
}
Add node
map.addNode([properties], [id])
Adds a node in the map. The added node will be the child of the current selected node. If properties is specified, adds the node with those node properties. If id is not specified, adds the node as child of the selected node.
Properties:
{
name: string;
coordinates: {
x: number;
y: number;
};
image: {
src: string;
size: number;
};
colors: {
name: string;
background: string;
branch: string
};
font: {
size: number;
style: string;
weight: string
};
locked: boolean;
}
Select node
map.selectNode([id])
Selects the node with the id (string) passed as parameter or the position ("left", "right", "down", "up"). If the id is not specified returns the current selected node.
Edit node
map.editNode()
Focus on the text of the selected node.
Deselect node
map.deselectNode()
Deselects the selected node. The deselection is the same as selecting the root node without highlighting.
Update node properties
map.updateNode(property, value, [graphic], [id])
Updates the node property (string, "name", "locked", "coordinates", "imageSrc", "imageSize", "backgroundColor", "branchColor", "fontWeight", "fontStyle", "fontSize", "nameColor") with the relative value passed as parameter. If graphic (boolean) is specified and is true, update only graphically the node. If id is not specified, update the selected node.
Remove node
map.removeNode([id])
Removes the selected node or if id (string) is specified, removes the node with the id passed as parameter.
Copy node
map.copyNode([id])
Copies a node with his children in the mmp clipboard. If id is not specified, copies the selected node.
Cut node
map.cutNode([id])
Removes and copy a node with his children in the mmp clipboard. If id is not specified, copies the selected node.
Paste node
map.pasteNode([id])
Paste the node of the mmp clipboard in the map. If id is not specified, paste the nodes of the mmp clipboard in the selected node.
Node children
map.nodeChildren([id])
Return the children of the node specified with id. If id is not specified, return the children of the selected node.