2016-11-17 8 views
2

Y軸の一番下のチックは私が作成した折れ線グラフには表示されません。軸を作成するコードです:はy軸の一番下のチックを表示します

var y = d3.scale.linear().range([height, 0]); 

var yAxis = d3.svg.axis().scale(y) 
    .orient("left").ticks(5) 
    .innerTickSize(-width) 
    .outerTickSize(0) 
    .tickPadding(10); 

enter image description here

軸は大丈夫ですが、私はY軸の下部に最大でダニやテキストを表示する必要があります。ここで何がうまくいかないの?ドメイン内Here is the JSFiddle.

答えて

1

使用nice()

y.domain([ 
    d3.min(chartData, function(n) { 
     return d3.min(n.values, function(d) { 
      return d.value; 
     }); 
    }), 
    d3.max(chartData, function(n) { 
     return d3.max(n.values, function(d) { 
      return d.value; 
     }); 
    }) 
]).nice(); 

はここにあなたのフィドルです:https://jsfiddle.net/c8mjha3o/

+0

しかし、あなたはフィドルに最初のチャートを見れば、まだ底がほとんどのテキストとダニ示していません。グリッド自体に問題があるかもしれませんが、これに対する解決策はありますか?私はいつも一番下に目を向けるべきです。 – Rishabh

+1

D3軸は動的であると想定されます。したがって、「常に最初のチックを表示する」という簡単な解決策はありません。必要に応じて、 'tickValues'を使うことができます:https://github.com/d3/d3-3.x-api-reference/blob/master/SVG-Axes.md#tickValues –

関連する問題