Home forums Using CanvasJS Display Doughnut Chart wit sorted values(based on percentage)in descending order

This topic contains 0 replies, has 1 voice, and was last updated by  Jayanth 1 week, 1 day ago.

Viewing 1 post (of 1 total)
  • Author
    Posts
  • #23367

    Jayanth
    Member

    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
    }
    }
    }]
    }

    });

    }

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.