mirror of
https://github.com/wanglin2/mind-map.git
synced 2026-02-21 10:27:44 +08:00
Doc: update
This commit is contained in:
街角小林
parent
6a4e87af7b
commit
1083138d8c
@ -32,7 +32,7 @@ Demo:
|
||||
>
|
||||
> 4.Add two new themes;
|
||||
>
|
||||
> 5.Fix the issue of text wrapping not taking effect in the outline and displaying the br tag;
|
||||
> 5.Fix the issue of text wrapping not taking effect in the outline and displaying the br tag;
|
||||
|
||||
## 0.9.5
|
||||
|
||||
|
||||
@ -5,6 +5,9 @@
|
||||
<p>Fix:</p>
|
||||
<blockquote>
|
||||
<p>1.Fix the issue where the style of the collapsed nodes remains unchanged when switching themes;</p>
|
||||
<p>2.Fix the issue of losing the new text style when switching themes for text wrapping;</p>
|
||||
<p>3.Fix the issue where the style of the newline text remains unchanged when switching themes;</p>
|
||||
<p>4.Fixed the issue of adding mathematical formulas to nodes and not changing the text style when switching themes;</p>
|
||||
</blockquote>
|
||||
<p>New:</p>
|
||||
<blockquote>
|
||||
@ -18,6 +21,8 @@
|
||||
<p>1.The outline supports pressing Shift+Tab to move nodes up one level;</p>
|
||||
<p>2.Support setting the position of node arrow display;</p>
|
||||
<p>3.Support setting the starting position of root node connections;</p>
|
||||
<p>4.Add two new themes;</p>
|
||||
<p>5.Fix the issue of text wrapping not taking effect in the outline and displaying the br tag;</p>
|
||||
</blockquote>
|
||||
<h2>0.9.5</h2>
|
||||
<p>Fix:</p>
|
||||
|
||||
@ -389,6 +389,19 @@ and copying the <code>data</code> of the data object, example:</p>
|
||||
<p>v0.9.3+</p>
|
||||
</blockquote>
|
||||
<p>Convert flat objects into a tree structure. Reverse operation of the transformTreeDataToObject method.</p>
|
||||
<h4>removeHtmlNodeByClass(html, selector)</h4>
|
||||
<blockquote>
|
||||
<p>v0.9.6+</p>
|
||||
</blockquote>
|
||||
<ul>
|
||||
<li>
|
||||
<p><code>html</code>：html string</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><code>selector</code>：Node selectors, such as class selectors and id selectors</p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Remove the node of the specified selector from the specified HTML string, and then return the processed HTML string.</p>
|
||||
<h2>Simulate CSS background in Canvas</h2>
|
||||
<p>Import:</p>
|
||||
<pre class="hljs"><code><span class="hljs-keyword">import</span> drawBackgroundImageToCanvas <span class="hljs-keyword">from</span> <span class="hljs-string">'simple-mind-map/src/utils/simulateCSSBackgroundInCanvas'</span>
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
>
|
||||
> 3.Mac 双指触摸事件移动画布增加一点灵敏度；
|
||||
>
|
||||
> 4.新增 MOVE_UP_ONE_LEVEL 命令，用于将节点上移一个层级；
|
||||
> 4.新增 MOVE_UP_ONE_LEVEL 命令，用于将节点上移一个层级;
|
||||
|
||||
Demo：
|
||||
|
||||
|
||||
@ -5,19 +5,24 @@
|
||||
<p>修复：</p>
|
||||
<blockquote>
|
||||
<p>1.修复切换主题时，被收起的节点样式没有改变的问题；</p>
|
||||
<p>2.修复切换主题后进行文本换行时，新换行的文本样式会丢失的问题；</p>
|
||||
<p>3.修复切换主题时，换行的文本样式没有改变的问题；</p>
|
||||
<p>4.修复添加了数学公式的节点，切换主题时文本样式没有改变的问题；</p>
|
||||
</blockquote>
|
||||
<p>新增：</p>
|
||||
<blockquote>
|
||||
<p>1.主题新增字段，用于设置节点连线箭头的显示位置，头部或者尾部；</p>
|
||||
<p>2.主题新增字段，用于设置曲线连接时，根节点连线的起始位置；</p>
|
||||
<p>3.Mac 双指触摸事件移动画布增加一点灵敏度；</p>
|
||||
<p>4.新增 MOVE_UP_ONE_LEVEL 命令，用于将节点上移一个层级；</p>
|
||||
<p>4.新增 MOVE_UP_ONE_LEVEL 命令，用于将节点上移一个层级;</p>
|
||||
</blockquote>
|
||||
<p>Demo：</p>
|
||||
<blockquote>
|
||||
<p>1.大纲支持按 Shift+Tab 键将节点上移一个层级；</p>
|
||||
<p>2.支持设置节点箭头显示的位置；</p>
|
||||
<p>3.支持设置根节点连线的起始位置；</p>
|
||||
<p>4.新增两个主题；</p>
|
||||
<p>5.修复大纲中文本换行不生效，显示br标签的问题；</p>
|
||||
</blockquote>
|
||||
<h2>0.9.5</h2>
|
||||
<p>修复：</p>
|
||||
|
||||
@ -25,7 +25,15 @@
|
||||
<p><code>layerIndex</code>：节点层级</p>
|
||||
<p><code>index</code>：节点在同级节点里的索引</p>
|
||||
<p>示例：</p>
|
||||
<pre class="hljs"><code>walk(tree, <span class="hljs-literal">null</span>, <span class="hljs-function">() =></span> {}, <span class="hljs-function">() =></span> {}, <span class="hljs-literal">false</span>, <span class="hljs-number">0</span>, <span class="hljs-number">0</span>)
|
||||
<pre class="hljs"><code>walk(
|
||||
tree,
|
||||
<span class="hljs-literal">null</span>,
|
||||
<span class="hljs-function">() =></span> {},
|
||||
<span class="hljs-function">() =></span> {},
|
||||
<span class="hljs-literal">false</span>,
|
||||
<span class="hljs-number">0</span>,
|
||||
<span class="hljs-number">0</span>
|
||||
)
|
||||
</code></pre>
|
||||
<h4>bfsWalk(root, callback)</h4>
|
||||
<p>广度优先遍历树</p>
|
||||
@ -50,7 +58,7 @@
|
||||
<p><code>removeActiveState</code>：<code>Boolean</code>，默认为<code>false</code>，是否移除节点的激活状态</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><code>removeId</code>：v0.7.3-fix.1+，是否移除节点数据中的uid，默认为<code>true</code></p>
|
||||
<p><code>removeId</code>：v0.7.3-fix.1+，是否移除节点数据中的 uid，默认为<code>true</code></p>
|
||||
</li>
|
||||
</ul>
|
||||
<blockquote>
|
||||
@ -62,7 +70,7 @@
|
||||
<pre class="hljs"><code>copyNodeTree({}, node)
|
||||
</code></pre>
|
||||
<h4>imgToDataUrl(src)</h4>
|
||||
<p>图片转成dataURL</p>
|
||||
<p>图片转成 dataURL</p>
|
||||
<h4>downloadFile(file, fileName)</h4>
|
||||
<p>下载文件</p>
|
||||
<h4>throttle(fn, time = 300, ctx)</h4>
|
||||
@ -89,10 +97,12 @@
|
||||
<p>v0.3.4+</p>
|
||||
</blockquote>
|
||||
<p>测量文本的宽高，返回值：</p>
|
||||
<pre class="hljs"><code>{ width, height }
|
||||
<pre class="hljs"><code>{
|
||||
width, height
|
||||
}
|
||||
</code></pre>
|
||||
<h4>getTextFromHtml(html)</h4>
|
||||
<p>提取html字符串里的纯文本内容。</p>
|
||||
<p>提取 html 字符串里的纯文本内容。</p>
|
||||
<h4>readBlob(blob)</h4>
|
||||
<blockquote>
|
||||
<p>v0.5.9+</p>
|
||||
@ -104,8 +114,8 @@
|
||||
</blockquote>
|
||||
<p>解析<code>data:url</code>数据，返回：</p>
|
||||
<pre class="hljs"><code>{
|
||||
type,<span class="hljs-comment">// 数据的文件类型</span>
|
||||
base64<span class="hljs-comment">// base64数据</span>
|
||||
type, <span class="hljs-comment">// 数据的文件类型</span>
|
||||
base64 <span class="hljs-comment">// base64数据</span>
|
||||
}
|
||||
</code></pre>
|
||||
<h4>getImageSize(src)</h4>
|
||||
@ -113,12 +123,11 @@
|
||||
<p>v0.6.6+</p>
|
||||
</blockquote>
|
||||
<ul>
|
||||
<li><code>src</code>：图片的url</li>
|
||||
<li><code>src</code>：图片的 url</li>
|
||||
</ul>
|
||||
<p>获取图片的大小。返回：</p>
|
||||
<pre class="hljs"><code>{
|
||||
width,
|
||||
height
|
||||
width, height
|
||||
}
|
||||
</code></pre>
|
||||
<h4>loadImage(imgFile)</h4>
|
||||
@ -126,12 +135,12 @@
|
||||
<p>v0.6.8+</p>
|
||||
</blockquote>
|
||||
<ul>
|
||||
<li><code>imgFile</code>：图片类型的File对象</li>
|
||||
<li><code>imgFile</code>：图片类型的 File 对象</li>
|
||||
</ul>
|
||||
<p>加载图片，返回：</p>
|
||||
<pre class="hljs"><code>{
|
||||
url,<span class="hljs-comment">// DataUrl</span>
|
||||
size<span class="hljs-comment">// { width, height } 图片宽高</span>
|
||||
url, <span class="hljs-comment">// DataUrl</span>
|
||||
size <span class="hljs-comment">// { width, height } 图片宽高</span>
|
||||
}
|
||||
</code></pre>
|
||||
<h4>getType(data)</h4>
|
||||
@ -143,12 +152,12 @@
|
||||
<blockquote>
|
||||
<p>v0.6.10+</p>
|
||||
</blockquote>
|
||||
<p>移除html字符串中节点的内联样式。</p>
|
||||
<p>移除 html 字符串中节点的内联样式。</p>
|
||||
<h4>addHtmlStyle(html, tag, style)</h4>
|
||||
<blockquote>
|
||||
<p>v0.6.10+</p>
|
||||
</blockquote>
|
||||
<p>给html标签中指定的标签添加内联样式。</p>
|
||||
<p>给 html 标签中指定的标签添加内联样式。</p>
|
||||
<h4>checkIsRichText(str)</h4>
|
||||
<blockquote>
|
||||
<p>v0.6.10+</p>
|
||||
@ -198,7 +207,7 @@
|
||||
<p>v0.7.2+</p>
|
||||
</blockquote>
|
||||
<ul>
|
||||
<li><code>el</code>：DOM节点，可聚焦的元素，一般为输入框元素。</li>
|
||||
<li><code>el</code>：DOM 节点，可聚焦的元素，一般为输入框元素。</li>
|
||||
</ul>
|
||||
<p>聚焦指定输入框。</p>
|
||||
<h4>selectAllInput(el)</h4>
|
||||
@ -206,7 +215,7 @@
|
||||
<p>v0.7.2+</p>
|
||||
</blockquote>
|
||||
<ul>
|
||||
<li><code>el</code>：DOM节点，可聚焦的元素，一般为输入框元素。</li>
|
||||
<li><code>el</code>：DOM 节点，可聚焦的元素，一般为输入框元素。</li>
|
||||
</ul>
|
||||
<p>聚焦并全选指定输入框。</p>
|
||||
<h4>addDataToAppointNodes(appointNodes, data = {})</h4>
|
||||
@ -234,7 +243,7 @@
|
||||
<p><code>createNewId</code>：v0.7.3-fix.1+，<code>Boolean</code>，默认为<code>false</code>，即如果节点不存在<code>uid</code>的话，会创建新的<code>uid</code>。如果传<code>true</code>，那么无论节点数据原来是否存在<code>uid</code>，都会创建新的<code>uid</code></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>给指定的节点列表树数据添加uid（如果uid不存在的话），会修改原数据。</p>
|
||||
<p>给指定的节点列表树数据添加 uid（如果 uid 不存在的话），会修改原数据。</p>
|
||||
<h4>getNodeIndex(node)</h4>
|
||||
<blockquote>
|
||||
<p>v0.7.2+</p>
|
||||
@ -314,8 +323,7 @@
|
||||
</blockquote>
|
||||
<p>从用户剪贴板中读取文字和图片，返回：</p>
|
||||
<pre class="hljs"><code>{
|
||||
text,
|
||||
img
|
||||
text, img
|
||||
}
|
||||
</code></pre>
|
||||
<h4>removeFromParentNodeData(node)</h4>
|
||||
@ -333,9 +341,9 @@
|
||||
<p>v0.9.1+</p>
|
||||
</blockquote>
|
||||
<ul>
|
||||
<li><code>str</code>：html字符串</li>
|
||||
<li><code>str</code>：html 字符串</li>
|
||||
</ul>
|
||||
<p>给html自闭合标签添加闭合状态，<code><div><img src="xxx"></div></code> -> <code><div><img src="xxx" /></div></code>。</p>
|
||||
<p>给 html 自闭合标签添加闭合状态，<code><div><img src="xxx"></div></code> -> <code><div><img src="xxx" /></div></code>。</p>
|
||||
<h4>checkNodeListIsEqual(list1, list2)</h4>
|
||||
<blockquote>
|
||||
<p>v0.9.1+</p>
|
||||
@ -383,8 +391,21 @@
|
||||
<blockquote>
|
||||
<p>v0.9.3+</p>
|
||||
</blockquote>
|
||||
<p>将平级对象转树结构。transformTreeDataToObject方法的反向操作。</p>
|
||||
<h2>在canvas中模拟css的背景属性</h2>
|
||||
<p>将平级对象转树结构。transformTreeDataToObject 方法的反向操作。</p>
|
||||
<h4>removeHtmlNodeByClass(html, selector)</h4>
|
||||
<blockquote>
|
||||
<p>v0.9.6+</p>
|
||||
</blockquote>
|
||||
<ul>
|
||||
<li>
|
||||
<p><code>html</code>：html 字符串</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><code>selector</code>：节点选择器，比如类选择器，id 选择器</p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>去除指定 html 字符串中指定选择器的节点，然后返回处理后的 html 字符串。</p>
|
||||
<h2>在 canvas 中模拟 css 的背景属性</h2>
|
||||
<p>引入：</p>
|
||||
<pre class="hljs"><code><span class="hljs-keyword">import</span> drawBackgroundImageToCanvas <span class="hljs-keyword">from</span> <span class="hljs-string">'simple-mind-map/src/utils/simulateCSSBackgroundInCanvas'</span>
|
||||
</code></pre>
|
||||
@ -395,19 +416,26 @@
|
||||
<span class="hljs-keyword">let</span> canvas = <span class="hljs-built_in">document</span>.createElement(<span class="hljs-string">'canvas'</span>)
|
||||
canvas.width = width
|
||||
canvas.height = height
|
||||
drawBackgroundImageToCanvas(ctx, width, height, img, {
|
||||
<span class="hljs-attr">backgroundRepeat</span>: <span class="hljs-string">'repeat-y'</span>,
|
||||
<span class="hljs-attr">backgroundSize</span>: <span class="hljs-string">'60%'</span>,
|
||||
<span class="hljs-attr">backgroundPosition</span>: <span class="hljs-string">'center center'</span>
|
||||
}, <span class="hljs-function">(<span class="hljs-params">err</span>) =></span> {
|
||||
<span class="hljs-keyword">if</span> (err) {
|
||||
<span class="hljs-comment">// 失败</span>
|
||||
} <span class="hljs-keyword">else</span> {
|
||||
<span class="hljs-comment">// 成功</span>
|
||||
drawBackgroundImageToCanvas(
|
||||
ctx,
|
||||
width,
|
||||
height,
|
||||
img,
|
||||
{
|
||||
<span class="hljs-attr">backgroundRepeat</span>: <span class="hljs-string">'repeat-y'</span>,
|
||||
<span class="hljs-attr">backgroundSize</span>: <span class="hljs-string">'60%'</span>,
|
||||
<span class="hljs-attr">backgroundPosition</span>: <span class="hljs-string">'center center'</span>
|
||||
},
|
||||
<span class="hljs-function"><span class="hljs-params">err</span> =></span> {
|
||||
<span class="hljs-keyword">if</span> (err) {
|
||||
<span class="hljs-comment">// 失败</span>
|
||||
} <span class="hljs-keyword">else</span> {
|
||||
<span class="hljs-comment">// 成功</span>
|
||||
}
|
||||
}
|
||||
})
|
||||
)
|
||||
</code></pre>
|
||||
<h2>LRU缓存类</h2>
|
||||
<h2>LRU 缓存类</h2>
|
||||
<blockquote>
|
||||
<p>v0.5.10+</p>
|
||||
</blockquote>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user