5

我需要绘制一个折线图,其中 x 轴将有刻度,表示带有毫秒细节的时间。

对于 x 比例,我正在使用d3.time.scale()

var xScale = d3.time.scale()
    .range([0, width])

x轴看起来像:

var xAxis = d3.svg.axis()
    .scale(xScale)   
    //.ticks(d3.time.second, 1)
    .orient("bottom")        
    .tickFormat(d3.time.format("%H:%M %L"));

但是 x 轴上的值/刻度没有按预期生成。

带时间刻度的 x 轴

x 轴的数据是日期对象,它们包含以下值(示例数据)

13:25:6 794 (%H:%M%S %L)
13:25:6 898 
13:25:6 994 
13:25:7 95 
13:25:7 194 
13:25:7 295 
13:25:7 395 
13:25:7 495 
13:25:7 595 
13:25:7 710 
13:25:7 795 
13:25:7 895
13:25:7 995 
13:25:8 95 
13:25:8 195 
13:25:8 294
13:25:8 395 
13:25:8 495
13:25:8 594
13:25:8 795 

但是,如果我采用线性刻度d3.scale.linear() 生成的刻度遵循预期的系列。

x 轴带线性刻度

time scale使用具有毫秒详细信息的数据的正确方法是什么。

如何以秒为单位设置刻度间隔:毫秒?

编辑:

另外,我怎么能每隔几毫秒就有一次滴答声,比如每 500 毫秒?

有一个 API d3.time.second,但没有什么像d3.time.millisecond. 我怎样才能添加一个?

小提琴使用时间刻度

4

2 回答 2

4

以秒为单位的间隔:毫秒意味着,你可以试试这个

.tickFormat(d3.time.format("%S %L"));
于 2013-08-27T09:53:49.150 回答
1

(删除过时的先前答案)

我为此针对 d3 项目创建了一个问题,它已得到修复:https ://github.com/mbostock/d3/issues/1529

可以在这里看到一个例子:http: //bl.ocks.org/mbostock/6618724

于 2013-09-18T21:40:26.143 回答