将以秒为单位的时间转换为 HH:MM:SS:FF

converting time in seconds to HH:MM:SS:FF

我在我的 ReactJs 项目中使用视频播放器。

我得到播放器的当前时间(以秒为单位),我想将该时间转换为 HH:MM:SS:FF format,其中 FF 代表特定的帧。

我已经能够将时间转换为 HH:MM:SS 格式,如下所示:

secondsToHms = (d) => {
  d = Number(d);
  var h = Math.floor(d / 3600);
  var m = Math.floor(d % 3600 / 60);
  var s = Math.floor(d % 3600 % 60);
  return ((h > 0 ? h + ":" + (m < 10 ? "00" : "") : "00:") + "0"+ m + ":" + (s < 10 ? "0" : "") + s);
}

假设我有一个以每秒 24 帧的帧速率播放的视频,并且我得到了我的时间,例如。像 126.2344452,我怎样才能改进我的函数来计算 FF 部分?

如果你知道 fps,计算应该很简单:

  1. second % 1得到时间的小数部分。
  2. 将它乘以 fps:0.0 秒是 "frame 0",0.9999 秒是 "frame fps-1"。
  3. 帧计数通常从零开始,但您可以加 1 使其从 1 开始。

如果您想要总帧,只需跳过第 1 步。

secondsToHms = ( d, fps = 24 ) => {
   const pad2 = txt => ( '0' + Math.floor( txt ) ).substr( -2 ),
         h = pad2( d / 3600 ),
         m = pad2( d % 3600 / 60 ),
         s = pad2( d % 60 ),
         f = pad2( d % 1 * fps ); // +1 here for one based frame
   return `${h}:${m}:${s}:${f}`;
}

I have taken the liberty to refactor your function. I hope it is still recognisably yours.

要计算 FF,只需 (1) 将您的总秒数乘以帧率,然后 (2) 执行 modulo division :

numberofseconds * fps % fps

这是您的函数的变体,可以正确转换为 HH:MM:SS:FF

var convertTime = function (input, fps) {
    var pad = function(input) {return (input < 10) ? "0" + input : input;};
    fps = (typeof fps !== 'undefined' ?  fps : 24 );
    return [
        pad(Math.floor(input / 3600)),
        pad(Math.floor(input % 3600 / 60)),
        pad(Math.floor(input % 60)),
        pad(Math.floor(input * fps % fps))
    ].join(':');
}

演示

var convertTime = function (input, fps) {
    var pad = function(input) {return (input < 10) ? "0" + input : input;};
    fps = (typeof fps !== 'undefined' ?  fps : 24 );
    return [
        pad(Math.floor(input / 3600)),
        pad(Math.floor(input % 3600 / 60)),
        pad(Math.floor(input % 60)),
        pad(Math.floor(input * fps % fps))
    ].join(':');
}

document.body.innerHTML = '<pre>' + JSON.stringify({
    5.4416555 : convertTime(5.4416555),
    126.2344452 : convertTime(126.2344452),
    1156.1535548 : convertTime(1156.1535548),
    9178.1351559 : convertTime(9178.1351559),
    13555.3515135 : convertTime(13555.3515135)
}, null, '\t') +  '</pre>';

另见 this Fiddle