在NVD3上使用datetype时，xAxis线图tics与网格错误地对齐
我目前正在使用NVD3使用角指令(角-nvd3 3)。我有一个非常简单的线条图和非常简单的数据。
我现在遇到的问题是我的数据与Axis错误地对齐。示例柱塞器在这里可用：http://plnkr.co/edit/jWEYt6?p=preview，
我在xAxis上使用日期，这些日期是使用d3库解析的：
tickFormat: function(d) {return d3.time.format('%d/%m')(new Date(d))}描述：
我希望xAxis标签与网格相对应。
在这个示例中，您可以清楚地注意到xAxis是不均匀划分的(值: 06/11、08/11、11/11、13/11)。所以通常是2天，有时是3天:)
更糟糕的是，这些山峰与电网不匹配。例句: 06/11滴答实际上并不接近网格的线，我猜它应该在那里。
我也在回购公司的master's代码上尝试过这一点，而且它也发生在那里。在head部分有一个链接。
我的数据、正确的日期格式或其他方面是否有问题？谢谢!
回答 1
Stack Overflow用户
发布于 2016-02-11 07:58:05
因为问题是，根据Atais的说法：
由于d3.time.format('%d/%m')，实际问题是隐藏的。我的示例数据是以每天一次滴答的方式给出的，并相应地设置了格式。但d3不明白这一点。当绘制网格时，它将最大值/某个值除以，网格滴答不一定发生在全天(午夜)，而是在任何一个小时。因为格式的问题，我看不出来。
我设法将x的值作为整数值 (ex: 20160211)传递给nvd3，而不是格式化日期(ex: 2016-02-11或nvd3)，然后在tickFormat上格式化它们以正确显示。
我用这个问题和注释的解决方案编写了另一个柱塞(使用了动量)：
具有模拟误差的柱塞：http://plnkr.co/edit/fXDQ0f?p=preview
数据是以x: milliseconds, y: int格式提供的，就像{x: 1446418800000, y: 20},一样，并且正在用tickFormat进行格式化。
xAxis: {
tickFormat: function(d) {
return moment(d).format('YYYY-MM-DD');
}
}使用解决方案的柱塞：http://plnkr.co/edit/KpALzo?p=preview
数据是以x: int, y: int格式提供的，就像{x: 20160211, y: 20},一样，并且正在用tickFormat进行格式化。
xAxis: {
tickFormat: function(d) {
moment(d, 'YYYYMMDD').format('YYYY-MM-DD');
}
}请注意，您也可以用时间来完成它，只需附加到“数字日期”。
如@ajaybc中所述，将不能很好地处理不同月份的日期，因为d3将在填充日期无效的情况下插入X轴( 32、33、34天等)
https://stackoverflow.com/questions/33959649
复制
腾讯云开发者
