D3刻度值，刻度值的左右边距

Question

我有一个具有顺序刻度的x-axis ，就像在此示例中一样： http : //bl.ocks.org/mbostock/3259783

如您所见，第一个名为“ apple”的刻度是从x轴的起点开始的，最后一个“ grapefruit”是在终点的。 我想要的是在最初的刻度上留一些填充，在最后的刻度上留一些填充。

这就是我想要的轴（还要记住，这是一个有序的刻度，我认为它与时间刻度或线性刻度有些不同）

这是我的代码：

var x = d3.scale.ordinal()
          .domain(["apple", "orange", "banana", "grapefruit"])
          .rangePoints([0, width]);

var xAxis = d3.svg.axis()
              .scale(x)
              .orient("bottom");

Answer 1

根据文档https://github.com/mbostock/d3/wiki/Ordinal-Scales，您可以在序数标度的开头和结尾指定填充， “作为点之间间距的倍数” 。

尝试：

var x = d3.scale.ordinal()
          .domain(["apple", "orange", "banana", "grapefruit"])
          .rangePoints([0, width], 1.0);