0

nvd3-angularjs-directives を使用して作成されたグラフがあります。divのサイズに応じて、このグラフのサイズを調整したい。私の問題は、最初に y の値がこの値 2000000000 に達し、ラベルがその間のどこかで切り取られることです。ラベルも含めてグラフ全体が正しく表示されるようにグラフを調整できるようにしたい。

これがチャートです

<div ng-controller="GraphController">
    <nvd3-stacked-area-chart
    data="GraphData"
    id="Graphs"
    showXAxis="true"
    showYAxis="true"
    showLegend="true"
    interactive="true"
    tooltips="true"
    objectEquality="true"
    width="auto"

    xAxisTickFormat="xAxisTickFormatFunction()"
    yAxisTickFormat="yAxisTickFormatFunction()"
    >
        <svg></svg>
    </nvd3-stacked-area-chart>
</div>

1) width の値を auto に変更しました。しかし、うまくいきませんでした。

2) これを div style="color:blue;width:auto;" に追加しました。それもうまくいきませんでした

4

1 に答える 1

0

絶対的なサイズを指定する必要があると思います。これを回避するために私がしたことは、インラインでサイズを定義することでした:

<nvd3-stacked-area-chart 
  style="width:{{chartSettings.width}}px; height:{{chartSettings.height}}px;"
  ...
</nvd3-stacked-area-chart>

次に、コントローラーでサイズを動的に決定します。

$scope.chartSettings= {
    width:      $window.innerWidth*0.8, 
    height:     $window.innerHeight*0.8 
}
于 2015-03-24T10:27:56.967 に答える