D3.js d3只显示星期日:
我希望我的体重秤从第一天开始,到最后一天结束,而不是只显示星期天: 我希望数据从:28开始(不是3),但它从3开始,即周日: 如何在一周中的任何一天开始称重 我希望显示的日期与我给出的数据相匹配,而不是显示星期天 链接到示例: 提前谢谢 这里是代码:(html中会有一个)D3.js d3只显示星期日:,d3.js,D3.js,我希望我的体重秤从第一天开始,到最后一天结束,而不是只显示星期天: 我希望数据从:28开始(不是3),但它从3开始,即周日: 如何在一周中的任何一天开始称重 我希望显示的日期与我给出的数据相匹配,而不是显示星期天 链接到示例: 提前谢谢 这里是代码:(html中会有一个) 你有几个选择 在轴上调用“记号”将参数传递到基础比例,以获得轴要绘制的记号列表。当您传入单个数值时,刻度将尝试生成“良好”值。数字值是一个提示,提示您理想情况下可能喜欢多少个刻度-这并不能保证您将实际收到多少个刻度 .tick
你有几个选择 在轴上调用“记号”将参数传递到基础比例,以获得轴要绘制的记号列表。当您传入单个数值时,刻度将尝试生成“良好”值。数字值是一个提示,提示您理想情况下可能喜欢多少个刻度-这并不能保证您将实际收到多少个刻度
.ticks(5)
结果:
03/03日03/10日03/17日03/24日03/31日
由于您使用的是时间刻度,因此您还可以选择指定刻度之间的时间量,例如:
.ticks(d3.time.days,7)
结果:
03/01周五03/08周五03/15周五03/22周五03/29周五04/01周一
这会让你每7天打勾一次。但我认为它仍然会尝试包括“好”的时间界限,比如月初
对于微调(但有点静态)的情况,实际上可以使用轴上的tickValues方法精确地指定您想要的记号的位置。我使用它精确设置了所有数据点的日期:
xAxis2.tickValues(data.map(function(d) { return d.date;}))
最后,您实际上可以将一个参数传递给ticks函数,以便每次都准确地获得所需的ticks。该函数将获得开始和结束,以便将刻度设置为加上我所做的中点:
xAxis3.ticks(function(start, end) {
console.log(arguments);
var mid = new Date((start.getTime() + end.getTime()) / 2);
虽然在这种情况下,您可能应该在刻度上设置函数,这样您就可以通过轴调用来使用步长参数(请参阅d3文档中的更多内容)
你可以拉小提琴
还请查看和的文档。还有一个很棒的axis教程。我刚刚遇到了一个非常类似的问题,我无法在d3文档中找到答案。然而,我浏览了一下d3源代码(),发现了以下几行代码:
d3.time.weeks = d3.time.sunday.range;
记住这个提示:请注意,如文档中所述
var xAxis = d3.svg.axis()
.scale(x)
.ticks(d3.time.weeks, 1);
在每个星期天给出一个带记号的轴,依此类推
var xAxis = d3.svg.axis()
.scale(x)
.ticks(d3.time.xxxday.range, 1);
在每个
xxxday
上给出一个轴,其中xxxday
是monday
,周二
,周三
,周四
,周五
,周六
或周日
,这是一个非常优雅的解决方案。但愿我能投更多的票。这比绿色支票的答案要好!我同意#jasongonzalest。在我看来,滴答声(d3.time.sunday.range,1)的解决方案是正确的答案。我们今天如何解决“美国优先”的问题?d3.time在版本4.13中没有定义。不幸的是,这不是一个非常令人满意的答案,尽管这提供了一些关于定制刻度的好信息@凯文的答案在我看来是最好的。
var xAxis = d3.svg.axis()
.scale(x)
.ticks(d3.time.xxxday.range, 1);