Javascript 如果值为负值,则Highcharts将数据标签与x轴对齐
我有一个启用了数据标签的Highcharts图表。默认情况下,数据标签附着到每个数据栏的末端(请参见此提琴:) 是否可以移动负片数据标签并将其显示在x轴旁边而不是条的末端?下面是我想做的修改过的屏幕截图: 以下是我的Highcharts示例代码的副本:Javascript 如果值为负值,则Highcharts将数据标签与x轴对齐,javascript,html,graph,highcharts,Javascript,Html,Graph,Highcharts,我有一个启用了数据标签的Highcharts图表。默认情况下,数据标签附着到每个数据栏的末端(请参见此提琴:) 是否可以移动负片数据标签并将其显示在x轴旁边而不是条的末端?下面是我想做的修改过的屏幕截图: 以下是我的Highcharts示例代码的副本: $(function () { var chart; $(document).ready(function() { chart = new Highcharts.Chart({ chart
$(function () {
var chart;
$(document).ready(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'column'
},
plotOptions: {
column: {
dataLabels: {
enabled: true,
useHTML: true,
style: {
color: '#252525',
fontWeight: 'bold'
}
}
}
},
title: {
text: 'Column chart with negative values'
},
xAxis: {
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
},
tooltip: {
formatter: function() {
return ''+
this.series.name +': '+ this.y +'';
}
},
credits: {
enabled: false
},
series: [{
name: 'Jane',
data: [2, -2, -3, 2, 1]
}]
});
});
});
谢谢你的帮助 您可以通过使用stackLabels并通过设置dataLabels的y(位置y)属性来实现这一点。此外,还应将数据标签的垂直对齐设置为“顶部”
plotOptions: {
column: {
dataLabels: {
enabled: true,
useHTML: true,
style: {
color: '#252525',
fontWeight: 'bold'
},
verticalAlign : 'top',
y: -15
}
}
}
演示:您可以通过使用stackLabels并通过设置dataLabels的y(位置y)属性来实现这一点。此外,还应将数据标签的垂直对齐设置为“顶部”
plotOptions: {
column: {
dataLabels: {
enabled: true,
useHTML: true,
style: {
color: '#252525',
fontWeight: 'bold'
},
verticalAlign : 'top',
y: -15
}
}
}
演示: