Feat:主题支持配置背景渐变的方向

This commit is contained in:
街角小林 2024-08-29 17:48:03 +08:00
parent 570bbb1b16
commit fa8a80792d
2 changed files with 15 additions and 2 deletions

View File

@ -124,6 +124,8 @@ class Style {
gradientStyle: this.merge('gradientStyle'), gradientStyle: this.merge('gradientStyle'),
startColor: this.merge('startColor'), startColor: this.merge('startColor'),
endColor: this.merge('endColor'), endColor: this.merge('endColor'),
startDir: this.merge('startDir'),
endDir: this.merge('endDir'),
fillColor: this.merge('fillColor'), fillColor: this.merge('fillColor'),
borderColor: this.merge('borderColor'), borderColor: this.merge('borderColor'),
borderWidth: this.merge('borderWidth'), borderWidth: this.merge('borderWidth'),
@ -137,6 +139,7 @@ class Style {
add.stop(0, styles.startColor) add.stop(0, styles.startColor)
add.stop(1, styles.endColor) add.stop(1, styles.endColor)
}) })
this._gradient.from(...styles.startDir).to(...styles.endDir)
node.fill(this._gradient) node.fill(this._gradient)
} else { } else {
node.fill({ node.fill({

View File

@ -82,6 +82,8 @@ export default {
gradientStyle: false, gradientStyle: false,
startColor: '#549688', startColor: '#549688',
endColor: '#fff', endColor: '#fff',
startDir: [0, 0],
endDir: [1, 0],
// 连线标记的位置start头部、end尾部该配置在showLineMarker配置为true时生效 // 连线标记的位置start头部、end尾部该配置在showLineMarker配置为true时生效
lineMarkerDir: 'end' lineMarkerDir: 'end'
}, },
@ -105,6 +107,8 @@ export default {
gradientStyle: false, gradientStyle: false,
startColor: '#549688', startColor: '#549688',
endColor: '#fff', endColor: '#fff',
startDir: [0, 0],
endDir: [1, 0],
lineMarkerDir: 'end' lineMarkerDir: 'end'
}, },
// 三级及以下节点样式 // 三级及以下节点样式
@ -127,6 +131,8 @@ export default {
gradientStyle: false, gradientStyle: false,
startColor: '#549688', startColor: '#549688',
endColor: '#fff', endColor: '#fff',
startDir: [0, 0],
endDir: [1, 0],
lineMarkerDir: 'end' lineMarkerDir: 'end'
}, },
// 概要节点样式 // 概要节点样式
@ -148,7 +154,9 @@ export default {
textDecoration: 'none', textDecoration: 'none',
gradientStyle: false, gradientStyle: false,
startColor: '#549688', startColor: '#549688',
endColor: '#fff' endColor: '#fff',
startDir: [0, 0],
endDir: [1, 0]
} }
} }
@ -179,7 +187,9 @@ const nodeSizeIndependenceList = [
'gradientStyle', 'gradientStyle',
'lineRadius', 'lineRadius',
'startColor', 'startColor',
'endColor' 'endColor',
'startDir',
'endDir'
] ]
export const checkIsNodeSizeIndependenceConfig = config => { export const checkIsNodeSizeIndependenceConfig = config => {
let keys = Object.keys(config) let keys = Object.keys(config)