具有角度調整大小的繪圖圖表

Question

我使用angular指令在我的HTML中成功顯示了一個flot圖表。 看起來像：

<flot id="placeholder" dataset="dataset" options="options" height="300px" width="100%" style="width:100%;" ng-disabled="graphLoading" ng-class="{disabled:graphLoading}"></flot>

我注意調整窗口大小，然后希望調整flot圖表的大小，因為它不會自動調整。

然而，重置數據源不起作用，我有點迷失下一步嘗試什么。

window.onresize = function(event) {
  console.log('refresh size of flot chart');
  refreshDataset();
}

只是尋找方向或想法，我可以嘗試調試或測試以找到解決方案。 似乎這里有一個jquery解決方案http://jsfiddle.net/9x7aJ/2029/ ，但我正在嘗試找到angularJS解決方案。

Answer 1

回答我自己的問題，最好的解決方案是使用flot.resize.js插件來獲取flot圖表。 我最初將它包含在index.html文件中，但由於angularJS的性質（我還在學習），需要將它包含在實際的控制器視圖html文件中以便訪問它。 所以我把jquery.flot.resize.js放到我的項目中，引用它就像這樣：

<script src="scripts/jquery.flot.min.js" cache="false"></script>
<script src="scripts/jquery.flot.time.js" cache="false"></script>
<script src="scripts/jquery.flot.resize.js" cache="false"></script>

較低技術的解決方案是調整大小時的屏幕刷新，但調整大小的插件更加優雅。

低技術解決方案：

window.onresize = function(event) {
    window.location.reload();
}