Chartjs-Replace chartjs data

by

1👍

✅

set myChart["config"]["data"] = data2 instead

// Supplied Datasets to display
var data1 = { "labels": ["1", "2", "3"], "datasets": [{ "label": "Contacts", "data": [20, 15, 10], "backgroundColor": "rgba(255, 99, 132, 0.2)", "borderColor": "rgba(255,99,132,1)", "borderWidth": 1 }] };
var data2 = { "labels": ["1", "2", "3"], "datasets": [{ "label": "Contacts", "data": [10, 23, 41], "backgroundColor": "rgba(255, 99, 132, 0.2)", "borderColor": "rgba(255,99,132,1)", "borderWidth": 1 }] };

// Draw the initial chart
var kChartCanvas = $("#kontakteChart")[0].getContext('2d');
var myChart = new Chart(kChartCanvas, {
    type: 'bar',
    data: data1,
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }
});

// Called on Click
function chartContent() {
    myChart["config"]["data"] = data2; //<--- THIS WORKS!
    myChart.update();
}

// Set the listener for the click function
$(document).ready(function() {
    $("#control1").click(chartContent);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
<canvas id="kontakteChart"></canvas>
<button id="control1">UMSCHALTER</button>

Leave a comment