From f8a345d8de51e3056f53fa764bc212a7d5eadc83 Mon Sep 17 00:00:00 2001
From: wanglin2 <1013335014@qq.com>
Date: Wed, 28 Jun 2023 16:28:47 +0800
Subject: [PATCH] Doc: update

---
 .../core/render/node/nodeCreateContents.js    |  2 +-
 web/src/pages/Doc/catalogList.js              |  1 +
 web/src/pages/Doc/en/changelog/index.md       |  6 +++++
 web/src/pages/Doc/en/changelog/index.vue      |  3 +++
 web/src/pages/Doc/en/constructor/index.md     |  4 +++
 web/src/pages/Doc/en/constructor/index.vue    | 22 +++++++++++++++
 web/src/pages/Doc/en/nodeImgAdjust/index.md   | 16 +++++++++++
 web/src/pages/Doc/en/nodeImgAdjust/index.vue  | 27 +++++++++++++++++++
 web/src/pages/Doc/en/start/index.md           |  2 ++
 web/src/pages/Doc/en/start/index.vue          |  1 +
 web/src/pages/Doc/en/utils/index.md           | 14 ++++++++++
 web/src/pages/Doc/en/utils/index.vue          |  9 +++++++
 web/src/pages/Doc/routerList.js               |  6 +++--
 web/src/pages/Doc/zh/changelog/index.md       |  6 +++++
 web/src/pages/Doc/zh/changelog/index.vue      |  3 +++
 web/src/pages/Doc/zh/constructor/index.md     |  4 +++
 web/src/pages/Doc/zh/constructor/index.vue    | 22 +++++++++++++++
 web/src/pages/Doc/zh/nodeImgAdjust/index.md   | 16 +++++++++++
 web/src/pages/Doc/zh/nodeImgAdjust/index.vue  | 27 +++++++++++++++++++
 web/src/pages/Doc/zh/start/index.md           |  2 ++
 web/src/pages/Doc/zh/start/index.vue          |  1 +
 web/src/pages/Doc/zh/utils/index.md           | 14 ++++++++++
 web/src/pages/Doc/zh/utils/index.vue          |  9 +++++++
 23 files changed, 214 insertions(+), 3 deletions(-)
 create mode 100644 web/src/pages/Doc/en/nodeImgAdjust/index.md
 create mode 100644 web/src/pages/Doc/en/nodeImgAdjust/index.vue
 create mode 100644 web/src/pages/Doc/zh/nodeImgAdjust/index.md
 create mode 100644 web/src/pages/Doc/zh/nodeImgAdjust/index.vue

