如何使用 d3js.org 将秒数格式化为 H:M:S

Question

我想使用 d3 api 将秒转换为 H:M:S。目前正在做：

 var parseSeconds = d3.time.format("%S").parse;
 var formatSeconds = d3.format("%H:%M:%S");
 var s = 3661;
 console.log( formatSeconds( parseSeconds(s) ) );

预期结果01:01:01

我知道 Moments.js 但我想坚持使用 d3。

请指教，

谢谢

Answer 1

有两件事；第一个是 d3 需要一个日期对象，而你传递的是一个数字；第二个是您需要使用时间格式化程序。这些问题会给您带来意想不到的结果。

您可以完全避免使用库，只需编写一个简单的自定义函数即可。

或者，您可以将秒数添加到方便的数据中，并使用您发布的代码的修改版本。

var formatSeconds = d3.format("%H:%M:%S"); 行应为：

var formatSeconds = d3.time.format("%H:%M:%S");

所以使用第二种方法选择一个时间，比如 01/01/2014，并通过以下方式创建一个日期对象：

var d = new Date(2014, 4, 1);

然后通过以下方式解析为 Unix Epoch 时间：

var u = +d;

（详见d3 doc's page）

通过将毫秒数添加到 u 来创建以小时、分钟和秒为单位的时间。例如。要增加 3661 秒，请尝试：

var newU = u + (3661*1000);

现在，使用以下方法将其转换回日期对象：

new Date(newU)

并传递到您的（修改后的）函数中：

formatSeconds(new Date(newU));

您显然可以遍历日期数组，或者任何适合您的数据的数组。

希望这对您有所帮助。

如何使用 d3js.org 将秒数格式化为 H:M:S

How to format seconds to H:M:S using d3js.org

d3.js