35

私はd3.jsを理解しようとしています。軸を定義する際に、x 軸にカスタム ラベルを付ける方法を教えてください。たとえば、私が取得するデフォルトのラベルは次のとおりです。

|------|------|------|------|------|------|
20    30     40     50     60     70     80

一方、私は次のようなものが欲しい：

|------|------|------|------|------|------| ....
20    26      32    38     44     50     56

私は現在それを学んでおり、提供された公式の例からコード（わずかに変更）に取り組んでいます：

var xAxis = d3.svg.axis().scale(x).tickPadding(7).orient("bottom");
var yAxis = d3.svg.axis().scale(y).tickPadding(5).orient("left");
4

1 に答える 1

71

量的スケールのデフォルトの目盛りは、2、5、および10の倍数です。6の倍数が必要なようです。珍しいことですが、これは基礎となるデータの性質によっては意味があります。したがって、axis.ticksを使用してティック数を増減できますが、常に2、5、および10の倍数が返されます（6ではありません）。

6の倍数が必要な場合は、axis.tickValuesを使用してティック値を明示的に指定できます。これは通常、d3.rangeと組み合わせて使用​​されます。例えば：

xAxis.tickValues(d3.range(20, 80, 4));

値を動的に計算する場合は、x-scaleのドメインを使用して、最小値と最大値を取得します。また、範囲の上限は排他的であることに注意してください。したがって、上記の例では、最大ティック値は76です。範囲の停止値を少し大きくすることで上限を含めることができます（例：81）。

于 2012-10-27T16:45:53.487 に答える