diff --git a/simple-mind-map/src/core/render/node/nodeCreateContents.js b/simple-mind-map/src/core/render/node/nodeCreateContents.js
index 6073c1ba..9822484a 100644
--- a/simple-mind-map/src/core/render/node/nodeCreateContents.js
+++ b/simple-mind-map/src/core/render/node/nodeCreateContents.js
@@ -101,7 +101,7 @@ function createRichTextNode() {
   el.style.maxWidth = this.mindMap.opt.textAutoWrapWidth + 'px'
   this.mindMap.el.appendChild(div)
   let { width, height } = el.getBoundingClientRect()
-  width = Math.ceil(width)
+  width = Math.ceil(width) + 1// 修复getBoundingClientRect方法对实际宽度是小数的元素获取到的值是整数，导致宽度不够文本发生换行的问题
   height = Math.ceil(height)
   g.attr('data-width', width)
   g.attr('data-height', height)
diff --git a/web/src/pages/Doc/catalogList.js b/web/src/pages/Doc/catalogList.js
index f17a2f61..b709769d 100644
--- a/web/src/pages/Doc/catalogList.js
+++ b/web/src/pages/Doc/catalogList.js
@@ -31,6 +31,7 @@ let APIList = [
   'watermark',
   'associativeLine',
   'touchEvent',
+  'nodeImgAdjust',
   'xmind',
   'markdown',
   'utils'
diff --git a/web/src/pages/Doc/en/changelog/index.md b/web/src/pages/Doc/en/changelog/index.md
index ff8f518c..18ae71e7 100644
--- a/web/src/pages/Doc/en/changelog/index.md
+++ b/web/src/pages/Doc/en/changelog/index.md
@@ -1,5 +1,11 @@
 # Changelog
 
+## 0.6.5
+
+Fix: 1.Fix the issue of xmind file import errors. 2.Fixed a rare issue where line breaks occur when the width of the node text is decimal.
+
+New: 1.The packaged library supports obtaining built-in constants, themes, and other data. 2.Supports configuring the zoom behavior corresponding to the direction of the mouse wheel. 3.Node images support dragging and resizing.
+
 ## 0.6.4-fix.1
 
 New: 1.When zooming with the mouse wheel, the default zoom is centered around the current position of the mouse, which can be turned off by configuring.
diff --git a/web/src/pages/Doc/en/changelog/index.vue b/web/src/pages/Doc/en/changelog/index.vue
index fe62e971..481aed2a 100644
--- a/web/src/pages/Doc/en/changelog/index.vue
+++ b/web/src/pages/Doc/en/changelog/index.vue
@@ -1,6 +1,9 @@
 <template>
   <div>
     <h1>Changelog</h1>
+<h2>0.6.5</h2>
+<p>Fix: 1.Fix the issue of xmind file import errors.</p>
+<p>New: 1.The packaged library supports obtaining built-in constants, themes, and other data. 2.Supports configuring the zoom behavior corresponding to the direction of the mouse wheel. 3.Node images support dragging and resizing.</p>
 <h2>0.6.4-fix.1</h2>
 <p>New: 1.When zooming with the mouse wheel, the default zoom is centered around the current position of the mouse, which can be turned off by configuring.</p>
 <p>Fix: 1.Fixed an issue where the default value of the zoom center point was not updated after changing the canvas size.</p>
diff --git a/web/src/pages/Doc/en/constructor/index.md b/web/src/pages/Doc/en/constructor/index.md
index 5f34ce77..aee2e43b 100644
--- a/web/src/pages/Doc/en/constructor/index.md
+++ b/web/src/pages/Doc/en/constructor/index.md
@@ -45,6 +45,7 @@ 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`  |          |
+| mousewheelZoomActionReverse（v0.6.5+）     | Boolean  | false | When `mousewheelAction` is set to `zoom`, the default scrolling forward is to zoom out, and scrolling backward is to zoom in. If this property is set to true, it will be reversed   |          |
 | 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               |          |
 | expandBtnStyle（v0.5.0+）     | Object  | { color: '#808080', fill: '#fff' } | Expand the color of the stow button  |          |
@@ -234,6 +235,9 @@ Listen to an event. Event list:
 | 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)                                                                                              |
 | 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）                              |
+| node_img_mousemove（v0.6.5+）    |  Node image mousemove event                      | this（node instance）、imgNode（img node）、e（event object）                              |
 | node_tree_render_end（v0.2.16+） | Node tree render end event                                               |                                                                                                                 |
 | rich_text_selection_change（v0.4.0+）         |  Available when the `RichText` plugin is registered. Triggered when the text selection area changes when the node is edited         |  hasRange（Whether there is a selection）、rectInfo（Size and location information of the selected area）、formatInfo（Text formatting information of the selected area）            |
 | transforming-dom-to-images（v0.4.0+）         |  Available when the `RichText` plugin is registered. When there is a `DOM` node in `svg`, the `DOM` node will be converted to an image when exporting to an image. This event will be triggered during the conversion process. You can use this event to prompt the user about the node to which you are currently converting         |  index（Index of the node currently converted to）、len（Total number of nodes to be converted）            |
diff --git a/web/src/pages/Doc/en/constructor/index.vue b/web/src/pages/Doc/en/constructor/index.vue
index 102311f2..c824c0ef 100644
--- a/web/src/pages/Doc/en/constructor/index.vue
+++ b/web/src/pages/Doc/en/constructor/index.vue
@@ -176,6 +176,13 @@
 <td></td>
 </tr>
 <tr>
+<td>mousewheelZoomActionReverse（v0.6.5+）</td>
+<td>Boolean</td>
+<td>false</td>
+<td>When <code>mousewheelAction</code> is set to <code>zoom</code>, the default scrolling forward is to zoom out, and scrolling backward is to zoom in. If this property is set to true, it will be reversed</td>
+<td></td>
+</tr>
+<tr>
 <td>defaultInsertSecondLevelNodeText（v0.4.7+）</td>
 <td>String</td>
 <td>二级节点</td>
@@ -653,6 +660,21 @@ poor performance and should be used sparingly.</p>
 <td>this (node instance), e (event object)</td>
 </tr>
 <tr>
+<td>node_img_mouseenter（v0.6.5+）</td>
+<td>Node image mouseenter event</td>
+<td>this（node instance）、imgNode（img node）、e（event object）</td>
+</tr>
+<tr>
+<td>node_img_mouseleave（v0.6.5+）</td>
+<td>Node image mouseleave event</td>
+<td>this（node instance）、imgNode（img node）、e（event object）</td>
+</tr>
+<tr>
+<td>node_img_mousemove（v0.6.5+）</td>
+<td>Node image mousemove event</td>
+<td>this（node instance）、imgNode（img node）、e（event object）</td>
+</tr>
+<tr>
 <td>node_tree_render_end（v0.2.16+）</td>
 <td>Node tree render end event</td>
 <td></td>
diff --git a/web/src/pages/Doc/en/nodeImgAdjust/index.md b/web/src/pages/Doc/en/nodeImgAdjust/index.md
new file mode 100644
index 00000000..5527e2a0
--- /dev/null
+++ b/web/src/pages/Doc/en/nodeImgAdjust/index.md
@@ -0,0 +1,16 @@
+# NodeImgAdjust plugin
+
+> v0.6.5+
+
+This plugin provides the function of dragging and adjusting the size of images within nodes.
+
+## Register
+
+```js
+import MindMap from 'simple-mind-map'
+import NodeImgAdjust from 'simple-mind-map/src/plugins/NodeImgAdjust.js'
+
+MindMap.usePlugin(NodeImgAdjust)
+```
+
+After registration and instantiation of `MindMap`, the instance can be obtained through `mindMap.nodeImgAdjust`.
\ No newline at end of file
diff --git a/web/src/pages/Doc/en/nodeImgAdjust/index.vue b/web/src/pages/Doc/en/nodeImgAdjust/index.vue
new file mode 100644
index 00000000..08e6eb0c
--- /dev/null
+++ b/web/src/pages/Doc/en/nodeImgAdjust/index.vue
@@ -0,0 +1,27 @@
+<template>
+  <div>
+    <h1>NodeImgAdjust plugin</h1>
+<blockquote>
+<p>v0.6.5+</p>
+</blockquote>
+<p>This plugin provides the function of dragging and adjusting the size of images within nodes.</p>
+<h2>Register</h2>
+<pre class="hljs"><code><span class="hljs-keyword">import</span> MindMap <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map&#x27;</span>
+<span class="hljs-keyword">import</span> NodeImgAdjust <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map/src/plugins/NodeImgAdjust.js&#x27;</span>
+
+MindMap.usePlugin(NodeImgAdjust)
+</code></pre>
+<p>After registration and instantiation of <code>MindMap</code>, the instance can be obtained through <code>mindMap.nodeImgAdjust</code>.</p>
+
+  </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file
diff --git a/web/src/pages/Doc/en/start/index.md b/web/src/pages/Doc/en/start/index.md
index 7531d047..e76ddf9f 100644
--- a/web/src/pages/Doc/en/start/index.md
+++ b/web/src/pages/Doc/en/start/index.md
@@ -112,6 +112,8 @@ cd web
 npm run buildLibrary
 ```
 
+The packaging entry is `simple-mind-map/full.js`, which will introduce all plugins by default. If you don't need all plugins, you can modify the file to only introduce the plugins you need, which can reduce the size of the packaged file.
+
 The `package.json` file in the `simple-mind-map` library provides two export
 fields:
 
diff --git a/web/src/pages/Doc/en/start/index.vue b/web/src/pages/Doc/en/start/index.vue
index 40a59e22..6ad429f9 100644
--- a/web/src/pages/Doc/en/start/index.vue
+++ b/web/src/pages/Doc/en/start/index.vue
@@ -80,6 +80,7 @@ simple-mind-map. This uses the same packaging tool as the sample project web.</p
 <pre class="hljs"><code><span class="hljs-built_in">cd</span> web
 npm run buildLibrary
 </code></pre>
+<p>The packaging entry is <code>simple-mind-map/full.js</code>, which will introduce all plugins by default. If you don't need all plugins, you can modify the file to only introduce the plugins you need, which can reduce the size of the packaged file.</p>
 <p>The <code>package.json</code> file in the <code>simple-mind-map</code> library provides two export
 fields:</p>
 <pre class="hljs"><code>{
diff --git a/web/src/pages/Doc/en/utils/index.md b/web/src/pages/Doc/en/utils/index.md
index dc7db33a..a7cb0764 100644
--- a/web/src/pages/Doc/en/utils/index.md
+++ b/web/src/pages/Doc/en/utils/index.md
@@ -10,6 +10,20 @@ import {walk, ...} from 'simple-mind-map/src/utils'
 
 ### Methods
 
+#### resizeImgSizeByOriginRatio(width, height, newWidth, newHeight)
+
+> v0.6.5+
+
+`width`: The original width of the image
+
+`height`：The original height of the image
+
+`newWidth`：Width to zoom in to
+
+`newHeight`：Height to zoom in to
+
+Scale the image proportionally. Zoom to the specified size of `newWidth` and `newHeight` while maintaining the original aspect ratio of the image.
+
 #### walk(root, parent, beforeCallback, afterCallback, isRoot, layerIndex = 0, index = 0)
 
 Depth-first traversal of a tree
diff --git a/web/src/pages/Doc/en/utils/index.vue b/web/src/pages/Doc/en/utils/index.vue
index be49919e..9899a4e5 100644
--- a/web/src/pages/Doc/en/utils/index.vue
+++ b/web/src/pages/Doc/en/utils/index.vue
@@ -6,6 +6,15 @@
 <pre class="hljs"><code><span class="hljs-keyword">import</span> {walk, ...} <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map/src/utils&#x27;</span>
 </code></pre>
 <h3>Methods</h3>
+<h4>resizeImgSizeByOriginRatio(width, height, newWidth, newHeight)</h4>
+<blockquote>
+<p>v0.6.5+</p>
+</blockquote>
+<p><code>width</code>: The original width of the image</p>
+<p><code>height</code>：The original height of the image</p>
+<p><code>newWidth</code>：Width to zoom in to</p>
+<p><code>newHeight</code>：Height to zoom in to</p>
+<p>Scale the image proportionally. Zoom to the specified size of <code>newWidth</code> and <code>newHeight</code> while maintaining the original aspect ratio of the image.</p>
 <h4>walk(root, parent, beforeCallback, afterCallback, isRoot, layerIndex = 0, index = 0)</h4>
 <p>Depth-first traversal of a tree</p>
 <p><code>root</code>: the root node of the tree to be traversed</p>
diff --git a/web/src/pages/Doc/routerList.js b/web/src/pages/Doc/routerList.js
index 2ee74312..1f08e498 100644
--- a/web/src/pages/Doc/routerList.js
+++ b/web/src/pages/Doc/routerList.js
@@ -46,7 +46,8 @@ export default [
       { path: 'xmind', title: 'XMind解析' },
       { path: 'deploy', title: '部署' },
       { path: 'client', title: '客户端' },
-      { path: 'touchEvent', title: 'TouchEvent插件' }
+      { path: 'touchEvent', title: 'TouchEvent插件' },
+      { path: 'nodeImgAdjust', title: 'NodeImgAdjust插件' }
     ]
   },
   {
@@ -75,7 +76,8 @@ export default [
       { path: 'watermark', title: 'Watermark plugin' },
       { path: 'xmind', title: 'XMind parse' },
       { path: 'deploy', title: 'Deploy' },
-      { path: 'touchEvent', title: 'TouchEvent plugin' }
+      { path: 'touchEvent', title: 'TouchEvent plugin' },
+      { path: 'nodeImgAdjust', title: 'NodeImgAdjust plugin' }
     ]
   }
 ]
diff --git a/web/src/pages/Doc/zh/changelog/index.md b/web/src/pages/Doc/zh/changelog/index.md
index 4c516e08..e8f9d067 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.6.5
+
+修复：1.修复xmind文件导入报错的问题。 2.修复极少数情况下当节点文本的宽度为小数时显示发生换行的问题。
+
+新增：1.打包后的库支持获取内置常量、主题等数据。 2.支持配置鼠标滚轮方向对应的缩放行为。 3.节点图片支持拖拽调整大小。
+
 ## 0.6.4-fix.1
 
 新增：1.鼠标滚轮缩放时默认以鼠标当前位置为中心进行缩放，可以通过配置关闭该特性。
diff --git a/web/src/pages/Doc/zh/changelog/index.vue b/web/src/pages/Doc/zh/changelog/index.vue
index 52084788..5e911f2b 100644
--- a/web/src/pages/Doc/zh/changelog/index.vue
+++ b/web/src/pages/Doc/zh/changelog/index.vue
@@ -1,6 +1,9 @@
 <template>
   <div>
     <h1>Changelog</h1>
+<h2>0.6.5</h2>
+<p>修复：1.修复xmind文件导入报错的问题。</p>
+<p>新增：1.打包后的库支持获取内置常量、主题等数据。 2.支持配置鼠标滚轮方向对应的缩放行为。 3.节点图片支持拖拽调整大小。</p>
 <h2>0.6.4-fix.1</h2>
 <p>新增：1.鼠标滚轮缩放时默认以鼠标当前位置为中心进行缩放，可以通过配置关闭该特性。</p>
 <p>修复：1.修复改变了画布大小后缩放中心点默认值不随之更新的问题。</p>
diff --git a/web/src/pages/Doc/zh/constructor/index.md b/web/src/pages/Doc/zh/constructor/index.md
index 0b3e3e87..8d9e7b1b 100644
--- a/web/src/pages/Doc/zh/constructor/index.md
+++ b/web/src/pages/Doc/zh/constructor/index.md
@@ -45,6 +45,7 @@ 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`               |          |
+| mousewheelZoomActionReverse（v0.6.5+）     | Boolean  | false |  当mousewheelAction设为zoom时，默认向前滚动是缩小，向后滚动是放大，如果该属性设为true，那么会反过来  |          |
 | defaultInsertSecondLevelNodeText（v0.4.7+）     | String  | 二级节点 | 默认插入的二级节点的文字               |          |
 | defaultInsertBelowSecondLevelNodeText（v0.4.7+）     | String  | 分支主题 | 默认插入的二级以下节点的文字               |          |
 | expandBtnStyle（v0.5.0+）     | Object  | { color: '#808080', fill: '#fff' } | 展开收起按钮的颜色  |          |
@@ -229,6 +230,9 @@ mindMap.setTheme('主题名称')
 | hide_text_edit                   | 节点文本编辑框关闭事件                     | textEditNode（文本编辑框DOM节点）、activeNodeList（当前激活的所有节点列表） |
 | scale                            | 放大缩小事件                               | scale（缩放比例）                                            |
 | 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（事件对象）                              |
+| node_img_mousemove（v0.6.5+）    |  节点内图片的鼠标移动事件                      | this（节点实例）、imgNode（图片节点）、e（事件对象）                              |
 | node_tree_render_end（v0.2.16+） | 节点树渲染完毕事件                         |                                                              |
 | rich_text_selection_change（v0.4.0+）         |  当注册了`RichText`插件时可用。当节点编辑时，文本选区发生改变时触发         |  hasRange（是否存在选区）、rectInfo（选区的尺寸和位置信息）、formatInfo（选区的文本格式化信息）            |
 | transforming-dom-to-images（v0.4.0+）         |  当注册了`RichText`插件时可用。当`svg`中存在`DOM`节点时，导出为图片时会将`DOM`节点转换为图片，转换过程中会触发该事件，可用通过该事件给用户提示，告知目前转换到的节点         |  index（当前转换到的节点索引）、len（一共需要转换的节点数量）            |
diff --git a/web/src/pages/Doc/zh/constructor/index.vue b/web/src/pages/Doc/zh/constructor/index.vue
index 536946a6..47cd694f 100644
--- a/web/src/pages/Doc/zh/constructor/index.vue
+++ b/web/src/pages/Doc/zh/constructor/index.vue
@@ -176,6 +176,13 @@
 <td></td>
 </tr>
 <tr>
+<td>mousewheelZoomActionReverse（v0.6.5+）</td>
+<td>Boolean</td>
+<td>false</td>
+<td>当mousewheelAction设为zoom时，默认向前滚动是缩小，向后滚动是放大，如果该属性设为true，那么会反过来</td>
+<td></td>
+</tr>
+<tr>
 <td>defaultInsertSecondLevelNodeText（v0.4.7+）</td>
 <td>String</td>
 <td>二级节点</td>
@@ -646,6 +653,21 @@ mindMap.setTheme(<span class="hljs-string">&#x27;主题名称&#x27;</span>)
 <td>this（节点实例）、e（事件对象）</td>
 </tr>
 <tr>
+<td>node_img_mouseenter（v0.6.5+）</td>
+<td>节点内图片的鼠标移入事件</td>
+<td>this（节点实例）、imgNode（图片节点）、e（事件对象）</td>
+</tr>
+<tr>
+<td>node_img_mouseleave（v0.6.5+）</td>
+<td>节点内图片的鼠标移出事件</td>
+<td>this（节点实例）、imgNode（图片节点）、e（事件对象）</td>
+</tr>
+<tr>
+<td>node_img_mousemove（v0.6.5+）</td>
+<td>节点内图片的鼠标移动事件</td>
+<td>this（节点实例）、imgNode（图片节点）、e（事件对象）</td>
+</tr>
+<tr>
 <td>node_tree_render_end（v0.2.16+）</td>
 <td>节点树渲染完毕事件</td>
 <td></td>
diff --git a/web/src/pages/Doc/zh/nodeImgAdjust/index.md b/web/src/pages/Doc/zh/nodeImgAdjust/index.md
new file mode 100644
index 00000000..80a88e73
--- /dev/null
+++ b/web/src/pages/Doc/zh/nodeImgAdjust/index.md
@@ -0,0 +1,16 @@
+# NodeImgAdjust插件
+
+> v0.6.5+
+
+该插件提供拖拽调整节点内图片大小的功能。
+
+## 注册
+
+```js
+import MindMap from 'simple-mind-map'
+import NodeImgAdjust from 'simple-mind-map/src/plugins/NodeImgAdjust.js'
+
+MindMap.usePlugin(NodeImgAdjust)
+```
+
+注册完且实例化`MindMap`后可通过`mindMap.nodeImgAdjust`获取到该实例。
\ No newline at end of file
diff --git a/web/src/pages/Doc/zh/nodeImgAdjust/index.vue b/web/src/pages/Doc/zh/nodeImgAdjust/index.vue
new file mode 100644
index 00000000..868c1580
--- /dev/null
+++ b/web/src/pages/Doc/zh/nodeImgAdjust/index.vue
@@ -0,0 +1,27 @@
+<template>
+  <div>
+    <h1>NodeImgAdjust插件</h1>
+<blockquote>
+<p>v0.6.5+</p>
+</blockquote>
+<p>该插件提供拖拽调整节点内图片大小的功能。</p>
+<h2>注册</h2>
+<pre class="hljs"><code><span class="hljs-keyword">import</span> MindMap <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map&#x27;</span>
+<span class="hljs-keyword">import</span> NodeImgAdjust <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map/src/plugins/NodeImgAdjust.js&#x27;</span>
+
+MindMap.usePlugin(NodeImgAdjust)
+</code></pre>
+<p>注册完且实例化<code>MindMap</code>后可通过<code>mindMap.nodeImgAdjust</code>获取到该实例。</p>
+
+  </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file
diff --git a/web/src/pages/Doc/zh/start/index.md b/web/src/pages/Doc/zh/start/index.md
index 8d3ce04f..e6998a65 100644
--- a/web/src/pages/Doc/zh/start/index.md
+++ b/web/src/pages/Doc/zh/start/index.md
@@ -106,6 +106,8 @@ cd web
 npm run buildLibrary
 ```
 
+打包入口为`simple-mind-map/full.js`，默认会引入所有插件，如果你不需要所有插件的话，那么可以修改该文件，只引入你需要的插件，这样可以减少打包后的文件体积。
+
 `simple-mind-map`库的`package.json`文件提供了两个导出字段：
 
 ```json
diff --git a/web/src/pages/Doc/zh/start/index.vue b/web/src/pages/Doc/zh/start/index.vue
index c1a26a82..45a59f93 100644
--- a/web/src/pages/Doc/zh/start/index.vue
+++ b/web/src/pages/Doc/zh/start/index.vue
@@ -73,6 +73,7 @@ npm run serve
 <pre class="hljs"><code><span class="hljs-built_in">cd</span> web
 npm run buildLibrary
 </code></pre>
+<p>打包入口为<code>simple-mind-map/full.js</code>，默认会引入所有插件，如果你不需要所有插件的话，那么可以修改该文件，只引入你需要的插件，这样可以减少打包后的文件体积。</p>
 <p><code>simple-mind-map</code>库的<code>package.json</code>文件提供了两个导出字段：</p>
 <pre class="hljs"><code>{
   <span class="hljs-attr">&quot;module&quot;</span>: <span class="hljs-string">&quot;index.js&quot;</span>,
diff --git a/web/src/pages/Doc/zh/utils/index.md b/web/src/pages/Doc/zh/utils/index.md
index 308acda2..57988fcc 100644
--- a/web/src/pages/Doc/zh/utils/index.md
+++ b/web/src/pages/Doc/zh/utils/index.md
@@ -10,6 +10,20 @@ import {walk, ...} from 'simple-mind-map/src/utils'
 
 ### 方法
 
+#### resizeImgSizeByOriginRatio(width, height, newWidth, newHeight)
+
+> v0.6.5+
+
+`width`: 图片原始的宽度
+
+`height`：图片原始的高度
+
+`newWidth`：要缩放到的宽度
+
+`newHeight`：要缩放到的高度
+
+按比例缩放图片。在保持图片原始宽高比的情况下缩放到指定的`newWidth`、`newHeight`大小。
+
 #### walk(root, parent, beforeCallback, afterCallback, isRoot, layerIndex = 0, index = 0)
 
 深度优先遍历树
diff --git a/web/src/pages/Doc/zh/utils/index.vue b/web/src/pages/Doc/zh/utils/index.vue
index 85446ffd..9e90611e 100644
--- a/web/src/pages/Doc/zh/utils/index.vue
+++ b/web/src/pages/Doc/zh/utils/index.vue
@@ -6,6 +6,15 @@
 <pre class="hljs"><code><span class="hljs-keyword">import</span> {walk, ...} <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;simple-mind-map/src/utils&#x27;</span>
 </code></pre>
 <h3>方法</h3>
+<h4>resizeImgSizeByOriginRatio(width, height, newWidth, newHeight)</h4>
+<blockquote>
+<p>v0.6.5+</p>
+</blockquote>
+<p><code>width</code>: 图片原始的宽度</p>
+<p><code>height</code>：图片原始的高度</p>
+<p><code>newWidth</code>：要缩放到的宽度</p>
+<p><code>newHeight</code>：要缩放到的高度</p>
+<p>按比例缩放图片。在保持图片原始宽高比的情况下缩放到指定的<code>newWidth</code>、<code>newHeight</code>大小。</p>
 <h4>walk(root, parent, beforeCallback, afterCallback, isRoot, layerIndex = 0, index = 0)</h4>
 <p>深度优先遍历树</p>
 <p><code>root</code>：要遍历的树的根节点</p>