ChartJS plugin with live label update

915 Views Asked by At

I am currently using the chartJS plugin to draw a chart on my website which, of course, works wonderful.

However, I have it labelled on months now but I want the user to be able to switch to a day view as well so I made a button with an onclick event, I thought that would work but unfortunately it doesn't.

HTML:

<button type="button" class="btn btn-primary" onClick="days();">Sort On Days</button>

JQUERY:

var label = ["January", "February", "March", "April", "May", "June", "July"]; // Months here

       function days()
       {
           var label = ["01", "02", "03", "04", "05", "06", "07"]; // Days
       } 

var lineChartData = {
                labels: label,

How can I make it so that it will live update? Nothing happens currently.

1

There are 1 best solutions below

2
On

You need to do an update() after updating the labels. And you have to update the labels on the chart object.

window.days = function()
{
    myLineChart.scale.xLabels = ["01", "02", "03", "04", "05", "06", "07"]; // Days
    myLineChart.update();
} 

Fiddle - https://jsfiddle.net/rxoLjd92/