feat: 辅助线增加显示名称同时位置跟随坐标轴

This commit is contained in:
junjun 2022-05-09 10:21:59 +08:00
parent 3cb51ed9f8
commit 03a257d447
2 changed files with 57 additions and 16 deletions

View File

@ -209,6 +209,14 @@ export function seniorCfg(chart_option, chart) {
symbol: 'none',
data: []
}
const customStyle = JSON.parse(chart.customStyle)
let xAxis, yAxis
if (customStyle.xAxis) {
xAxis = JSON.parse(JSON.stringify(customStyle.xAxis))
}
if (customStyle.yAxis) {
yAxis = JSON.parse(JSON.stringify(customStyle.yAxis))
}
senior.assistLine.forEach(ele => {
if (chart.type.includes('horizontal')) {
chart_option.series[0].markLine.data.push({
@ -223,7 +231,10 @@ export function seniorCfg(chart_option, chart) {
show: true,
color: ele.color,
fontSize: 10,
position: 'insideStartTop'
position: xAxis.position === 'bottom' ? 'insideStartTop' : 'insideEndTop',
formatter: function(param) {
return ele.name + ' : ' + param.value
}
},
tooltip: {
show: false
@ -242,7 +253,10 @@ export function seniorCfg(chart_option, chart) {
show: true,
color: ele.color,
fontSize: 10,
position: 'insideStartTop'
position: yAxis.position === 'left' ? 'insideStartTop' : 'insideEndTop',
formatter: function(param) {
return ele.name + ' : ' + param.value
}
},
tooltip: {
show: false

View File

@ -421,9 +421,9 @@ function transAxisPosition(chart, axis) {
if (chart.type.includes('horizontal')) {
switch (axis.position) {
case 'top':
return 'right'
case 'bottom':
return 'left'
case 'bottom':
return 'right'
case 'left':
return 'bottom'
case 'right':
@ -459,7 +459,18 @@ export function getAnalyse(chart) {
if (chart.senior && chart.type && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('mix'))) {
senior = JSON.parse(chart.senior)
if (senior.assistLine && senior.assistLine.length > 0) {
const customStyle = JSON.parse(chart.customStyle)
let xAxisPosition, yAxisPosition
if (customStyle.xAxis) {
const a = JSON.parse(JSON.stringify(customStyle.xAxis))
xAxisPosition = transAxisPosition(chart, a)
}
if (customStyle.yAxis) {
const a = JSON.parse(JSON.stringify(customStyle.yAxis))
yAxisPosition = transAxisPosition(chart, a)
}
senior.assistLine.forEach(ele => {
const content = ele.name + ' : ' + parseFloat(ele.value)
assistLine.push({
type: 'line',
start: ['start', parseFloat(ele.value)],
@ -469,18 +480,34 @@ export function getAnalyse(chart) {
lineDash: getLineDash(ele.lineType)
}
})
assistLine.push({
type: 'text',
position: ['start', parseFloat(ele.value)],
content: parseFloat(ele.value),
offsetY: -2,
offsetX: 2,
style: {
textBaseline: 'bottom',
fill: ele.color,
fontSize: 10
}
})
if (!chart.type.includes('horizontal')) {
assistLine.push({
type: 'text',
position: [yAxisPosition === 'left' ? 'start' : 'end', parseFloat(ele.value)],
content: content,
offsetY: -2,
offsetX: yAxisPosition === 'left' ? 2 : -10 * (content.length - 2),
style: {
textBaseline: 'bottom',
fill: ele.color,
fontSize: 10
}
})
} else {
assistLine.push({
type: 'text',
position: [xAxisPosition === 'left' ? 'start' : 'end', parseFloat(ele.value)],
content: content,
offsetY: xAxisPosition === 'left' ? -2 : -10 * (content.length - 2),
offsetX: 2,
rotate: Math.PI / 2,
style: {
textBaseline: 'bottom',
fill: ele.color,
fontSize: 10
}
})
}
})
}
}