4.9 KiB
内置工具方法
基础工具方法
引用：
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)
深度优先遍历树
root：要遍历的树的根节点
parent：父节点
beforeCallback：前序遍历回调函数，回调参数为：root, parent, isRoot, layerIndex, index
afterCallback：后序遍历回调函数，回调参数为：root, parent, isRoot, layerIndex, index
isRoot：是否是根节点
layerIndex：节点层级
index：节点在同级节点里的索引
示例：
walk(tree, null, () => {}, () => {}, false, 0, 0)
bfsWalk(root, callback)
广度优先遍历树
resizeImgSize(width, height, maxWidth, maxHeight)
缩放图片的尺寸
width：图片原本的宽
height：图片原本的高
maxWidth：要缩放到的宽
maxHeight：要缩放到的高
maxWidth和maxHeight可以同时都传，也可以只传一个
resizeImg(imgUrl, maxWidth, maxHeight)
缩放图片，内部先加载图片，然后调用resizeImgSize方法，返回一个promise
simpleDeepClone(data)
极简的深拷贝方法，只能针对全是基本数据的对象，否则会报错
copyRenderTree(tree, root)
复制渲染树数据，示例：
copyRenderTree({}, this.mindMap.renderer.renderTree)
copyNodeTree(tree, root, removeActiveState, keepId)
-
removeActiveState：Boolean，默认为false，是否移除节点的激活状态 -
keepId：v0.4.6+，Boolean，默认为false，是否保留被复制节点的id，默认会删除id防止节点id重复，但是对于移动节点的场景，节点原id需要保留
复制节点树数据，主要是剔除其中的引用node实例的_node，然后复制data对象的数据，示例：
copyNodeTree({}, node)
imgToDataUrl(src)
图片转成dataURL
downloadFile(file, fileName)
下载文件
throttle(fn, time = 300, ctx)
节流函数
asyncRun(taskList, callback = () => {})
异步执行任务队列，多个任务是同步执行的，没有先后顺序
degToRad(deg)
v0.2.24+
角度转弧度
camelCaseToHyphen(str)
v0.2.24+
驼峰转连字符
joinFontStr({ italic, bold, fontSize, fontFamily })
v0.3.4+
拼接css字体的font属性值
measureText(text, { italic, bold, fontSize, fontFamily })
v0.3.4+
测量文本的宽高，返回值：
{ width, height }
getTextFromHtml(html)
提取html字符串里的纯文本内容。
readBlob(blob)
v0.5.9+
将blob数据转成data:url数据。
parseDataUrl(data)
v0.6.6+
解析data:url数据，返回：
{
type,// 数据的文件类型
base64// base64数据
}
getImageSize(src)
v0.6.6+
src：图片的url
获取图片的大小。返回：
{
width,
height
}
loadImage(imgFile)
v0.6.8+
imgFile：图片类型的File对象
加载图片，返回：
{
url,// DataUrl
size// { width, height } 图片宽高
}
getType(data)
v0.6.9+
获取一个数据的类型，比如Boolean、Array等。
removeHtmlStyle(html)
v0.6.10+
移除html字符串中节点的内联样式。
addHtmlStyle(html, tag, style)
v0.6.10+
给html标签中指定的标签添加内联样式。
checkIsRichText(str)
v0.6.10+
检查一个字符串是否是富文本字符。
isWhite(color)
v0.6.11+
判断一个颜色是否是白色。
isTransparent(color)
判断一个颜色是否是透明。
v0.6.11+
在canvas中模拟css的背景属性
引入：
import drawBackgroundImageToCanvas from 'simple-mind-map/src/utils/simulateCSSBackgroundInCanvas'
使用：
let width = 500
let height = 500
let img = '/1.jpg'
let canvas = document.createElement('canvas')
canvas.width = width
canvas.height = height
drawBackgroundImageToCanvas(ctx, width, height, img, {
backgroundRepeat: 'repeat-y',
backgroundSize: '60%',
backgroundPosition: 'center center'
}, (err) => {
if (err) {
// 失败
} else {
// 成功
}
})
LRU缓存类
v0.5.10+
引入：
import Lru from 'simple-mind-map/src/utils/Lru.js'
构造函数
let lru = new Lru(max)
max：指定最大缓存数量。
实例属性
size
当前缓存的数量。
pool
获取缓存池。
实例方法
add(key, value)
添加缓存。
delete(key)
删除指定缓存。
has(key)
检查某个缓存是否存在。
get(key)
获取某个缓存的值。