d3具有unix时间戳的时间标度x轴 [英] d3 time scale x axis with unix timestamp

查看:529
本文介绍了d3具有unix时间戳的时间标度x轴的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

无法使用d3 js格式化此时间序列图表的x轴。



这是一个工作示例:http://tributary.io/inlet/7798421



问题:我只能看到1个日期)在我的x轴上,而不考虑指定的总刻度。如何在4-6轴上显示x轴上的时间?



编辑:下面的解决方案感谢Lars。



这是我在UTC时间:

  var data = [
{time:1387212120, open:368,close:275,high:380,low:158},
{time:1387212130,open:330,close:350,high :389,low:310},
{time:1387212140,open:213,close:253,high:289,low:213}

data.forEach(function(d){d.time = new Date(d.time * 1000)});

然后d3接受默认格式,或者您可以自定义。

$ b问题是,JavaScript Date 对象(你隐式转换你的时间戳)到你的时间戳。而不是以秒为单位的时间戳,而是以毫秒为单位。



完成示例此处。我也已转换为日期的显式。


Having trouble formatting the x-axis of this time-series chart using d3 js.

Here is a working example: http://tributary.io/inlet/7798421

The issue: I can only see 1 date (label) on my x-axis, regardless of total # of ticks specified. How can I display the time on x-axis with 4-6 ticks?

EDIT: Solution below thanks to Lars.

Here is my time in UTC:

var data = [
    {"time": 1387212120, "open": 368, "close": 275, "high": 380, "low": 158},
    {"time": 1387212130, "open": 330, "close": 350, "high": 389, "low": 310},
    {"time": 1387212140, "open": 213, "close": 253, "high": 289, "low": 213}];

data.forEach(function(d){ d.time = new Date(d.time * 1000) });

And then d3 accept it, in default format, or you can customize.

解决方案

The problem is that Javascript Date objects (into which you are implicitly converting your timestamps) are not timestamps in seconds, but in milliseconds. If you multiply all your time values by 1000, it works.

Complete example here. I've also made the conversion to Dates explicit.

这篇关于d3具有unix时间戳的时间标度x轴的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