как сделать переключение вида графика по кнопке в JS

Question

есть график MyChart

<canvas id="myChart"></canvas>

вот его отрисовка:

let ctx = document.querySelector('#myChart').getContext('2d');
    let chart_type = 'line' 
    let myChart = new Chart(ctx, {
        type: chart_type, // ТУТ ДОЛЖНО МЕНЯТЬСЯ ЗНАЧЕНИЕ  
        data: {
            labels: arrDate,
            datasets: [{
                label: 'Потрачено',
                data: sortPrice,
                backgroundColor: [
                    '#6fcdcd',
                    '#ff829d',
                    '#ffd778'
                ],
                borderColor: [
                    'black',

                ],
                borderWidth: 2
            }]
        },
        options: {

        }
    })

есть кнопка:

<input type="submit" id="remove" class="btn btn-success" value="Другой график">

есть переменная let chart_type = 'line', как мне сделать чтобы при нажатии на кнопку, значение chart_type менялось на chart_type = 'bar' и обратно, так чтобы прошлое значение было не актуально и график поменялся

Answer 1

Думаю, это поможет:

let cntr=0;
document.getElementById("remove"). addEventListener ("click", function(){
cntr=(cntr+1)%2;
let chart_type = cntr%2==0?'line' :'bar';
    let myChart = new Chart(ctx, {
        type: chart_type,
        data: {
            labels: arrDate,
            datasets: [{
                label: 'Потрачено',
                data: sortPrice,
                backgroundColor: [
                    '#6fcdcd',
                    '#ff829d',
                    '#ffd778'
                ],
                borderColor: [
                    'black',

                ],
                borderWidth: 2
            }]
        },
        options: {

        }
    })
})

БЛОГ НА HUSL

как сделать переключение вида графика по кнопке в JS

Ответы (1 шт):