旋转的X轴标签与图形本身重叠

Gui*_*ans 8 javascript charts graph highcharts

我正在努力使用旋转的x轴标签.如果它们超过5-6个字符,它们会与您在此处看到的图形重叠:http://jsfiddle.net/kmfT9/215/ 如果没有显示,您可以在jsfiddle中重现粘贴在代码下方的错误窗口.

var chart = new Highcharts.Chart({

chart: {
renderTo: 'container',
marginLeft: 120
},

xAxis: {
categories: ['Jan', '02/03/2011', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], labels : { y : 20, rotation: -45 }
},

yAxis: {
lineWidth: 1,
offset: 0,
labels : { x: -20 },
title: {
text: 'Primary Axis'
},
tickWidth: 1
},

series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
}]

});
Run Code Online (Sandbox Code Playgroud)

即使在labels属性上设置y值,这也仅适用于较小的标签.

任何人都知道解决方案或我做错了什么?

小智 18

您可以尝试将align:'right'添加到x轴标签对象.

例如

xAxis: { categories: ['Jan', '02/03/2011', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], labels : { y : 20, rotation: -45, align: 'right' } },