提交 c68da406 authored 作者: junjun's avatar junjun

feat: 轴值格式化

上级 da6a29fe
import { hexColorToRGBA } from '@/views/chart/chart/util' import { hexColorToRGBA } from '@/views/chart/chart/util'
import { DEFAULT_YAXIS_EXT_STYLE } from '@/views/chart/chart/chart' import { DEFAULT_YAXIS_EXT_STYLE } from '@/views/chart/chart/chart'
import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
let xAxisLabelFormatter = null
let yAxisLabelFormatter = null
let yExtAxisLabelFormatter = null
export function componentStyle(chart_option, chart) { export function componentStyle(chart_option, chart) {
const padding = '8px' const padding = '8px'
...@@ -80,6 +85,8 @@ export function componentStyle(chart_option, chart) { ...@@ -80,6 +85,8 @@ export function componentStyle(chart_option, chart) {
customStyle.xAxis.axisValue.max && (chart_option.xAxis.max = parseFloat(customStyle.xAxis.axisValue.max)) customStyle.xAxis.axisValue.max && (chart_option.xAxis.max = parseFloat(customStyle.xAxis.axisValue.max))
customStyle.xAxis.axisValue.split && (chart_option.xAxis.interval = parseFloat(customStyle.xAxis.axisValue.split)) customStyle.xAxis.axisValue.split && (chart_option.xAxis.interval = parseFloat(customStyle.xAxis.axisValue.split))
} }
xAxisLabelFormatter = customStyle.xAxis.axisLabelFormatter
chart_option.xAxis.axisLabel.formatter = xFormatter
} }
} }
if (customStyle.yAxis && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('scatter'))) { if (customStyle.yAxis && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('scatter'))) {
...@@ -107,6 +114,8 @@ export function componentStyle(chart_option, chart) { ...@@ -107,6 +114,8 @@ export function componentStyle(chart_option, chart) {
customStyle.yAxis.axisValue.max && (chart_option.yAxis.max = parseFloat(customStyle.yAxis.axisValue.max)) customStyle.yAxis.axisValue.max && (chart_option.yAxis.max = parseFloat(customStyle.yAxis.axisValue.max))
customStyle.yAxis.axisValue.split && (chart_option.yAxis.interval = parseFloat(customStyle.yAxis.axisValue.split)) customStyle.yAxis.axisValue.split && (chart_option.yAxis.interval = parseFloat(customStyle.yAxis.axisValue.split))
} }
yAxisLabelFormatter = customStyle.yAxis.axisLabelFormatter
chart_option.yAxis.axisLabel.formatter = yFormatter
} }
} }
if (customStyle.yAxis && chart.type === 'chart-mix') { if (customStyle.yAxis && chart.type === 'chart-mix') {
...@@ -134,6 +143,8 @@ export function componentStyle(chart_option, chart) { ...@@ -134,6 +143,8 @@ export function componentStyle(chart_option, chart) {
customStyle.yAxis.axisValue.max && (chart_option.yAxis[0].max = parseFloat(customStyle.yAxis.axisValue.max)) customStyle.yAxis.axisValue.max && (chart_option.yAxis[0].max = parseFloat(customStyle.yAxis.axisValue.max))
customStyle.yAxis.axisValue.split && (chart_option.yAxis[0].interval = parseFloat(customStyle.yAxis.axisValue.split)) customStyle.yAxis.axisValue.split && (chart_option.yAxis[0].interval = parseFloat(customStyle.yAxis.axisValue.split))
} }
yAxisLabelFormatter = customStyle.yAxis.axisLabelFormatter
chart_option.yAxis[0].axisLabel.formatter = yFormatter
} }
// axis ext // axis ext
...@@ -162,6 +173,8 @@ export function componentStyle(chart_option, chart) { ...@@ -162,6 +173,8 @@ export function componentStyle(chart_option, chart) {
customStyle.yAxisExt.axisValue.max && (chart_option.yAxis[1].max = parseFloat(customStyle.yAxisExt.axisValue.max)) customStyle.yAxisExt.axisValue.max && (chart_option.yAxis[1].max = parseFloat(customStyle.yAxisExt.axisValue.max))
customStyle.yAxisExt.axisValue.split && (chart_option.yAxis[1].interval = parseFloat(customStyle.yAxisExt.axisValue.split)) customStyle.yAxisExt.axisValue.split && (chart_option.yAxis[1].interval = parseFloat(customStyle.yAxisExt.axisValue.split))
} }
yExtAxisLabelFormatter = customStyle.yAxisExt.axisLabelFormatter
chart_option.yAxis[1].axisLabel.formatter = yExtFormatter
} }
} }
if (customStyle.split && chart.type.includes('radar')) { if (customStyle.split && chart.type.includes('radar')) {
...@@ -268,3 +281,27 @@ export function seniorCfg(chart_option, chart) { ...@@ -268,3 +281,27 @@ export function seniorCfg(chart_option, chart) {
} }
} }
} }
const xFormatter = function(value) {
if (!xAxisLabelFormatter) {
return valueFormatter(value, formatterItem)
} else {
return valueFormatter(value, xAxisLabelFormatter)
}
}
const yFormatter = function(value) {
if (!yAxisLabelFormatter) {
return valueFormatter(value, formatterItem)
} else {
return valueFormatter(value, yAxisLabelFormatter)
}
}
const yExtFormatter = function(value) {
if (!yExtAxisLabelFormatter) {
return valueFormatter(value, formatterItem)
} else {
return valueFormatter(value, yExtAxisLabelFormatter)
}
}
import { hexColorToRGBA } from '@/views/chart/chart/util' import { hexColorToRGBA } from '@/views/chart/chart/util'
import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
export function getPadding(chart) { export function getPadding(chart) {
if (chart.drill) { if (chart.drill) {
...@@ -267,6 +268,17 @@ export function getXAxis(chart) { ...@@ -267,6 +268,17 @@ export function getXAxis(chart) {
style: { style: {
fill: a.axisLabel.color, fill: a.axisLabel.color,
fontSize: parseInt(a.axisLabel.fontSize) fontSize: parseInt(a.axisLabel.fontSize)
},
formatter: function(value) {
if (chart.type.includes('horizontal')) {
if (!a.axisLabelFormatter) {
return valueFormatter(value, formatterItem)
} else {
return valueFormatter(value, a.axisLabelFormatter)
}
} else {
return value
}
} }
} : null } : null
...@@ -327,6 +339,17 @@ export function getYAxis(chart) { ...@@ -327,6 +339,17 @@ export function getYAxis(chart) {
style: { style: {
fill: a.axisLabel.color, fill: a.axisLabel.color,
fontSize: parseInt(a.axisLabel.fontSize) fontSize: parseInt(a.axisLabel.fontSize)
},
formatter: function(value) {
if (!chart.type.includes('horizontal')) {
if (!a.axisLabelFormatter) {
return valueFormatter(value, formatterItem)
} else {
return valueFormatter(value, a.axisLabelFormatter)
}
} else {
return value
}
} }
} : null } : null
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论