如何使 highcharts 面积图中的标签显示绝对值而不是负值?
How to make label in highcharts area graph display absolute values instead of negative values?
以这个图表为例,我想使值“-3”是一个绝对值,但我仍然希望图表向下。似乎 highcharts 要求该值为负才能使图表实际下降。有没有解决的办法?
下面是配置cdoe:
Highcharts.chart('container', {
chart: {
type: 'area'
},
title: {
text: 'Area chart with negative values'
},
xAxis: {
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
},
credits: {
enabled: false
},
series: [{
name: 'John',
data: [5, 3, 4, 7, 2]
}, {
name: 'Jane',
data: [2, -2, -3, 2, 1]
}, {
name: 'Joe',
data: [3, 4, 4, -2, 5]
}]
});
但是创建这种图表有什么意义呢?如果该值下降,必须低于其他值,否则,可读性是假的......当然,可以通过在输出中进行一些自定义更改来实现它:
tooltip: {
formatter() {
return `${this.series.name}: ${Math.abs(this.y)}`
}
},
yAxis: {
labels: {
formatter() {
return Math.abs(this.value)
}
},
},
演示:https://jsfiddle.net/BlackLabel/u68tb5od/
API: https://api.highcharts.com/highcharts/yAxis.labels.formatter
API: https://api.highcharts.com/highcharts/tooltip.formatter
以这个图表为例,我想使值“-3”是一个绝对值,但我仍然希望图表向下。似乎 highcharts 要求该值为负才能使图表实际下降。有没有解决的办法?
下面是配置cdoe:
Highcharts.chart('container', {
chart: {
type: 'area'
},
title: {
text: 'Area chart with negative values'
},
xAxis: {
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
},
credits: {
enabled: false
},
series: [{
name: 'John',
data: [5, 3, 4, 7, 2]
}, {
name: 'Jane',
data: [2, -2, -3, 2, 1]
}, {
name: 'Joe',
data: [3, 4, 4, -2, 5]
}]
});
但是创建这种图表有什么意义呢?如果该值下降,必须低于其他值,否则,可读性是假的......当然,可以通过在输出中进行一些自定义更改来实现它:
tooltip: {
formatter() {
return `${this.series.name}: ${Math.abs(this.y)}`
}
},
yAxis: {
labels: {
formatter() {
return Math.abs(this.value)
}
},
},
演示:https://jsfiddle.net/BlackLabel/u68tb5od/
API: https://api.highcharts.com/highcharts/yAxis.labels.formatter
API: https://api.highcharts.com/highcharts/tooltip.formatter