javascript - D3.js-棒グラフのxAxisの幅が短すぎます

Question

D3.jsを使用して棒グラフ（フィドル）を作成しました。

私は1つの（おそらく非常に単純な）質問があり、それについていくつかのサポートを得ることができてうれしいです：

x軸が短すぎるのはなぜですか？

Answer 1

古い質問であり、スタックでの最初の回答の試みですが、それでも役立つことを願っています:

Xドメインは、グラフの最後のバーの左下のポイントになるXMaxにのみ移動することがわかります-「短く」なっていません。XMax後のバーの幅がわからないだけです.

(20 ピクセルの barWidth を追加することは考慮されておらず、テキストの配置は追加の幅を考慮しているため、Axis でのみ問題が発生しているようです。)

軸を最後まで拡張するには、ドメインで追加の barWidth を考慮するか、別の方法で追加の barWidth を追加する必要があります。これは、xMax にさらに半日ほど追加するか、各バーを +barWidth ではなく X 位置 (-barWidth) の左側にシフトすることで可能になる場合があります。

Answer 2

x 軸は短すぎません (最大値に対してちょうど十分な高さです) が、いいものにしたかったかもしれません。

var y = d3.scale.linear()
    .domain([0, yMax])
    .range([h - margin.top - margin.bottom, 0])
    .nice();