I have a problem with data labels overlapping columns in my chart.
$('#container').highcharts({
chart: {
type: 'column'
},
xAxis: {
type: 'datetime'
},
series: [{
data: [[Date.UTC(2013, 3, 1, 0, 0, 0), 169],
[Date.UTC(2013, 4, 1, 0, 0, 0), 176],
[Date.UTC(2013, 5, 1, 0, 0, 0), 470],
[Date.UTC(2013, 6, 1, 0, 0, 0), 346],
[Date.UTC(2013, 7, 1, 0, 0, 0), 252],
[Date.UTC(2013, 8, 1, 0, 0, 0), 138]],
dataLabels: {
enabled: true
}
}]
});
});
You can see an exmaple here: http://jsfiddle.net/J6WvR/1/
My chart should have fixed height and I don't understand why the largest column height cannot be calculated to fit its data label. How can I fix this?
According to official API documentation: overflow property
To display data labels outside the plot area, set crop to false and overflow to "none".
dataLabels: {
enabled: true,
crop: false,
overflow: 'none'
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With