2
我有一張圖表,比較了多年來兩個人的布爾數據。Highcharts - 分類y軸的標籤放置位置
下面的jsfiddle代表我需要的東西,除了我需要底部軸上的標籤與紅色和綠色塊的中心對齊,並且沒有5出現在最右邊的刻度上。
http://jsfiddle.net/zzella/Xa46f/3/
任何人有任何想法如何實現這一點對於上面的圖表,或者有更好的方式來組織數據,以獲得我需要的結果嗎?
$(function() {
$('#container').highcharts({
credits: {
enabled: false
},
exporting: {
enabled: false
},
chart: {
type: 'bar'
},
title: {
text: 'Action completed for year (Yes/No)'
},
xAxis: {
categories: ['Person 1', 'Person 2'],
labels: {
align: 'left',
style: {
fontSize: '13px',
fontFamily: 'Arial'
},
y: -45,
x: 60
},
lineColor: '#FFFFFF',
tickColor: '#FFFFFF',
},
yAxis: {
type: 'category',
categories: ["2010","2011","2012","2013", "2014"],
title: false,
lineColor: '#FFFFFF',
tickColor: '#FFFFFF',
gridLineColor: '#FFFFFF',
},
legend: false,
plotOptions: {
bar: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: '#FFFFFF',
align: 'center',
style: {
fontSize: '13px',
fontFamily: 'Verdana, sans-serif',
textShadow: '0 0 3px black'
},
formatter: function() {
console.log(this);
return this.key
}
},
},
},
series: [{
name: '2014',
data: [{
name: "2014: no",
color: "#a50000",
y: 1
}, {
name: "2014: yes",
color: "#006500",
y: 1
}],
}, {
name: '2013',
data: [{
name: "2013: yes",
color: "#006500",
y: 1
}, {
name: "2013: yes",
color: "#006500",
y: 1
}]
}, {
name: '2012',
data: [{
name: "2012: yes",
color: "#006500",
y: 1
}, {
name: "2012: no",
color: "#a50000",
y: 1
}]
}, {
name: '2011',
data: [{
name: "2011: no",
color: "#a50000",
y: 1
}, {
name: "2011: yes",
color: "#006500",
y: 1
}]
}, {
name: '2010',
data: [{
name: "2010: no",
color: "#a50000",
y: 1
}, {
name: "2010: no",
color: "#a50000",
y: 1
}]
}]
});
});