在调整父div的大小时,ChartJs会调整大小

时间:2014-08-25 21:50:58

标签: angularjs chart.js

我有一个angularJs指令,用于创建ChartJs图表。当父div重新调整大小时,我想调整图表的大小。根据文件,这可以通过以下方式实现:

.resize()

Use this to manually resize the canvas element. 
This is run each time the browser is resized, 
but you can call this method manually if you 
change the size of the canvas nodes container element.

这里有一个plunkr:http://run.plnkr.co/KarokZXZ0hGNJpe9/

如果您想查看文件:http://plnkr.co/edit/1cx681?p=info

尝试单击按钮,图表不会更改尺寸。如果您尝试更改窗口大小,则会调整其大小。

如何在不更改窗口尺寸的情况下获得此效果?

1 个答案:

答案 0 :(得分:3)

我遇到了同样的问题,并在Firefox中使用Firebug扩展程序来查看在调整浏览器大小时ChartJS正在做什么。我发现它正在将一些参数传递给resize方法。以下对我有用:

$scope.$apply();
chart.resize(chart.render, true); 

您可能不需要$ scope。$ apply(),但在我的情况下,我发现它是必要的,因为我正在更改导致画布大小更改的范围属性。