FE/mind-map
1
0
Fork 0
mirror of https://github.com/wanglin2/mind-map.git synced 2026-02-17 22:08:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

Doc: update

Browse Source
This commit is contained in:
街角小林
2024-04-01 20:04:06 +08:00
parent 5abf09b560
commit 58dc232ebf
17 changed files with 289 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
simple-mind-map/src/core/render/Render.js
View File

@@ -335,7 +335,7 @@ class Render {
})
// 一键整理布局
this.mindMap.keyCommand.addShortcut('Control+l', () => {
this.mindMap.execCommand('RESET_LAYOUT', this.resetLayout)
this.mindMap.execCommand('RESET_LAYOUT')
})
// 上移节点
this.mindMap.keyCommand.addShortcut('Control+Up', () => {

2
web/src/pages/Doc/catalogList.js
View File

@@ -11,7 +11,7 @@ let langList = [
}
]
let StartList = ['introduction', 'start', 'deploy', 'client', 'translate', 'changelog']
let CourseList = new Array(26).fill(0).map((_, index) => {
let CourseList = new Array(27).fill(0).map((_, index) => {
return 'course' + (index + 1)
})
let APIList = [

16
web/src/pages/Doc/en/changelog/index.md
View File

@@ -1,5 +1,21 @@
# Changelog
## 0.9.10
Fix:
> 1.Fix the issue of all replace operation error during search;
New:
> 1.Add an event translate when moving the canvas;
>
> 2.Node content supports setting attachments;
Client:
> 1.Nodes support adding attachments;
## 0.9.9-fix.2
Fix:

14
web/src/pages/Doc/en/changelog/index.vue
View File

@@ -1,6 +1,20 @@
<template>
<div>
<h1>Changelog</h1>
<h2>0.9.10</h2>
<p>Fix:</p>
<blockquote>
<p>1.Fix the issue of all replace operation error during search;</p>
</blockquote>
<p>New:</p>
<blockquote>
<p>1.Add an event translate when moving the canvas;</p>
<p>2.Node content supports setting attachments;</p>
</blockquote>
<p>Client:</p>
<blockquote>
<p>1.Nodes support adding attachments;</p>
</blockquote>
<h2>0.9.9-fix.2</h2>
<p>Fix:</p>
<blockquote>

4
web/src/pages/Doc/en/constructor/index.md
View File

@@ -455,7 +455,8 @@ Listen to an event. Event list:
| expand_btn_click | Node expand or collapse event | this (node instance) |
| before_show_text_edit | Event before node text edit box opens | |
| hide_text_edit | Node text edit box close event | textEditNode (text edit box DOM node), activeNodeList (current list of active nodes) |
| scale | Zoom event | scale (zoom ratio) |
| scale | Canvas zoom event | scale (zoom ratio) |
| translate（v0.9.10+） | Canvas movement event | x（translate x）、y（translate y） |
| node_img_dblclick（v0.2.15+） | Node image double-click event | this (node instance), e (event object) |
| node_img_mouseenter（v0.6.5+） | Node image mouseenter event | this（node instance）、imgNode（img node）、e（event object） |
| node_img_mouseleave（v0.6.5+） | Node image mouseleave event | this（node instance）、imgNode（img node）、e（event object） |
@@ -581,6 +582,7 @@ redo. All commands are as follows:
| SET_NODE_ICON | Set Node Icon | node (node to set), icons (array, predefined image names array, available icons can be obtained in the nodeIconList list in the [icons.js](https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/src/svg/icons.js) file, icon name is type_name, such as ['priority_1']) |
| SET_NODE_HYPERLINK | Set Node Hyperlink | node (node to set), link (hyperlink address), title (hyperlink name, optional) |
| SET_NODE_NOTE | Set Node Note | node (node to set), note (note text) |
| SET_NODE_ATTACHMENT（v0.9.10+） | Set node attachment | node（node to set）、url（attachment url）、name（attachment name, optional） |
| SET_NODE_TAG | Set Node Tag | node (node to set), tag (string array, built-in color information can be obtained in [constant.js](https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/src/constants/constant.js)) |
| INSERT_AFTER (v0.1.5+) | Move Node to After Another Node | node (node to move, (v0.7.2+supports passing node arrays to move multiple nodes simultaneously)), exist (target node) |
| INSERT_BEFORE (v0.1.5+) | Move Node to Before Another Node | node (node to move, (v0.7.2+supports passing node arrays to move multiple nodes simultaneously)), exist (target node) |

12
web/src/pages/Doc/en/constructor/index.vue
View File

@@ -1116,10 +1116,15 @@ poor performance and should be used sparingly.</p>
</tr>
<tr>
<td>scale</td>
<td>Zoom event</td>
<td>Canvas zoom event</td>
<td>scale (zoom ratio)</td>
</tr>
<tr>
<td>translate（v0.9.10+）</td>
<td>Canvas movement event</td>
<td>x（translate x）、y（translate y）</td>
</tr>
<tr>
<td>node_img_dblclick（v0.2.15+）</td>
<td>Node image double-click event</td>
<td>this (node instance), e (event object)</td>
@@ -1425,6 +1430,11 @@ redo. All commands are as follows:</p>
<td>node (node to set), note (note text)</td>
</tr>
<tr>
<td>SET_NODE_ATTACHMENT（v0.9.10+）</td>
<td>Set node attachment</td>
<td>node（node to set）、url（attachment url）、name（attachment name, optional）</td>
</tr>
<tr>
<td>SET_NODE_TAG</td>
<td>Set Node Tag</td>
<td>node (node to set), tag (string array, built-in color information can be obtained in <a href="https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/src/constants/constant.js">constant.js</a>)</td>

12
web/src/pages/Doc/en/node/index.md
View File

@@ -261,9 +261,19 @@ Setting the node hyperlink, a shortcut for the `SET_NODE_HYPERLINK` command
Setting the node note, a shortcut for the `SET_NODE_NOTE` command
### setAttachment(url, name)
> v0.9.10+
- `url`：Attachment url；
- `name`：Attachment name, optional
Set node attachments, a shortcut for the `SET_NODE_ATTACHMENT` command
### setTag(tag)
Setting the node tag, a shortcut for the `SET_NODE_TAG` command"
Setting the node tag, a shortcut for the `SET_NODE_TAG` command
### hide()

15
web/src/pages/Doc/en/node/index.vue
View File

@@ -195,8 +195,21 @@ nodeData, <code>SET_NODE_DATA</code> command's shortcut method. This method and
<p>Setting the node hyperlink, a shortcut for the <code>SET_NODE_HYPERLINK</code> command</p>
<h3>setNote(note)</h3>
<p>Setting the node note, a shortcut for the <code>SET_NODE_NOTE</code> command</p>
<h3>setAttachment(url, name)</h3>
<blockquote>
<p>v0.9.10+</p>
</blockquote>
<ul>
<li>
<p><code>url</code>：Attachment url；</p>
</li>
<li>
<p><code>name</code>：Attachment name, optional</p>
</li>
</ul>
<p>Set node attachments, a shortcut for the <code>SET_NODE_ATTACHMENT</code> command</p>
<h3>setTag(tag)</h3>
<p>Setting the node tag, a shortcut for the <code>SET_NODE_TAG</code> command&quot;</p>
<p>Setting the node tag, a shortcut for the <code>SET_NODE_TAG</code> command</p>
<h3>hide()</h3>
<blockquote>
<p>v0.1.5+</p>

1
web/src/pages/Doc/routerList.js
View File

@@ -33,6 +33,7 @@ export default [
{ path: 'course24', title: '如何开发一个插件' },
{ path: 'course25', title: '关于概要' },
{ path: 'course26', title: '如何实现AI生成节点内容' },
{ path: 'course27', title: '快捷键操作如何传递自定义参数' },
{ path: 'doExport', title: 'Export 插件' },
{ path: 'drag', title: 'Drag插件' },
{ path: 'introduction', title: '简介' },

16
web/src/pages/Doc/zh/changelog/index.md
View File

@@ -1,5 +1,21 @@
# Changelog
## 0.9.10
修复：
> 1.修复搜索时全部替换操作报错的问题；
新增：
> 1.新增画布移动时的事件translate；
>
> 2.节点内容支持设置附件；
客户端：
> 1.节点支持添加附件；
## 0.9.9-fix.2
修复：

14
web/src/pages/Doc/zh/changelog/index.vue
View File

@@ -1,6 +1,20 @@
<template>
<div>
<h1>Changelog</h1>
<h2>0.9.10</h2>
<p>修复：</p>
<blockquote>
<p>1.修复搜索时全部替换操作报错的问题；</p>
</blockquote>
<p>新增：</p>
<blockquote>
<p>1.新增画布移动时的事件translate；</p>
<p>2.节点内容支持设置附件；</p>
</blockquote>
<p>客户端：</p>
<blockquote>
<p>1.节点支持添加附件；</p>
</blockquote>
<h2>0.9.9-fix.2</h2>
<p>修复：</p>
<blockquote>

6
web/src/pages/Doc/zh/constructor/index.md
View File

@@ -141,6 +141,8 @@ const mindMap = new MindMap({
hyperlink: '', // 超链接地址
hyperlinkTitle: '', // 超链接的标题
note: '', // 备注的内容
attachmentUrl: '',// v0.9.10+，附件url
attachmentName: '',// v0.9.10+，附件名称
tag: [], // 标签列表
generalization: {// 节点的概要，如果没有概要generalization设为null即可
text: ''// 概要的文本
@@ -452,7 +454,8 @@ mindMap.setTheme('主题名称')
| expand_btn_click | 节点展开或收缩事件 | this（节点实例） |
| before_show_text_edit | 节点文本编辑框即将打开事件 | |
| hide_text_edit | 节点文本编辑框关闭事件 | textEditNode（文本编辑框DOM节点）、activeNodeList（当前激活的所有节点列表） |
| scale | 放大缩小事件 | scale（缩放比例） |
| scale | 画布放大缩小事件 | scale（缩放比例） |
| translate（v0.9.10+） | 画布移动事件 | x（水平位移）、y（垂直位移） |
| node_img_dblclick（v0.2.15+） | 节点内图片的双击事件 | this（节点实例）、e（事件对象） |
| node_img_mouseenter（v0.6.5+） | 节点内图片的鼠标移入事件 | this（节点实例）、imgNode（图片节点）、e（事件对象） |
| node_img_mouseleave（v0.6.5+） | 节点内图片的鼠标移出事件 | this（节点实例）、imgNode（图片节点）、e（事件对象） |
@@ -576,6 +579,7 @@ mindMap.updateConfig({
| SET_NODE_ICON | 设置节点图标 | node（要设置的节点）、icons（数组，预定义的图片名称组成的数组，可用图标可在[icons.js](https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/src/svg/icons.js)文件里的`nodeIconList`列表里获取到，图标名称为`type_name`，如`['priority_1']`） |
| SET_NODE_HYPERLINK | 设置节点超链接 | node（要设置的节点）、link（超链接地址）、title（超链接名称，可选） |
| SET_NODE_NOTE | 设置节点备注 | node（要设置的节点）、note（备注文字） |
| SET_NODE_ATTACHMENT（v0.9.10+） | 设置节点附件 | node（要设置的节点）、url（附件url）、name（附件名称，可选） |
| SET_NODE_TAG | 设置节点标签 | node（要设置的节点）、tag（字符串数组，内置颜色信息可在[constant.js](https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/src/constants/constant.js)里获取到） |
| INSERT_AFTER（v0.1.5+） | 将节点移动到另一个节点的后面 | node（要移动的节点，（v0.7.2+支持传递节点数组实现同时移动多个节点））、 exist（目标节点） |
| INSERT_BEFORE（v0.1.5+） | 将节点移动到另一个节点的前面，（v0.7.2+支持传递节点数组实现同时移动多个节点） | node（要移动的节点）、 exist（目标节点） |

14
web/src/pages/Doc/zh/constructor/index.vue
View File

@@ -606,6 +606,8 @@
<span class="hljs-attr">hyperlink</span>: <span class="hljs-string">&#x27;&#x27;</span>, <span class="hljs-comment">// 超链接地址</span>
<span class="hljs-attr">hyperlinkTitle</span>: <span class="hljs-string">&#x27;&#x27;</span>, <span class="hljs-comment">// 超链接的标题</span>
<span class="hljs-attr">note</span>: <span class="hljs-string">&#x27;&#x27;</span>, <span class="hljs-comment">// 备注的内容</span>
<span class="hljs-attr">attachmentUrl</span>: <span class="hljs-string">&#x27;&#x27;</span>,<span class="hljs-comment">// v0.9.10+，附件url</span>
<span class="hljs-attr">attachmentName</span>: <span class="hljs-string">&#x27;&#x27;</span>,<span class="hljs-comment">// v0.9.10+，附件名称</span>
<span class="hljs-attr">tag</span>: [], <span class="hljs-comment">// 标签列表</span>
<span class="hljs-attr">generalization</span>: {<span class="hljs-comment">// 节点的概要，如果没有概要generalization设为null即可</span>
<span class="hljs-attr">text</span>: <span class="hljs-string">&#x27;&#x27;</span><span class="hljs-comment">// 概要的文本</span>
@@ -1008,10 +1010,15 @@ mindMap.setTheme(<span class="hljs-string">&#x27;主题名称&#x27;</span>)
</tr>
<tr>
<td>scale</td>
<td>放大缩小事件</td>
<td>画布放大缩小事件</td>
<td>scale（缩放比例）</td>
</tr>
<tr>
<td>translate（v0.9.10+）</td>
<td>画布移动事件</td>
<td>x（水平位移）、y（垂直位移）</td>
</tr>
<tr>
<td>node_img_dblclick（v0.2.15+）</td>
<td>节点内图片的双击事件</td>
<td>this（节点实例）、e（事件对象）</td>
@@ -1319,6 +1326,11 @@ mindMap.setTheme(<span class="hljs-string">&#x27;主题名称&#x27;</span>)
<td>node（要设置的节点）、note（备注文字）</td>
</tr>
<tr>
<td>SET_NODE_ATTACHMENT（v0.9.10+）</td>
<td>设置节点附件</td>
<td>node（要设置的节点）、url（附件url）、name（附件名称，可选）</td>
</tr>
<tr>
<td>SET_NODE_TAG</td>
<td>设置节点标签</td>
<td>node（要设置的节点）、tag（字符串数组，内置颜色信息可在<a href="https://github.com/wanglin2/mind-map/blob/main/simple-mind-map/src/constants/constant.js">constant.js</a>里获取到）</td>

49
web/src/pages/Doc/zh/course27/index.md Normal file
View File

@@ -0,0 +1,49 @@
# 快捷键操作如何传递自定义参数
库提供了很多命令，比如插入子节点的`INSERT_CHILD_NODE`等，这些命令大多可以接收一定参数，比如在插入节点时我想指定初始文本和节点uid，那么可以这样调用：
```js
mindMap.execCommand('INSERT_CHILD_NODE', true, [], {
text: '初始文本',
uid: 'xxx'
})
```
但是同时库内部也默认注册了很多快捷键，比如插入下级节点的`Tab`快捷键，很遗憾，目前快捷键操作无法让你传入自定义的参数，那么该怎么办呢，可以这样处理，首先确定你要给什么快捷键传入参数，比如`Tab`，那么首先可以调用如下方法删除库默认注册的快捷键：
```js
const keyName = 'Tab'
mindMap.keyCommand.removeShortcut(keyName)
```
然后再重新注册即可：
```js
mindMap.keyCommand.addShortcut(keyName, () => {
mindMap.execCommand('INSERT_CHILD_NODE', true, [], {
text: '初始文本',
uid: 'xxx'
})
})
```
库内部默认注册的快捷键对应的命令一览：
| 快捷键 | 命令 |
| --------------- | ------------------- |
| Control+z | BACK |
| Control+y | FORWARD |
| Tab | INSERT_CHILD_NODE |
| Insert | INSERT_CHILD_NODE |
| Enter | INSERT_NODE |
| Shift+Tab | INSERT_PARENT_NODE |
| Control+g | ADD_GENERALIZATION |
| Del或Backspace | REMOVE_NODE |
| Shift+Backspace | REMOVE_CURRENT_NODE |
| Control+a | SELECT_ALL |
| Control+l | RESET_LAYOUT |
| Control+Up | UP_NODE |
| Control+Down | DOWN_NODE |

97
web/src/pages/Doc/zh/course27/index.vue Normal file
View File

@@ -0,0 +1,97 @@
<template>
<div>
<h1>快捷键操作如何传递自定义参数</h1>
<p>库提供了很多命令，比如插入子节点的<code>INSERT_CHILD_NODE</code>等，这些命令大多可以接收一定参数，比如在插入节点时我想指定初始文本和节点uid，那么可以这样调用：</p>
<pre class="hljs"><code>mindMap.execCommand(<span class="hljs-string">&#x27;INSERT_CHILD_NODE&#x27;</span>, <span class="hljs-literal">true</span>, [], {
<span class="hljs-attr">text</span>: <span class="hljs-string">&#x27;初始文本&#x27;</span>,
<span class="hljs-attr">uid</span>: <span class="hljs-string">&#x27;xxx&#x27;</span>
})
</code></pre>
<p>但是同时库内部也默认注册了很多快捷键，比如插入下级节点的<code>Tab</code>快捷键，很遗憾，目前快捷键操作无法让你传入自定义的参数，那么该怎么办呢，可以这样处理，首先确定你要给什么快捷键传入参数，比如<code>Tab</code>，那么首先可以调用如下方法删除库默认注册的快捷键：</p>
<pre class="hljs"><code><span class="hljs-keyword">const</span> keyName = <span class="hljs-string">&#x27;Tab&#x27;</span>
mindMap.keyCommand.removeShortcut(keyName)
</code></pre>
<p>然后再重新注册即可：</p>
<pre class="hljs"><code>mindMap.keyCommand.addShortcut(keyName, <span class="hljs-function">() =&gt;</span> {
mindMap.execCommand(<span class="hljs-string">&#x27;INSERT_CHILD_NODE&#x27;</span>, <span class="hljs-literal">true</span>, [], {
<span class="hljs-attr">text</span>: <span class="hljs-string">&#x27;初始文本&#x27;</span>,
<span class="hljs-attr">uid</span>: <span class="hljs-string">&#x27;xxx&#x27;</span>
})
})
</code></pre>
<p>库内部默认注册的快捷键对应的命令一览：</p>
<table>
<thead>
<tr>
<th>快捷键</th>
<th>命令</th>
</tr>
</thead>
<tbody>
<tr>
<td>Control+z</td>
<td>BACK</td>
</tr>
<tr>
<td>Control+y</td>
<td>FORWARD</td>
</tr>
<tr>
<td>Tab</td>
<td>INSERT_CHILD_NODE</td>
</tr>
<tr>
<td>Insert</td>
<td>INSERT_CHILD_NODE</td>
</tr>
<tr>
<td>Enter</td>
<td>INSERT_NODE</td>
</tr>
<tr>
<td>Shift+Tab</td>
<td>INSERT_PARENT_NODE</td>
</tr>
<tr>
<td>Control+g</td>
<td>ADD_GENERALIZATION</td>
</tr>
<tr>
<td>Del或Backspace</td>
<td>REMOVE_NODE</td>
</tr>
<tr>
<td>Shift+Backspace</td>
<td>REMOVE_CURRENT_NODE</td>
</tr>
<tr>
<td>Control+a</td>
<td>SELECT_ALL</td>
</tr>
<tr>
<td>Control+l</td>
<td>RESET_LAYOUT</td>
</tr>
<tr>
<td>Control+Up</td>
<td>UP_NODE</td>
</tr>
<tr>
<td>Control+Down</td>
<td>DOWN_NODE</td>
</tr>
</tbody>
</table>
</div>
</template>
<script>
export default {
}
</script>
<style>
</style>

10
web/src/pages/Doc/zh/node/index.md
View File

@@ -258,6 +258,16 @@
设置节点备注，`SET_NODE_NOTE`命令的快捷方法
### setAttachment(url, name)
> v0.9.10+
- `url`：附件的url；
- `name`：附件的名称，可选
设置节点附件，`SET_NODE_ATTACHMENT`命令的快捷方法
### setTag(tag)
设置节点标签，`SET_NODE_TAG`的快捷方法

13
web/src/pages/Doc/zh/node/index.vue
View File

@@ -188,6 +188,19 @@
<p>设置节点超链接，<code>SET_NODE_HYPERLINK</code>命令的快捷方法</p>
<h3>setNote(note)</h3>
<p>设置节点备注，<code>SET_NODE_NOTE</code>命令的快捷方法</p>
<h3>setAttachment(url, name)</h3>
<blockquote>
<p>v0.9.10+</p>
</blockquote>
<ul>
<li>
<p><code>url</code>：附件的url；</p>
</li>
<li>
<p><code>name</code>：附件的名称，可选</p>
</li>
</ul>
<p>设置节点附件，<code>SET_NODE_ATTACHMENT</code>命令的快捷方法</p>
<h3>setTag(tag)</h3>
<p>设置节点标签，<code>SET_NODE_TAG</code>的快捷方法</p>
<h3>hide()</h3>