diff --git a/simple-mind-map/src/core/render/node/Style.js b/simple-mind-map/src/core/render/node/Style.js index 3ca64b5c..12078f4b 100644 --- a/simple-mind-map/src/core/render/node/Style.js +++ b/simple-mind-map/src/core/render/node/Style.js @@ -191,45 +191,6 @@ class Style { }) } - // 生成内联样式 - createStyleText(customStyle = {}) { - const styles = { - color: this.merge('color'), - fontFamily: this.merge('fontFamily'), - fontSize: this.merge('fontSize'), - fontWeight: this.merge('fontWeight'), - fontStyle: this.merge('fontStyle'), - textDecoration: this.merge('textDecoration'), - ...customStyle - } - return ` - color: ${styles.color}; - font-family: ${styles.fontFamily}; - font-size: ${styles.fontSize + 'px'}; - font-weight: ${styles.fontWeight}; - font-style: ${styles.fontStyle}; - text-decoration: ${styles.textDecoration} - ` - } - - // 获取文本样式 - getTextFontStyle() { - const styles = { - color: this.merge('color'), - fontFamily: this.merge('fontFamily'), - fontSize: this.merge('fontSize'), - fontWeight: this.merge('fontWeight'), - fontStyle: this.merge('fontStyle'), - textDecoration: this.merge('textDecoration') - } - return { - italic: styles.fontStyle === 'italic', - bold: styles.fontWeight, - fontSize: styles.fontSize, - fontFamily: styles.fontFamily - } - } - // html文字节点 domText(node, fontSizeScale = 1) { const styles = { @@ -238,7 +199,8 @@ class Style { fontSize: this.merge('fontSize'), fontWeight: this.merge('fontWeight'), fontStyle: this.merge('fontStyle'), - textDecoration: this.merge('textDecoration') + textDecoration: this.merge('textDecoration'), + textAlign: this.merge('textAlign') } node.style.color = styles.color node.style.textDecoration = styles.textDecoration @@ -246,6 +208,7 @@ class Style { node.style.fontSize = styles.fontSize * fontSizeScale + 'px' node.style.fontWeight = styles.fontWeight || 'normal' node.style.fontStyle = styles.fontStyle + node.style.textAlign = styles.textAlign } // 标签文字 diff --git a/simple-mind-map/src/core/render/node/nodeCreateContents.js b/simple-mind-map/src/core/render/node/nodeCreateContents.js index 6598f607..a994a652 100644 --- a/simple-mind-map/src/core/render/node/nodeCreateContents.js +++ b/simple-mind-map/src/core/render/node/nodeCreateContents.js @@ -233,8 +233,9 @@ function createTextNode(specifyText) { if (this.getData('resetRichText')) { delete this.nodeData.data.resetRichText } - let g = new G() - let fontSize = this.getStyle('fontSize', false) + const g = new G() + const fontSize = this.getStyle('fontSize', false) + const textAlign = this.getStyle('textAlign', false) // 文本超长自动换行 let textArr = [] if (!isUndef(text)) { @@ -274,6 +275,14 @@ function createTextNode(specifyText) { } const node = new Text().text(item) node.addClass('smm-text-node-wrap') + node.attr( + 'text-anchor', + { + left: 'start', + center: 'middle', + right: 'end' + }[textAlign] || 'start' + ) this.style.text(node) node.y( fontSize * noneRichTextNodeLineHeight * index + diff --git a/web/src/pages/Edit/components/Style.vue b/web/src/pages/Edit/components/Style.vue index 10f6a2d6..30eb62b7 100644 --- a/web/src/pages/Edit/components/Style.vue +++ b/web/src/pages/Edit/components/Style.vue @@ -10,9 +10,7 @@
{{ $t('style.text') }}
- {{ - $t('style.fontFamily') - }} +
- {{ - $t('style.fontSize') - }} +
-
+
state.localConfig.isDark, activeSidebar: state => state.activeSidebar, - supportLineFlow: state => state.supportLineFlow, - openNodeRichText: state => state.localConfig.openNodeRichText + supportLineFlow: state => state.supportLineFlow }), fontFamilyList() { return fontFamilyList[this.$i18n.locale] || fontFamilyList.zh