Options
jsMind provides various options to customize the behavior and appearance of mind maps.
General Options
| Option Name | Data Type | Default Value | Description | Details |
|---|---|---|---|---|
| container | string | ’’ | [Required] ID of the container | Details |
| editable | bool | false | Whether editing is enabled | Details |
| log_level | string | ‘info’ | Log level | Details |
| mode | string | ‘full’ | Layout mode | Details |
| support_html | bool | true | Whether HTML elements in nodes are supported | Details |
| theme | string | null | Theme | Details |
View Options
| Option Name | Data Type | Default Value | Description | Details |
|---|---|---|---|---|
| custom_line_render | function | null | Custom line rendering method (Since 0.8.4) | Details |
| custom_node_render | function | null | Custom node rendering method (Since 0.7.6) | Details |
| draggable | bool | false | Whether dragging the canvas is allowed | Details |
| enable_device_pixel_ratio | bool | false | Render high-definition mind maps according to device pixel ratio (Since 0.8.5) | Details |
| engine | string | ‘canvas’ | Rendering engine for lines between nodes | Details |
| expander_style | string | ‘char’ | Style of the child node expander (Since 0.7.8) | Details |
| hide_scrollbars_when_draggable | bool | false | Whether to hide scrollbars when draggable is true | Details |
| hmargin | number | Container’s width | Minimum horizontal distance between the mind map and the container’s outer frame (in pixels) | Details |
| line_color | string | ‘#555’ | The color of the mind map lines (HTML color notation) | Details |
| line_style | string | ‘curved’ | The style of the mind map lines, curved or straight | Details |
| line_width | number | 2 | The thickness of the mind map lines (in pixels) | Details |
| node_overflow | string | ‘hidden’ | Style when node text is too long (Since 0.5.3) | Details |
| vmargin | number | Container’s height | Minimum vertical distance between the mind map and the container’s outer frame (in pixels) | Details |
| zoom | object | {min: 0.5, max: 2.1, step: 0.1} |
Zoom configuration (Since 0.6.3) | Details |
Layout Options
| Option Name | Data Type | Default Value | Description | Details |
|---|---|---|---|---|
| cousin_space | number | 0 | Extra vertical space between adjacent nodes’ children (Since 0.5.5) | Details |
| hspace | number | 30 | Horizontal space between nodes | Details |
| pspace | number | 13 | Horizontal space between nodes and connection lines | Details |
| vspace | number | 20 | Vertical space between nodes | Details |
Shortcut Options
| Option Name | Data Type | Default Value | Description | Details |
|---|---|---|---|---|
| enable | bool | true | Whether shortcuts are enabled | Details |
| handles | object | {} |
Named shortcut event handlers | Details |
| mapping | object | {addchild: [45, 4096 + 13], addbrother: 13, editnode: 113, delnode: 46, toggle: 32, left: 37, up: 38, right: 39, down: 40} |
Shortcut mappings | Details |
Plugin Options
| Option Name | Data Type | Default Value | Description | Details |
|---|---|---|---|---|
| plugin | object | {} |
Options for plugins | Details |
Default Options Code
options = {
container: '', // [Required] ID of the container
editable: false, // Whether editing is enabled
theme: null, // Theme
mode: 'full', // Layout mode
support_html: true, // Whether HTML elements in nodes are supported
log_level: 'info', // Log level
view: {
engine: 'canvas', // Rendering engine for lines between nodes
hmargin: 100, // Minimum horizontal distance from the container
vmargin: 50, // Minimum vertical distance from the container
line_width: 2, // Width of the lines
line_color: '#555', // Color of the lines
line_style: 'curved', // Style of the lines, straight or curved
custom_line_render: null, // Custom line rendering method
draggable: false, // Whether dragging the canvas is allowed
hide_scrollbars_when_draggable: false, // Whether to hide scrollbars when draggable is true
node_overflow: 'hidden', // Style when node text is too long
enable_device_pixel_ratio: false, // Render high-definition mind maps according to device pixel ratio
expander_style: 'char', // Style of the child node expander
zoom: { // Zoom configuration
min: 0.5, // Minimum zoom ratio
max: 2.1, // Maximum zoom ratio
step: 0.1, // Zoom ratio step
},
custom_node_render: null, // Custom node rendering method
},
layout: {
hspace: 30, // Horizontal space between nodes
vspace: 20, // Vertical space between nodes
pspace: 13, // Horizontal space between nodes and connection lines
cousin_space: 0, // Extra vertical space between adjacent nodes' children
},
shortcut: {
enable: true, // Whether shortcuts are enabled
handles: {}, // Named shortcut event handlers
mapping: { // Shortcut mappings
addchild: [45, 4096 + 13], // <Insert>, <Ctrl> + <Enter>
addbrother: 13, // <Enter>
editnode: 113, // <F2>
delnode: 46, // <Delete>
toggle: 32, // <Space>
left: 37, // <Left>
up: 38, // <Up>
right: 39, // <Right>
down: 40, // <Down>
}
},
plugin: {}, // Options for plugins
};
copyright notice
Reproduction and deduction are prohibited.
The jsMind project is still being updated and the corresponding documentation is updated at the same time as the version is updated. In order to avoid confusion to the user, it is forbidden to reprint this document without written permission and to make changes of any kind to this document.