角度nvd3折線圖自動調整大小

Question

我使用的是角度nvd3指令。根據爲例

：https://github.com/angularjs-nvd3-directives/angularjs-nvd3-directives/blob/master/examples/lineChart.with.automatic.resize.html

<!-- 
width and height are removed from the directive for automatic resizing. 
--> 

好吧，如果我改變圖形的大小股利。它調整大小，但只有當我移動/打開/關閉'控制檯視圖'（ctrl + 轉變 + 我 FF）。

我檢查了angular-nvd3-directive，沒有事件調用調整大小，所以我想這是一個d3/nvd3 comportement？

我的問題到目前爲止：如何模擬這種事件的圖形來調整大小？

Answer 1

您可以嘗試觸發另一個可重繪圖形的調整大小事件。 window.dispatchEvent(new Event('resize'));

類似的方法適用於Chart.js。當控制檯可見時會改變頁面，這很奇怪 - 仍然沒有完全理解它是如何工作的，但它會定期顯示動態佈局。

Answer 2

我不知道它會幫助你或沒有，但我想你可以更新圖表，而你的DIV調整它的作品在我的情況： -

例如： -

$('#my_div').bind('resize', function(){ 

      for (var i = 0; i < nv.graphs.length; i++) { 
       nv.graphs[i].update(); 
      } 

}); 

Answer 3

你可以添加一個jQuery的resize事件處理程序，如果你不使用jQuery，那麼你可以使用角度附加事件處理程序。

使用jQuery

$(document).on('resize', function() { 
 

 
    for (var i = 0; i < nv.graphs.length; i++) { 
 
    nv.graphs[i].update(); 
 
    } 
 

 
});

採用了棱角分明只有

Here是一個例子，演示如何使用角度附加事件做文檔。