Question

我正在尝试使用d3.js time intervals API编码间隔回合函数。

我想要做的事情非常简单：编写一个函数，将一个时间四舍五入到最近的6个小时，并将其作为Date对象返回。

例如：

10：30，d3.hour.my6HourRound(new Date)今天应返回12:00
12：30，d3.hour.my6HourRound(new Date)今天应返回12:00
23:50，d3.hour.my6HourRound(new Date)明天应返回00:00

一定不是那么困难，但d3.js api缺少API中的使用演示。

Answer 1

这是我的解决方案，它使用内置的d3功能：

function another6HourRound(date) {
    var subHalf = d3.time.hour.offset(date, -3);
    var addHalf = d3.time.hour.offset(date, 3);
    return d3.time.hours(subHalf, addHalf, 6)[0];
}

返回最近的6小时间隔（00,06,12或18）

Answer 2

您正在寻找此示例：http://bl.ocks.org/mbostock/4149176

针对您的案例的工作示例：http://bl.ocks.org/musically-ut/7699650

示例代码

function timeFormat(formats) {
  return function(date) {
    var i = formats.length - 1, f = formats[i];
    while (!f[1](date)) f = formats[--i];
    return d3.functor(f[0])(date);
  };
}

var customTimeFormat = timeFormat([
  [d3.time.format("%Y"), function() { return true; }],
  [d3.time.format("%B"), function(d) { return d.getMonth(); }],
  [d3.time.format("%b %d"), function(d) { return d.getDate() != 1; }],
  [d3.time.format("%a %d"), function(d) { return d.getDay() && d.getDate() != 1; }],
  [d3.time.format("%I %p"), function(d) { return d.getHours(); }],
  [d3.time.format("%I:%M"), function(d) { return d.getMinutes(); }],
  [d3.time.format(":%S"), function(d) { return d.getSeconds(); }],
  [d3.time.format(".%L"), function(d) { return d.getMilliseconds(); }]
]);

var xAxis = d3.svg.axis()
    .scale(x) // x is a scale.
    .tickFormat(customTimeFormat);

在你的情况下，你想要这样的东西：

var customTimeFormat = timeFormat([
  ["00:00", function () { return true; }],
  ["06:00", function (d) { return 3 <= d.getHours() && d.getHours() < 9; }],
  ["12:00", function (d) { return 9 <= d.getHours() && d.getHours() < 15; }],
  ["18:00", function (d) { return 15 <= d.getHours() && d.getHours() < 21; }]
]);

Answer 3

好吧，我已经实现了自己的解决方案。通过深入研究D3的源代码，我发现他们如何编写时间函数。小时就像：

  d3_time.hour = d3_time_interval(function(date) {
    var timezone = date.getTimezoneOffset() / 60;
    return new d3_date((Math.floor(date / 36e5 - timezone) + timezone) * 36e5);
  }, function(date, offset) {
    date.setTime(date.getTime() + Math.floor(offset) * 36e5);
  }, function(date) {
    return date.getHours();
  });
  d3_time.hours = d3_time.hour.range;
  d3_time.hours.utc = d3_time.hour.utc.range;

我只是写

my6HourRound = function(date) {
    var hours = 6;
    var timezone = date.getTimezoneOffset() / 60;
    return new Date((Math.floor(date / 36e5 / hours - timezone) + timezone) * 36e5 * hours);
}

哪个有效。我很确定有一种更好的方法可以使用D3函数来实现这种通用性。否则，您需要定义日，月，周，年等的自定义函数。因此，我不接受我自己的问题。

我期待以D3方式制作它的那个。

如何在d3.js中定义自定义时间间隔

3 个答案: