6.Add the getAncestorNodes method to the node instance to obtain the list of ancestor nodes;
7.Adding mouse events to personnel avatars during collaborative editing;
8.Instantiation and setData methods support passing in empty data;
+
9.Add an instantiation option for adding custom content when exporting images;
Demo:
1.Support configuration of rainbow lines;
2.Add source code editing mode;
+
3.Exporting PNG, PDF, and SVG supports setting custom text at the bottom;
Client:
diff --git a/web/src/pages/Doc/en/constructor/index.md b/web/src/pages/Doc/en/constructor/index.md
index 3026151a..c786f714 100644
--- a/web/src/pages/Doc/en/constructor/index.md
+++ b/web/src/pages/Doc/en/constructor/index.md
@@ -114,8 +114,10 @@ const mindMap = new MindMap({
| isOnlySearchCurrentRenderNodes（v0.9.8+） | Boolean | false | Is it necessary to only search for the current rendered node, and nodes that have been collapsed will not be searched for | |
| onlyOneEnableActiveNodeOnCooperate（v0.9.8+） | Boolean | false | During collaborative editing, the same node cannot be selected by multiple people at the same time | |
| beforeCooperateUpdate（v0.9.8+） | Function、null | null | During collaborative editing, node operations are about to be updated to the lifecycle functions of other clients. The function takes an object as a parameter:{ type: 【createOrUpdate（Create or update nodes）、delete（Delete node）】, list: 【Array type, 1.When type=createOrUpdate, it represents the node data that has been created or updated, which will be synchronized to other clients, so you can modify the data; 2.When type=delete, represents the deleted node data】 } | |
-| beforeShortcutRun（v0.9.9+） | Function、null | null | The lifecycle function before the shortcut operation is about to be executed, returning true can prevent the operation from executing. The function takes two parameters: key（Shortcut key）、activeNodeList（List of currently activated nodes） |
-| rainbowLinesConfig（v0.9.9+） | Object | { open: false, colorsList: [] } | Rainbow line configuration requires registering the RainbowLines plugin first. Object type, Structure: { open: false【Is turn on rainbow lines】, colorsList: []【Customize the color list for rainbow lines. If not set, the default color list will be used】 } |
+| beforeShortcutRun（v0.9.9+） | Function、null | null | The lifecycle function before the shortcut operation is about to be executed, returning true can prevent the operation from executing. The function takes two parameters: key（Shortcut key）、activeNodeList（List of currently activated nodes） | |
+| rainbowLinesConfig（v0.9.9+） | Object | { open: false, colorsList: [] } | Rainbow line configuration requires registering the RainbowLines plugin first. Object type, Structure: { open: false【Is turn on rainbow lines】, colorsList: []【Customize the color list for rainbow lines. If not set, the default color list will be used】 } | |
+| addContentToHeader（v0.9.9+） | Function、null | null | Add custom content to the header when exporting PNG, SVG, and PDF. Can pass a function that can return null to indicate no content is added, or it can return an object, For a detailed introduction, please refer to section 【How to add custom content when exporting】 below | |
+| addContentToFooter（v0.9.9+） | Function、null | null | The basic definition is the same as addContentToHeader, adding custom content at the end | |
### Data structure
@@ -177,6 +179,41 @@ If you want to add custom fields, you can add them to the same level as 'data' a
| type | String | | Values for icon grouping |
| list | Array | | A list of icons under grouping, with each item in the array being an object, `{ name: '', icon: '' }`，`name`represents the name of the icon, `icon`represents the icon, Can be an `svg` icon, such as ``, also can be a image `url`, or `base64` icon, such as `data:image/png;base64,...` |
+### How to add custom content when exporting
+
+The two instantiation options `addContentToHeader` and `addContentToFooter` can be used to add custom content at the beginning and end when exporting `png`、`svg`、`pdf`, The default value is `null`, which means no configuration. A function can be passed and can return `null`, which means no content will be added. If you want to add content, you need to return the following structure:
+
+```
+{
+ el,// Custom DOM node to be added, styles can be inline
+ cssText,// Optional, if the style does not want to be inlined, you can pass this value as a CSS string
+ height: 50// The height of the returned DOM node must be passed
+}
+```
+
+A simple example:
+
+```js
+new MindMap({
+ addContentToFooter: () => {
+ const el = document.createElement('div')
+ el.className = 'footer'
+ el.innerHTML = 'From: simple-mind-map'
+ const cssText = `
+ .footer {
+ width: 100%;
+ height: 30px;
+ }
+ `
+ return {
+ el,
+ cssText,
+ height: 30
+ }
+ }
+})
+```
+
## Static methods
### defineTheme(name, config)
@@ -334,7 +371,7 @@ Clear `lineDraw`、`associativeLineDraw`、`nodeDraw`、`otherDraw` containers.
Destroy mind maps. It will remove registered plugins, remove listening events, and delete all nodes on the canvas.
-### getSvgData({ paddingX = 0, paddingY = 0, ignoreWatermark = false })
+### getSvgData({ paddingX = 0, paddingY = 0, ignoreWatermark = false, addContentToHeader, addContentToFooter })
> v0.3.0+
@@ -344,6 +381,10 @@ Destroy mind maps. It will remove registered plugins, remove listening events, a
`ignoreWatermark`：v0.8.0+, Do not draw watermarks. If you do not need to draw watermarks, you can pass 'true' because drawing watermarks is very slow
+`addContentToHeader`：v0.9.9+, Function, You can return the custom content to be added to the header, as detailed in the configuration in 【Instantiation options】
+
+`addContentToFooter`：v0.9.9+, Function, You can return the custom content to be added to the tail, as detailed in the configuration in 【Instantiation options】
+
Get the `svg` data and return an object. The detailed structure is as follows:
```js
diff --git a/web/src/pages/Doc/en/constructor/index.vue b/web/src/pages/Doc/en/constructor/index.vue
index 7c79c91a..d19ab47e 100644
--- a/web/src/pages/Doc/en/constructor/index.vue
+++ b/web/src/pages/Doc/en/constructor/index.vue
@@ -672,6 +672,20 @@
Rainbow line configuration requires registering the RainbowLines plugin first. Object type, Structure: { open: false【Is turn on rainbow lines】, colorsList: []【Customize the color list for rainbow lines. If not set, the default color list will be used】 }
+
+
addContentToHeader（v0.9.9+）
+
Function、null
+
null
+
Add custom content to the header when exporting PNG, SVG, and PDF. Can pass a function that can return null to indicate no content is added, or it can return an object, For a detailed introduction, please refer to section 【How to add custom content when exporting】 below
+
+
+
+
addContentToFooter（v0.9.9+）
+
Function、null
+
null
+
The basic definition is the same as addContentToHeader, adding custom content at the end
+
+
Data structure
@@ -790,6 +804,34 @@
+
How to add custom content when exporting
+
The two instantiation options addContentToHeader and addContentToFooter can be used to add custom content at the beginning and end when exporting png、svg、pdf, The default value is null, which means no configuration. A function can be passed and can return null, which means no content will be added. If you want to add content, you need to return the following structure:
+
{
+ el,// Custom DOM node to be added, styles can be inline
+ cssText,// Optional, if the style does not want to be inlined, you can pass this value as a CSS string
+ height: 50// The height of the returned DOM node must be passed
+}
+
ignoreWatermark：v0.8.0+, Do not draw watermarks. If you do not need to draw watermarks, you can pass 'true' because drawing watermarks is very slow
+
addContentToHeader：v0.9.9+, Function, You can return the custom content to be added to the header, as detailed in the configuration in 【Instantiation options】
+
addContentToFooter：v0.9.9+, Function, You can return the custom content to be added to the tail, as detailed in the configuration in 【Instantiation options】
Get the svg data and return an object. The detailed structure is as follows:
{
svg, // Element, the overall svg element of the mind map graphics, including: svg (canvas container), g (actual mind map group)
diff --git a/web/src/pages/Doc/en/introduction/index.md b/web/src/pages/Doc/en/introduction/index.md
index 6d8af046..d7f1fab8 100644
--- a/web/src/pages/Doc/en/introduction/index.md
+++ b/web/src/pages/Doc/en/introduction/index.md
@@ -343,4 +343,12 @@ Open source is not easy. If this project is helpful to you, you can invite the a
逆水行舟
+
+
+
LiuJL
+
+
+
+
L
+
\ No newline at end of file
diff --git a/web/src/pages/Doc/en/introduction/index.vue b/web/src/pages/Doc/en/introduction/index.vue
index 9a7be0c3..cc100182 100644
--- a/web/src/pages/Doc/en/introduction/index.vue
+++ b/web/src/pages/Doc/en/introduction/index.vue
@@ -8,17 +8,17 @@
Features
-
-
-
-
-
-
-
-
json、png、svg、pdf、markdown、xmind, support import from json、xmind、markdown
-
-
-
+
+
+
+
+
+
+
+
json、png、svg、pdf、markdown、xmind, support import from json、xmind、markdown
+
+
+
Features that will not be implemented:
@@ -34,16 +34,16 @@ frameworks such as Vue and React, or without a framework.
This is an online mind map built using the simple-mind-map library and based
on Vue2.x and ElementUI. Features include:
-
+
images, icons, hyperlinks, notes, tags, and summaries
-
+
outline, theme selection, and structure selection
-
+
storage by default, but it also supports creating, opening, and editing
local files on the computer directly
-
+
and organizing layout
-
+
between edit and read-only modes, zooming in and out, and switching to
full screen, support mini map
@@ -297,6 +297,14 @@ full screen, support mini map
\ No newline at end of file
diff --git a/web/src/pages/Doc/zh/introduction/index.vue b/web/src/pages/Doc/zh/introduction/index.vue
index 28d20c77..f1258cf1 100644
--- a/web/src/pages/Doc/zh/introduction/index.vue
+++ b/web/src/pages/Doc/zh/introduction/index.vue
@@ -8,17 +8,17 @@
+ LiuJL
+ 
逆水行舟
+
+ 
+ L
+
diff --git a/web/src/assets/avatar/L.jpg b/web/src/assets/avatar/L.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..9116567598bff0dec564af9fa95299880913761e
GIT binary patch
literal 35984
zcmbTed0bL?`#ydU#U(W@EHyQkRF012a!k~0P(uMlS
+ 
+