[Chartjs]-Bootstrap grid not working with canvas

by

16👍

I managed to solve your problem!

Please check this jsFiddle.

Try resizing the panels to see it in action.

Basically, you call a function that responds to the resize of the window:

$(window).resize(respondCanvas);

that triggers a fetch of the width and height of the parent element that it is encapsulated in and then redraws your chart.

function respondCanvas() {
    c.attr('width', jQuery("#daily").width());
    c.attr('height', jQuery("#daily").height());
    //Call a function to redraw other content (texts, images etc)
    myNewChart = new Chart(ct).Bar(data, options);
}

You can adjust all tiny bits like your own IDs, classes, width and heights.

0👍

in the JavaScript file where you add all the options for the chart

new Chart(ctx).Line(data, options );

//Boolean - If we want to override with a hard coded scale
    scaleOverride : true,

Leave a comment