javascript - Angular nvd3折れ線グラフの自動サイズ変更

Question

angular 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.
-->

さて、グラフの Div サイズを変更すると。サイズは変更されますが、「コンソールビュー」を移動/開く/閉じるときのみです( ctrl+ shift+ iFF)。

angular-nvd3-directive を確認しました。サイズ変更のイベント呼び出しはありません。d3/nvd3 のコンポートメントだと思いますか?

これまでの私の質問: グラフのサイズを変更するために、この種のイベントをシミュレートするにはどうすればよいですか?

Answer 1

jquery サイズ変更イベント ハンドラを追加できます。jquery を使用していない場合は、角度のみを使用してイベント ハンドラをアタッチできます。

jQuery の使用

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

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

});

Angular のみを使用する

これは、angular を使用してイベント do ドキュメントを添付する方法を示す例です。