将 y 轴网格线添加到 D3 甘特图

将水平网格线添加到 d3 甘特图的最佳方法是什么这个例子 http://bl.ocks.org/baramuyu/be8e3005cfcb0aba5f763963c75f3c7e？我最初想制作一个轴并在图表的长度上做刻度线（如这个例子 https://bl.ocks.org/anonymous/11bd68cce12df5678b483e5c8bac30cd），但这会将它们直接置于图表矩形的中间。

是否可以将轴标记为矩形周围的“车道”，或者更容易绘制线条（如所做的那样）here http://bl.ocks.org/bunkat/1962173)?

解决方案来自此问题发布在 GitHub 上 https://github.com/d3/d3/issues/2670。基本上只需将轴组平移带宽度的一半即可：

var yScale = d3.scaleBand()
        .domain(lanes)
        .rangeRound([0, chartHeight], 0.1);

var yGridAxis = d3.axisLeft()
        .scale(yScale)
        .tickFormat('')
        .tickSize(-chartWidth);

chart.append('g')
        .attr('class', 'grid')
        .attr('transform', function(d) {
            return 'translate(0,' + (-yScale.bandwidth()/2) + ')';
        })
        .call(yGridAxis);