我正在使用Highcharts.js library,当条形图高度很小时,会跳过yAxis
个标签。通过增加条形图的大小,标签会再次出现。你如何避免标签消失。
请参阅此jsfiddle例如 - http://jsfiddle.net/VbecE/3/
<script src="http://code.highcharts.com/highcharts.js"></script>
<h3>Why does this skip yaxis labels America and Europe?</h3>
<div id="container" style="min-width: 310px; height: 150px; margin: 0 auto"></div>
<h3>10px bigger and all 5 yaxis labels visible</h3>
<div id="container2" style="min-width: 310px; height: 170px; margin: 0 auto"></div>
$(function () {
$('#container').highcharts({
chart: {
type: 'bar'
},
xAxis: {
categories: ['Africa', 'America', 'Asia', 'Europe', 'Oceania'],
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: 'Population (millions)',
align: 'high'
},
labels: {
overflow: 'justify',
crop:false
}
},
tooltip: {
valueSuffix: ' millions'
},
plotOptions: {
bar: {
dataLabels: {
enabled: true,
crop:false
}
},
series: {
dataLabels:{
crop:false}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -40,
y: 100,
floating: true,
borderWidth: 1,
backgroundColor: '#FFFFFF',
shadow: true
},
credits: {
enabled: false
},
series: [{
name: 'Year 1800',
data: [107, 31, 635, 203, 2]
}, {
name: 'Year 1900',
data: [133, 156, 947, 408, 6]
}, {
name: 'Year 2008',
data: [973, 914, 4054, 732, 34]
}]
});
});
$(function () {
$('#container2').highcharts({
chart: {
type: 'bar'
},
xAxis: {
categories: ['Africa', 'America', 'Asia', 'Europe', 'Oceania'],
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: 'Population (millions)',
align: 'high'
},
labels: {
overflow: 'justify',
crop:false
}
},
tooltip: {
valueSuffix: ' millions'
},
plotOptions: {
bar: {
dataLabels: {
enabled: true,
crop:false
}
},
series: {
dataLabels:{
crop:false}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -40,
y: 100,
floating: true,
borderWidth: 1,
backgroundColor: '#FFFFFF',
shadow: true
},
credits: {
enabled: false
},
series: [{
name: 'Year 1800',
data: [107, 31, 635, 203, 2]
}, {
name: 'Year 1900',
data: [133, 156, 947, 408, 6]
}, {
name: 'Year 2008',
data: [973, 914, 4054, 732, 34]
}]
});
});