javascript - Is it possible to update the width of a chart in chart.js? -

my use case draw chart chart.js, , when user messes options, want add or remove bars bar graph have drawn, , accordingly update fixed width had (programmatically) set on chart.

here's how draw chart:

function drawchart(bardata) {   olddata = bardata;   var ctx = document.getelementbyid("estimatechart").getcontext("2d");   ctx.canvas.width = getchartwidth(bardata.length);   var chartdata = {     labels: labels,     datasets: [       {         highlightfill: "#888888",         data: bardata       }     ]   };   window.barfill = new chart(ctx).bar(chartdata, {     responsive: false   });   barfill.update(); } 

then when update chart, this

function updatechart(bardata) {   angular.foreach(olddata, function () {     barfill.removedata();   });   olddata = bardata;    angular.foreach(bardata, function (newbar, i) {     barfill.adddata([newbar], labels[i]);   });   barfill.chart.canvas.width = getwidth(bardata);   barfill.update(); } 

everything works fine... except width not change on updatechart call. when @ width on barfill object, after updatechart call, changes not saved.

i unable find updating width in chart.js documentation, i'm worried may not supported functionality out of box. have create new chart object , replace canvas element on dom whenever want change width? unfortunate since i'd keep nifty chart.js animations come built-in update function.

instead of changing barfill.chart.canvas.width. change barfill.scale.width.

function updatechart(bardata) {     angular.foreach(olddata, function () {         barfill.removedata();     });     olddata = bardata;      angular.foreach(bardata, function (newbar, i) {         barfill.adddata([newbar], labels[i]);     });      barfill.scale.width = getwidth(bardata);     barfill.resize().update(); } 

it works without call update() way, kept because right way per documentation.

i recommend resizing container instead of canvas element btw.

---

fiddle - http://jsfiddle.net/ja8cxybf/