diff --git a/simple-mind-map/src/Node.js b/simple-mind-map/src/Node.js index 386e9a71..9947826f 100644 --- a/simple-mind-map/src/Node.js +++ b/simple-mind-map/src/Node.js @@ -21,10 +21,8 @@ class Node { this.renderer = opt.renderer // 渲染器 this.draw = opt.draw || null - // 主题配置 - this.themeConfig = this.mindMap.themeConfig // 样式实例 - this.style = new Style(this, this.themeConfig) + this.style = new Style(this) // 形状实例 this.shapeInstance = new Shape(this) this.shapePadding = { @@ -110,15 +108,6 @@ class Node { this._top = val } - // 更新主题配置 - - updateThemeConfig() { - // 主题配置 - this.themeConfig = this.mindMap.themeConfig - // 样式实例 - this.style.updateThemeConfig(this.themeConfig) - } - // 复位部分布局时会重新设置的数据 reset() { @@ -342,8 +331,8 @@ class Node { return resizeImgSize( this.nodeData.data.imageSize.width, this.nodeData.data.imageSize.height, - this.themeConfig.imgMaxWidth, - this.themeConfig.imgMaxHeight + this.mindMap.themeConfig.imgMaxWidth, + this.mindMap.themeConfig.imgMaxHeight ) } @@ -354,7 +343,7 @@ class Node { if (!_data.icon || _data.icon.length <= 0) { return [] } - let iconSize = this.themeConfig.iconSize + let iconSize = this.mindMap.themeConfig.iconSize return _data.icon.map(item => { return { node: SVG(iconsSvg.getNodeIconListIcon(item)).size(iconSize, iconSize), @@ -458,7 +447,7 @@ class Node { if (!hyperlink) { return } - let iconSize = this.themeConfig.iconSize + let iconSize = this.mindMap.themeConfig.iconSize let node = new SVG() // 超链接节点 let a = new A().to(hyperlink).target('_blank') @@ -515,7 +504,7 @@ class Node { if (!this.nodeData.data.note) { return null } - let iconSize = this.themeConfig.iconSize + let iconSize = this.mindMap.themeConfig.iconSize let node = new SVG().attr('cursor', 'pointer') // 透明的层,用来作为鼠标区域 node.add(new Rect().size(iconSize, iconSize).fill({ color: 'transparent' })) @@ -571,7 +560,7 @@ class Node { getShape() { // 节点使用功能横线风格的话不支持设置形状,直接使用默认的矩形 - return this.themeConfig.nodeUseLineStyle + return this.mindMap.themeConfig.nodeUseLineStyle ? 'rectangle' : this.style.getStyle('shape', false, false) } @@ -754,7 +743,7 @@ class Node { // 更新节点 - update(layout = false) { + update(isLayout = false) { if (!this.group) { return } @@ -769,7 +758,7 @@ class Node { } this.renderGeneralization() let t = this.group.transform() - if (!layout) { + if (!isLayout) { this.group .animate(300) .translate( diff --git a/simple-mind-map/src/Style.js b/simple-mind-map/src/Style.js index 083120b2..876782e6 100644 --- a/simple-mind-map/src/Style.js +++ b/simple-mind-map/src/Style.js @@ -21,34 +21,28 @@ class Style { // 构造函数 - constructor(ctx, themeConfig) { + constructor(ctx) { this.ctx = ctx - this.themeConfig = themeConfig - } - - // 更新主题配置 - - updateThemeConfig(themeConfig) { - this.themeConfig = themeConfig } // 合并样式 merge(prop, root, isActive) { + let themeConfig = this.ctx.mindMap.themeConfig // 三级及以下节点 - let defaultConfig = this.themeConfig.node + let defaultConfig = themeConfig.node if (root || rootProp.includes(prop)) { // 直接使用最外层样式 - defaultConfig = this.themeConfig + defaultConfig = themeConfig } else if (this.ctx.isGeneralization) { // 概要节点 - defaultConfig = this.themeConfig.generalization + defaultConfig = themeConfig.generalization } else if (this.ctx.layerIndex === 0) { // 根节点 - defaultConfig = this.themeConfig.root + defaultConfig = themeConfig.root } else if (this.ctx.layerIndex === 1) { // 二级节点 - defaultConfig = this.themeConfig.second + defaultConfig = themeConfig.second } // 激活状态 if (isActive !== undefined ? isActive : this.ctx.nodeData.data.isActive) { @@ -96,7 +90,7 @@ class Style { if ( !this.ctx.isRoot && !this.ctx.isGeneralization && - this.themeConfig.nodeUseLineStyle && + this.ctx.mindMap.themeConfig.nodeUseLineStyle && !this.ctx.nodeData.data.isActive ) { return