diff --git a/simple-mind-map/src/constants/defaultOptions.js b/simple-mind-map/src/constants/defaultOptions.js index 14ef4dba..385c436f 100644 --- a/simple-mind-map/src/constants/defaultOptions.js +++ b/simple-mind-map/src/constants/defaultOptions.js @@ -441,6 +441,9 @@ export const defaultOpt = { beforeDeleteNodeImg: null, // 删除和调整两个按钮的大小 imgResizeBtnSize: 25, + // 最小允许缩放的尺寸,请传入>=0的数字 + minImgResizeWidth: 50, + minImgResizeHeight: 50, // 最大允许缩放的尺寸依据主题的配置,即主题的imgMaxWidth和imgMaxHeight配置,如果设置为false,那么使用maxImgResizeWidth和maxImgResizeHeight选项 maxImgResizeWidthInheritTheme: true, // 最大允许缩放的尺寸,maxImgResizeWidthInheritTheme选项设置为false时生效,不限制最大值可传递Infinity diff --git a/simple-mind-map/src/plugins/NodeImgAdjust.js b/simple-mind-map/src/plugins/NodeImgAdjust.js index cf808516..36f33617 100644 --- a/simple-mind-map/src/plugins/NodeImgAdjust.js +++ b/simple-mind-map/src/plugins/NodeImgAdjust.js @@ -229,11 +229,26 @@ class NodeImgAdjust { if (!this.isMousedown) return e.preventDefault() const { scaleX, scaleY } = this.mousedownDrawTransform - const { + // 图片原始大小 + const { width: imageOriginWidth, height: imageOriginHeight } = + this.node.getData('imageSize') + let { + minImgResizeWidth, + minImgResizeHeight, maxImgResizeWidthInheritTheme, maxImgResizeWidth, maxImgResizeHeight } = this.mindMap.opt + // 主题设置的最小图片宽高 + const minRatio = minImgResizeWidth / minImgResizeHeight + const oRatio = imageOriginWidth / imageOriginHeight + if (minRatio > oRatio) { + // 如果最小值比例大于图片原始比例,那么要调整高度最小值 + minImgResizeHeight = minImgResizeWidth / oRatio + } else { + // 否则调整宽度最小值 + minImgResizeWidth = minImgResizeHeight * oRatio + } // 主题设置的最大图片宽高 let imgMaxWidth, imgMaxHeight if (maxImgResizeWidthInheritTheme) { @@ -246,10 +261,11 @@ class NodeImgAdjust { imgMaxWidth = imgMaxWidth * scaleX imgMaxHeight = imgMaxHeight * scaleY // 计算当前拖拽位置对应的图片的实时大小 - const { width: imageOriginWidth, height: imageOriginHeight } = - this.node.getData('imageSize') let newWidth = Math.abs(e.clientX - this.rect.x - this.mousedownOffset.x) let newHeight = Math.abs(e.clientY - this.rect.y - this.mousedownOffset.y) + // 限制最小值 + if (newWidth < minImgResizeWidth) newWidth = minImgResizeWidth + if (newHeight < minImgResizeHeight) newHeight = minImgResizeHeight // 限制最大值 if (newWidth > imgMaxWidth) newWidth = imgMaxWidth if (newHeight > imgMaxHeight) newHeight = imgMaxHeight