d3v4时间轴将日期轴添加到底部？

Question

我重构了d3v4的时间表图表。我不确定如何将日期添加到底部以指示时间轴。

http://jsfiddle.net/0ht35rpb/179/

//scales 
var x = d3.scaleTime() 
     .range([0, w])    
     .domain([timeBegin, timeEnd]); 

其基于这个老时间轴代码 - 但是没有一个标记轴。 http://bl.ocks.org/bunkat/2338034

此示例调用的轴线..

https://github.com/jiahuang/d3-timeline

var axis = g.append("g") 
     .attr("class", "axis") 
     .attr("transform", "translate(" + 0 + "," + yPosition + ")") 
     .call(xAxis); 
    }; 

这是一个完善的解决方案？

g.append("g") 
    .attr("class", "axis") 
    .attr("transform", "translate(" + 0 + "," + (margin.top + (itemHeight + itemMargin) * maxStack) + ")") 
    .attr(timeAxisTickFormat.stroke, timeAxisTickFormat.spacing) 
    .call(xAxis.tickFormat("").tickSize(-(margin.top + (itemHeight + itemMargin) * (maxStack - 1) + 3), 0, 0)); 

Answer 1

在D3我们通常称之为axis可变参考轴发生器，不包含它的基团。除此之外，这确实是调用轴线的最常见方式：

var gX = chart.append("g") 
    .attr("class", "axis") 
    .attr("transform", "translate(" + 140 + "," + 450 + ")") 
    .call(d3.axisBottom(x)); 

这里是你的更新提琴：http://jsfiddle.net/5yqkz1z5/

PS：改变幻数在翻译的功能相应。