D3.js缩放刻度标记

Question

我试图在D3.js中创建一个时标。我有以下代码

time_scale = d3.time.scale()
        .range([0, chart_dimensions.width])
        .domain([d3.min(total_data, function(d) {return new Date('01/07/'+d.year)}),
                    d3.max(total_data, function(d) {return new Date('01/07/'+d.year)})]);

var time_axis = d3.svg.axis()
        .scale(time_scale);

我的年度日期范围从Fri Jan 07 2000 00:00:00 GMT+0200 (South Africa Standard Time（我运行函数time_scale.invert(0)时获得的输出）到Tue Jan 07 2014 00:00:00 GMT+0200 (South Africa Standard Time)，基本上每年15个日期。该轴绘制，但它绘制了蜱，即2002,2004,2006,2008,2010,2012,2014 ......当我更喜欢2001,2002,2003,2004 ......或2002,2004时，它会跳过一年。 2006年...但是在两年之间有刻度标记，表示两者之间的年份。如何在D3.js中实现这一目标？

提前致谢， Tumaini

Answer 1

唯一确定的方法是使用.tickValues() function并明确设置刻度位置。由于您有时间范围，因此您可以使用便捷功能time_scale.ticks(d3.time.year, 1)为您的域中的每年打勾并将其传递给.tickValues()。

完整演示here。