diff --git a/index.html b/index.html index 86b80ca1..119b9651 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ -
optimization: 1.During rich text editing, when initially focusing, all are no longer selected by default; 2.When editing rich text, use the node fill color as the background color to avoid being invisible when the node color is white. 3.Node activation state switching no longer triggers history. 4.Triggering history multiple times in a short time will only add the last data. 5.Optimize the addition of historical records. When there is a rollback, delete the historical data after the current pointer when adding a new record again.
+New: 1.Support for importing and exporting Markdown format files. 2.Support for configuring initial text when inserting nodes. 3.Expand the commands for inserting and deleting nodes to support specifying nodes.
New: 1.Associated lines support adjusting control points.
optimization: 1.When adding historical data, filter data that has not changed compared to the previous time.
diff --git a/web/src/pages/Doc/en/constructor/index.md b/web/src/pages/Doc/en/constructor/index.md index b5899d6f..be165c24 100644 --- a/web/src/pages/Doc/en/constructor/index.md +++ b/web/src/pages/Doc/en/constructor/index.md @@ -44,6 +44,8 @@ const mindMap = new MindMap({ | customHandleMousewheel(v0.4.3+) | Function | null | User-defined mouse wheel event processing can pass a function, and the callback parameter is the event object | | | mousewheelAction(v0.4.3+) | String | zoom | The behavior of the mouse wheel, `zoom`(Zoom in and out)、`move`(Move up and down). If `customHandleMousewheel` passes a custom function, this property will not take effect | | | mousewheelMoveStep(v0.4.3+) | Number | 100 | When the `mousewheelAction` is set to `move`, you can use this attribute to control the step length of the view movement when the mouse scrolls. The unit is `px` | | +| defaultInsertSecondLevelNodeText(v0.4.7+) | String | 二级节点 | Text of the default inserted secondary node | | +| defaultInsertBelowSecondLevelNodeText(v0.4.7+) | String | 分支主题 | Text for nodes below the second level inserted by default | | ### Watermark config @@ -269,11 +271,11 @@ redo. All commands are as follows: | SELECT_ALL | Select all | | | BACK | Go back a specified number of steps | step (the number of steps to go back, default is 1) | | FORWARD | Go forward a specified number of steps | step (the number of steps to go forward, default is 1) | -| INSERT_NODE | Insert a sibling node, the active node will be the operation node. If there are multiple active nodes, only the first one will be effective | openEdit(v0.4.6+, Whether to activate the newly inserted node and enter editing mode, default is `true`) | -| INSERT_CHILD_NODE | Insert a child node, the active node will be the operation node | openEdit(v0.4.6+, Whether to activate the newly inserted node and enter editing mode, default is `true`) | +| INSERT_NODE | Insert a sibling node, the active node or appoint node will be the operation node. If there are multiple active nodes, only the first one will be effective | openEdit(v0.4.6+, Whether to activate the newly inserted node and enter editing mode, default is `true`) 、 appointNodes(v0.4.7+, Optional, appoint node, Specifying multiple nodes can pass an array)、 appointData(Optional, Specify the data for the newly created node, Such as {text: 'xxx', ...}, Detailed structure can be referred to [https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js](https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js) ) | +| INSERT_CHILD_NODE | Insert a child node, the active node or appoint node will be the operation node | openEdit(v0.4.6+, Whether to activate the newly inserted node and enter editing mode, default is `true`)、 appointNodes(v0.4.7+, Optional, appoint node, Specifying multiple nodes can pass an array)、 appointData(Optional, Specify the data for the newly created node, Such as {text: 'xxx', ...}, Detailed structure can be referred to [https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js](https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js) ) | | UP_NODE | Move node up, the active node will be the operation node. If there are multiple active nodes, only the first one will be effective. Using this command on the root node or the first node in the list will be invalid | | | DOWN_NODE | Move node down, the active node will be the operation node. If there are multiple active nodes, only the first one will be effective. Using this command on the root node or the last node in the list will be invalid | | -| REMOVE_NODE | Remove node, the active node will be the operation node | | +| REMOVE_NODE | Remove node, the active node or appoint node will be the operation node | appointNodes(v0.4.7+, Optional, appoint node, Specifying multiple nodes can pass an array) | | PASTE_NODE | Paste node to a node, the active node will be the operation node | data (the node data to paste, usually obtained through the renderer.copyNode() and renderer.cutNode() methods) | | SET_NODE_STYLE | Modify node style | node (the node to set the style of), prop (style property), value (style property value), isActive (boolean, whether the style being set is for the active state) | | SET_NODE_ACTIVE | Set whether the node is active | node (the node to set), active (boolean, whether to activate) | diff --git a/web/src/pages/Doc/en/constructor/index.vue b/web/src/pages/Doc/en/constructor/index.vue index c3bb8676..910434a6 100644 --- a/web/src/pages/Doc/en/constructor/index.vue +++ b/web/src/pages/Doc/en/constructor/index.vue @@ -168,6 +168,20 @@mousewheelAction is set to move, you can use this attribute to control the step length of the view movement when the mouse scrolls. The unit is pxtrue)true) 、 appointNodes(v0.4.7+, Optional, appoint node, Specifying multiple nodes can pass an array)、 appointData(Optional, Specify the data for the newly created node, Such as {text: 'xxx', ...}, Detailed structure can be referred to https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js )true)true)、 appointNodes(v0.4.7+, Optional, appoint node, Specifying multiple nodes can pass an array)、 appointData(Optional, Specify the data for the newly created node, Such as {text: 'xxx', ...}, Detailed structure can be referred to https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js )++v0.4.7+
+
Provides methods for importing and exporting Markdown files.
import markdown from 'simple-mind-map/src/parse/markdown.js'
+
+If you are using the file in the format of umd, you can obtain it in the following way:
<script src="simple-mind-map/dist/simpleMindMap.umd.min.js"></script>
+
+MindMap.markdown
+
+data: Mind map data can be obtained using the mindMap.getData() method.Convert mind map data into Markdown format data, and the returned data is a string.
mdContent: The Markdown data to convert, string type.Convert the Markdown string into node tree data and return a Promise instance. You can use the mindMap.setData() method to render the converted data onto the canvas.
Select All. When the node is being edited, you can select all the text in the node through this method.
+++v0.4.7+
+
Focus.
config:Object. The key is the style attribute and the value is the style value. The complete configuration is as follows:import xmind from 'simple-mind-map/src/parse/xmind.js'
If you are using the file in the format of umd, you can obtain it in the following way:
import MindMap from "simple-mind-map/dist/simpleMindMap.umd.min"
-
-MindMap.xmind
+<script src="simple-mind-map/dist/simpleMindMap.umd.min.js"></script>
+
+MindMap.xmind
Methods
xmind.parseXmindFile(file)
diff --git a/web/src/pages/Doc/routerList.js b/web/src/pages/Doc/routerList.js
index d46c02cc..dfb7372f 100644
--- a/web/src/pages/Doc/routerList.js
+++ b/web/src/pages/Doc/routerList.js
@@ -1,3 +1,3 @@
- export default [{"lang":"zh","children":[{"path":"associativeLine","title":"AssociativeLine 插件"},{"path":"batchExecution","title":"BatchExecution实例"},{"path":"changelog","title":"Changelog"},{"path":"command","title":"Command实例"},{"path":"constructor","title":"构造函数"},{"path":"doExport","title":"Export 插件"},{"path":"drag","title":"Drag插件"},{"path":"introduction","title":"简介"},{"path":"keyboardNavigation","title":"KeyboardNavigation插件"},{"path":"keyCommand","title":"KeyCommand实例"},{"path":"miniMap","title":"MiniMap插件"},{"path":"node","title":"Node实例"},{"path":"render","title":"Render实例"},{"path":"richText","title":"RichText插件"},{"path":"select","title":"Select 插件 "},{"path":"start","title":"开始"},{"path":"translate","title":"参与翻译"},{"path":"utils","title":"内置工具方法"},{"path":"view","title":"View实例"},{"path":"watermark","title":"Watermark插件"},{"path":"xmind","title":"XMind解析"}]},{"lang":"en","children":[{"path":"associativeLine","title":"AssociativeLine plugin"},{"path":"batchExecution","title":"batchExecution instance"},{"path":"changelog","title":"Changelog"},{"path":"command","title":"command instance"},{"path":"constructor","title":"Constructor"},{"path":"doExport","title":"Export plugin"},{"path":"drag","title":"Drag plugin"},{"path":"introduction","title":"Introduction"},{"path":"keyboardNavigation","title":"KeyboardNavigation plugin"},{"path":"keyCommand","title":"KeyCommand instance"},{"path":"miniMap","title":"MiniMap plugin"},{"path":"node","title":"Node instance"},{"path":"render","title":"Render instance"},{"path":"richText","title":"RichText plugin"},{"path":"select","title":"Select plugin"},{"path":"start","title":"Start"},{"path":"translate","title":"Participate in translation"},{"path":"utils","title":"Utility Methods"},{"path":"view","title":"View instance"},{"path":"watermark","title":"Watermark plugin"},{"path":"xmind","title":"XMind parse"}]}]
+ export default [{"lang":"zh","children":[{"path":"associativeLine","title":"AssociativeLine 插件"},{"path":"batchExecution","title":"BatchExecution实例"},{"path":"changelog","title":"Changelog"},{"path":"command","title":"Command实例"},{"path":"constructor","title":"构造函数"},{"path":"doExport","title":"Export 插件"},{"path":"drag","title":"Drag插件"},{"path":"introduction","title":"简介"},{"path":"keyboardNavigation","title":"KeyboardNavigation插件"},{"path":"keyCommand","title":"KeyCommand实例"},{"path":"miniMap","title":"MiniMap插件"},{"path":"node","title":"Node实例"},{"path":"render","title":"Render实例"},{"path":"richText","title":"RichText插件"},{"path":"select","title":"Select 插件 "},{"path":"start","title":"开始"},{"path":"translate","title":"参与翻译"},{"path":"utils","title":"内置工具方法"},{"path":"view","title":"View实例"},{"path":"watermark","title":"Watermark插件"},{"path":"xmind","title":"XMind解析"},{"path":"markdown","title":"Markdown解析"}]},{"lang":"en","children":[{"path":"associativeLine","title":"AssociativeLine plugin"},{"path":"batchExecution","title":"batchExecution instance"},{"path":"changelog","title":"Changelog"},{"path":"command","title":"command instance"},{"path":"constructor","title":"Constructor"},{"path":"doExport","title":"Export plugin"},{"path":"drag","title":"Drag plugin"},{"path":"introduction","title":"Introduction"},{"path":"keyboardNavigation","title":"KeyboardNavigation plugin"},{"path":"keyCommand","title":"KeyCommand instance"},{"path":"miniMap","title":"MiniMap plugin"},{"path":"node","title":"Node instance"},{"path":"render","title":"Render instance"},{"path":"richText","title":"RichText plugin"},{"path":"select","title":"Select plugin"},{"path":"start","title":"Start"},{"path":"translate","title":"Participate in translation"},{"path":"utils","title":"Utility Methods"},{"path":"view","title":"View instance"},{"path":"watermark","title":"Watermark plugin"},{"path":"xmind","title":"XMind parse"},{"path":"markdown","title":"Markdown parse"}]}]
\ No newline at end of file
diff --git a/web/src/pages/Doc/zh/changelog/index.md b/web/src/pages/Doc/zh/changelog/index.md
index 668eb910..b96f9de3 100644
--- a/web/src/pages/Doc/zh/changelog/index.md
+++ b/web/src/pages/Doc/zh/changelog/index.md
@@ -1,5 +1,11 @@
# Changelog
+## 0.4.7
+
+优化:1.富文本编辑时初始聚焦时不再默认全选;2.富文本编辑时使用节点填充色作为背景色,避免节点颜色为白色时看不见。 3.节点激活状态切换不再触发历史记录。 4.短时间多次触发历史记录,只会添加最后一次的数据。 5.优化历史记录添加,当有回退时,再次添加新记录时删除当前指针后面的历史数据。
+
+新增:1.支持导入和导出Markdown格式文件。 2.支持配置插入节点时的初始文字。 3.扩展插入节点和删除节点的命令,支持指定节点。
+
## 0.4.6
新增:1.关联线支持调整控制点。
diff --git a/web/src/pages/Doc/zh/changelog/index.vue b/web/src/pages/Doc/zh/changelog/index.vue
index ab088ab8..c040deb6 100644
--- a/web/src/pages/Doc/zh/changelog/index.vue
+++ b/web/src/pages/Doc/zh/changelog/index.vue
@@ -1,6 +1,9 @@
Changelog
+0.4.7
+优化:1.富文本编辑时初始聚焦时不再默认全选;2.富文本编辑时使用节点填充色作为背景色,避免节点颜色为白色时看不见。 3.节点激活状态切换不再触发历史记录。 4.短时间多次触发历史记录,只会添加最后一次的数据。 5.优化历史记录添加,当有回退时,再次添加新记录时删除当前指针后面的历史数据。
+新增:1.支持导入和导出Markdown格式文件。 2.支持配置插入节点时的初始文字。 3.扩展插入节点和删除节点的命令,支持指定节点。
0.4.6
新增:1.关联线支持调整控制点。
优化:1.添加历史数据时过滤和上一次相比没有改变的数据。
diff --git a/web/src/pages/Doc/zh/constructor/index.md b/web/src/pages/Doc/zh/constructor/index.md
index c164a70e..dbd8f4b6 100644
--- a/web/src/pages/Doc/zh/constructor/index.md
+++ b/web/src/pages/Doc/zh/constructor/index.md
@@ -44,6 +44,8 @@ const mindMap = new MindMap({
| customHandleMousewheel(v0.4.3+) | Function | null | 自定义鼠标滚轮事件处理,可以传一个函数,回调参数为事件对象 | |
| mousewheelAction(v0.4.3+) | String | zoom | 鼠标滚轮的行为,`zoom`(放大缩小)、`move`(上下移动)。如果`customHandleMousewheel`传了自定义函数,这个属性不生效 | |
| mousewheelMoveStep(v0.4.3+) | Number | 100 | 当`mousewheelAction`设为`move`时,可以通过该属性控制鼠标滚动一下视图移动的步长,单位`px` | |
+| defaultInsertSecondLevelNodeText(v0.4.7+) | String | 二级节点 | 默认插入的二级节点的文字 | |
+| defaultInsertBelowSecondLevelNodeText(v0.4.7+) | String | 分支主题 | 默认插入的二级以下节点的文字 | |
### 水印配置
@@ -263,11 +265,11 @@ mindMap.updateConfig({
| SELECT_ALL | 全选 | |
| BACK | 回退指定的步数 | step(要回退的步数,默认为1) |
| FORWARD | 前进指定的步数 | step(要前进的步数,默认为1) |
-| INSERT_NODE | 插入同级节点,操作节点为当前激活的节点,如果有多个激活节点,只会对第一个有效 | openEdit(v0.4.6+,是否激活新插入的节点并进入编辑模式,默认为`true`) |
-| INSERT_CHILD_NODE | 插入子节点,操作节点为当前激活的节点 | openEdit(v0.4.6+,是否激活新插入的节点并进入编辑模式,默认为`true`) |
+| INSERT_NODE | 插入同级节点,操作节点为当前激活的节点或指定节点,如果有多个激活节点,只会对第一个有效 | openEdit(v0.4.6+,是否激活新插入的节点并进入编辑模式,默认为`true`)、 appointNodes(v0.4.7+,可选,指定节点,指定多个节点可以传一个数组)、 appointData(可选,指定新创建节点的数据,比如{text: 'xxx', ...},详细结构可以参考[https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js](https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js)) |
+| INSERT_CHILD_NODE | 插入子节点,操作节点为当前激活的节点或指定节点 | openEdit(v0.4.6+,是否激活新插入的节点并进入编辑模式,默认为`true`)、 appointNodes(v0.4.7+,可选,指定节点,指定多个节点可以传一个数组)、 appointData(可选,指定新创建节点的数据,比如{text: 'xxx', ...},详细结构可以参考[https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js](https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js)) |
| UP_NODE | 上移节点,操作节点为当前激活的节点,如果有多个激活节点,只会对第一个有效,对根节点或在列表里的第一个节点使用无效 | |
| DOWN_NODE | 操作节点为当前激活的节点,如果有多个激活节点,只会对第一个有效,对根节点或在列表里的最后一个节点使用无效 | |
-| REMOVE_NODE | 删除节点,操作节点为当前激活的节点 | |
+| REMOVE_NODE | 删除节点,操作节点为当前激活的节点或指定节点 | appointNodes(v0.4.7+,可选,指定节点,指定多个节点可以传一个数组) |
| PASTE_NODE | 粘贴节点到节点,操作节点为当前激活的节点 | data(要粘贴的节点数据,一般通过`renderer.copyNode()`方法和`renderer.cutNode()`方法获取) |
| CUT_NODE | 剪切节点,操作节点为当前激活的节点,如果有多个激活节点,只会对第一个有效,对根节点使用无效 | callback(回调函数,剪切的节点数据会通过调用该函数并通过参数返回) |
| SET_NODE_STYLE | 修改节点样式 | node(要设置样式的节点)、prop(样式属性)、value(样式属性值)、isActive(布尔值,是否设置的是激活状态的样式) |
diff --git a/web/src/pages/Doc/zh/constructor/index.vue b/web/src/pages/Doc/zh/constructor/index.vue
index eff871d7..26ff8c5e 100644
--- a/web/src/pages/Doc/zh/constructor/index.vue
+++ b/web/src/pages/Doc/zh/constructor/index.vue
@@ -168,6 +168,20 @@
当mousewheelAction设为move时,可以通过该属性控制鼠标滚动一下视图移动的步长,单位px
true)true)、 appointNodes(v0.4.7+,可选,指定节点,指定多个节点可以传一个数组)、 appointData(可选,指定新创建节点的数据,比如{text: 'xxx', ...},详细结构可以参考https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js)true)true)、 appointNodes(v0.4.7+,可选,指定节点,指定多个节点可以传一个数组)、 appointData(可选,指定新创建节点的数据,比如{text: 'xxx', ...},详细结构可以参考https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/example/exampleData.js)++v0.4.7+
+
提供导入和导出Markdown文件的方法。
import markdown from 'simple-mind-map/src/parse/markdown.js'
+
+如果使用的是umd格式的文件,那么可以通过如下方式获取:
<script src="simple-mind-map/dist/simpleMindMap.umd.min.js"></script>
+
+MindMap.markdown
+
+data:思维导图数据,可以通过mindMap.getData()方法获取。将思维导图数据转换成Markdown格式数据,返回的是字符串。
mdContent:要转换的Markdown数据,字符串类型。将Markdown字符串转换成节点树数据,返回一个Promise实例。可以使用mindMap.setData()方法将转换后的数据渲染到画布上。
选中全部。当节点正在编辑中可以通过该方法选中节点内的所有文本。
+++v0.4.7+
+
聚焦。
config:对象,键为样式属性,值为样式值,完整的配置如下:import xmind from 'simple-mind-map/src/parse/xmind.js'
如果使用的是umd格式的文件,那么可以通过如下方式获取:
import MindMap from "simple-mind-map/dist/simpleMindMap.umd.min"
-
-MindMap.xmind
+<script src="simple-mind-map/dist/simpleMindMap.umd.min.js"></script>
+
+MindMap.xmind
方法
xmind.parseXmindFile(file)
diff --git a/web/src/pages/Edit/components/Edit.vue b/web/src/pages/Edit/components/Edit.vue
index 841a085e..5e8b554c 100644
--- a/web/src/pages/Edit/components/Edit.vue
+++ b/web/src/pages/Edit/components/Edit.vue
@@ -309,6 +309,20 @@ export default {
})
})
this.bindSaveEvent()
+ // setTimeout(() => {
+ // 动态给指定节点添加子节点
+ // this.mindMap.execCommand('INSERT_CHILD_NODE', false, this.mindMap.renderer.root, {
+ // text: '自定义内容'
+ // })
+
+ // 动态给指定节点添加同级节点
+ // this.mindMap.execCommand('INSERT_NODE', false, this.mindMap.renderer.root, {
+ // text: '自定义内容'
+ // })
+
+ // 动态删除指定节点
+ // this.mindMap.execCommand('REMOVE_NODE', this.mindMap.renderer.root.children[0])
+ // }, 5000);
},
/**
diff --git a/web/src/pages/Edit/components/Export.vue b/web/src/pages/Edit/components/Export.vue
index cafe31fa..3f04f061 100644
--- a/web/src/pages/Edit/components/Export.vue
+++ b/web/src/pages/Edit/components/Export.vue
@@ -30,23 +30,21 @@
>{{ $t('export.domToImage') }}
-
- {{ $t('export.dedicatedFile') }}(.smm)
+
- {{ $t('export.jsonFile') }}(.json)
- {{ $t('export.imageFile') }}(.png)
- {{ $t('export.svgFile') }}(.svg)
- {{ $t('export.pdfFile') }}(.pdf)
-
+
+
+ {{ item.name }}
+ {{ item.desc }}
+
+
+
{{ $t('export.tips') }}
{{ $t('export.pngTips') }}
{{ $t('export.svgTips') }}
@@ -62,6 +60,7 @@