Redraw Doughnut Legend WIth New Dataset

Redraw Doughnut Legend WIth New Dataset

murday1983murday1983 Posts: 29Questions: 12Answers: 0

I have a doughnut chart which loads data when the page loads. this works fine but then I have a dropdown which changes the data from the initial load. I have the chart loading the new data fine but my legend is not updating and displays the data labels from the initial page load.

I have tried
chart.clear().destory()

but it doesn't re-draw. Below is my code which is working for redrawing the chart

$(function() {
    let $statusDropdown = $('.js-status-select');
    let statusData = jsonData.map(item => item[$statusDropdown.find(":selected").val()])
    let labels = jsonData.map(item => item.serviceName)
    let graphData = {'data': statusData, 'labels': labels}

    if (graphData.data.length > 0) {
        const data = {
            labels: graphData.labels,
            datasets: [{
                data: graphData.data
            }],
        };

        const config = {
            type: 'doughnut',
            data: data,
            options: {
                plugins: {
                    legend: {
                        position: 'right'
                    }
                }
            }
        }

        let chart = new Chart(
            document.getElementById('js-broadband-estate-report'),
            config
        )

        $statusDropdown.on('change', function (){
            chart.data.datasets[0].data = jsonData.map(item => item[$(this).val()]);
            chart.update()
        })
    }
})

                    <div class="row">
                        <div class="col-xs-12">
                            <div id="graphDiv" style="width: 45%; height: 45%; margin: auto">
                                <canvas id="js-broadband-estate-report" width="450" height="450"></canvas>
                            </div>
                        </div>
                    </div>

The chart.update() works for updating the chart but as I say it doesn't update my legend

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 62,099Questions: 1Answers: 10,183 Site admin
    edited March 2023 Answer ✓

    You'd need to ask in the support forum / channel of whatever chart library it is that you are using. This forum is for DataTables specific questions.

    Allan

  • murday1983murday1983 Posts: 29Questions: 12Answers: 0

    @allen you are entirely correct. I have no idea why I have asked it here and realised I wasted the entire previous day googling for an answer thinking datatable. Obviously a bad day for me yesterday, clearly lol

Sign In or Register to comment.