Hi guys,
I have a query regarding High Charts (Doughnut Chart).
I displayed the doughnut chart with dynamic values and I’m displaying legends with name and percentage in form of key value pair.
But I need to display the chart with sorted values(based on percentage) in descending order.
Also legends should display in descending order based on Percentage values.
Kindly provide your comments and help me to acheive it. :)
Thanks in advance.
CODE:
Highcharts.chart(containerName, {
chart: {
height: 300,
type: ‘pie’
},
title: {
text: ‘ ‘
},
subtitle: {
text: ‘ ‘
},
yAxis: {
title: {
text: ‘Total’
}
},
plotOptions: {
pie: {
dataLabels:{
enabled: false
}
}
},
legend:{
enabled: true,
layout: ‘vertical’,
verticalAlign: ‘middle’,
align: ‘right’,
itemMarginBottom: 5,
itemMarginTop: 5,
labelFormat: ‘<p>{name}</p> <b>{percentage:.0f}%</b>’, //getting data from here
useHTML:true,
x: -50,
},
tooltip: {
valueSuffix: ‘%’
},
series: [{
name: ‘ ‘,
data: donutData,
innerSize: ‘80%’,
showInLegend:true,
id: ‘types’,
}],
responsive: {
rules: [{
condition: {
maxWidth: 480
},
chartOptions: {
chart:{
height: 500
},
legend: {
align: ‘center’,
verticalAlign: ‘bottom’,
layout:’vertical’,
x: 0,
maxHeight:250
}
}
}]
}
});
}