I want to show the remaining percent of bar in grey color like this in image
so far i have tried this and unable to find this type in Highcharts documentation so please tell me how should i solve this with highcharts documentation or jquery
Highcharts.chart('Chart1Progress', {
chart: {
type: 'bar',
backgroundColor: null
},
title: null,
xAxis: {
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'],
visible: false,
shadow: true
},
yAxis: {
min: 0,
title: null,
stackLabels: {
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'
}
},
},
legend: {
enabled: false,
align: 'right',
x: -30,
verticalAlign: 'top',
y: 25,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'black',
borderColor: '#CCC',
borderWidth: 1,
shadow: true
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: false,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
}
}
},
series: [{
name: 'John',
data: [{ y: 5, color: 'red' }, { y: 3, color: '#DDDF0D' }, { y: 4, color: '#55BF3B' }, { y: 7, color: '#5dacdf' }, { y: 2, color: 'pink' }]
}]
});