diff --git a/simple-mind-map/src/constants/defaultOptions.js b/simple-mind-map/src/constants/defaultOptions.js index 6e67a896..fd8ff017 100644 --- a/simple-mind-map/src/constants/defaultOptions.js +++ b/simple-mind-map/src/constants/defaultOptions.js @@ -395,5 +395,9 @@ export const defaultOpt = { beforeHideRichTextEdit: null, // 设置富文本节点编辑框和节点大小一致,形成伪原地编辑的效果 // 需要注意的是,只有当节点内只有文本、且形状是矩形才会有比较好的效果 - richTextEditFakeInPlace: false + richTextEditFakeInPlace: false, + + // 【OuterFrame】插件 + outerFramePaddingX: 10, + outerFramePaddingY: 10 } diff --git a/simple-mind-map/src/plugins/OuterFrame.js b/simple-mind-map/src/plugins/OuterFrame.js index 91ccecf8..e0c1e4b6 100644 --- a/simple-mind-map/src/plugins/OuterFrame.js +++ b/simple-mind-map/src/plugins/OuterFrame.js @@ -144,8 +144,6 @@ class OuterFrame { this.createDrawContainer() this.outerFrameElList = [] this.activeOuterFrame = null - this.paddingX = 10 - this.paddingY = 10 this.bindEvent() } @@ -287,6 +285,7 @@ class OuterFrame { let tree = this.mindMap.renderer.root if (!tree) return const t = this.mindMap.draw.transform() + const { outerFramePaddingX, outerFramePaddingY } = this.mindMap.opt walk( tree, null, @@ -299,12 +298,18 @@ class OuterFrame { const { left, top, width, height } = getNodeListBoundingRect(nodeList) const el = this.createOuterFrameEl( - (left - this.paddingX - this.mindMap.elRect.left - t.translateX) / + (left - + outerFramePaddingX - + this.mindMap.elRect.left - + t.translateX) / t.scaleX, - (top - this.paddingY - this.mindMap.elRect.top - t.translateY) / + (top - + outerFramePaddingY - + this.mindMap.elRect.top - + t.translateY) / t.scaleY, - (width + this.paddingX * 2) / t.scaleX, - (height + this.paddingY * 2) / t.scaleY, + (width + outerFramePaddingX * 2) / t.scaleX, + (height + outerFramePaddingY * 2) / t.scaleY, nodeList[0].getData('outerFrame') // 使用第一个节点的外框样式 ) el.on('click', e => {