6

アプリケーションの 1 つで d3.js チャートを使用しています。これがこの画像の中にありますチャートを参照してください

マネー チャートの Y 軸 (画像を参照) では、最大バー サイズが 358.72 ドルであっても、最大値を 400 に丸めたいのですが、バーを 358.72 に保ちたいのですが、Y 軸では 400 リミットになります.

コードはこちら

tradesChart = [ 
      {
        key: "Cumulative Return",
        values: [
                        {
            "label" : "6E",
            "value" : 100       },
                    {
            "label" : "NG",
            "value" : 100       },
                    {
            "label" : "TF",
            "value" : 67        }        ]
      }
    ];
        nv.addGraph(function() {

      var chart = nv.models.discreteBarChart()
          .x(function(d) { return d.label })
          .y(function(d) { return d.value/100 })
          .staggerLabels(true)
          .showValues(true)
          .valueFormat(d3.format('.0%'))

      chart.yAxis.tickFormat(function(d) { return d3.format('d')(d*100) + '%'; });

      d3.select('#chart-trades svg')
        .datum(tradesChart)
        .transition().duration(500)
        .call(chart);

      nv.utils.windowResize(chart.update);

      return chart;
    });

親切にこれを解決するのを手伝ってください

4

3 に答える 3

16

Y 軸スケールのドメインを変更する必要があります。通常、次のようなステートメントでデータの最大値から導出されます。

yScale.domain([0, d3.max(data, function (d) { return d.v; }) ]);

あなたの場合、代わりに次のように変更する必要があります。

yScale.domain([0, 400]);

または、データから最大値または最小静的値を設定する場合は、次のようにすることができます。

yScale.domain([0, d3.max(data, function (d) { return d.v > 400 ? d.v : 400; }) ]);

jsfiddle の完全な例はこちらです。

それがD3.jsでそれを行う方法です。由緒あるnvd3.js libに慣れていないため、スケールにアクセスする方法がわかりませんが、見てみます。

于 2013-02-13T19:12:49.497 に答える
0

フォース Y

Y スケールに強制する数値のリスト (つまり、0、または最大 / 最小など)。数値は、d3.js が値を決定するのではなく、スケールで使用する値を d3.js に伝えます。

データ型: 数値の配列 ([0, 50]

http://cmaurer.github.io/angularjs-nvd3-directives/line.chart.html

于 2014-07-17T20:44:51.633 に答える
0

私はnvd3を使用していますが、代わりにこれが機能しました：

nv.models.discreteBarChart().yDomain([0,400])

私はそれを動作させることができませんでしたyScale.domain

于 2018-08-08T08:17:09.003 に答える