如何在视频播放中前进一帧前进一帧？ [英] How to step one frame forward and one frame backward in video playback?

问题描述

我需要搜索一些特殊功能/模式，这些功能/模式可能只在一个（或两个）许多帧中可见。帧速率可以低至每秒25帧，视频可能包含超过7500帧。我经常开始高速扫描视频，寻找可能找到该功能的片段，然后回放。我重复这个过程，同时逐渐降低播放速度，直到我找到一个相当小的时间窗口，我可以期待找到该功能（如果它存在）。然后，我想使用键击事件（例如右箭头键和左箭头键）通过单帧向前和向后前进，以找到感兴趣的特征。我已经设法使用HTML5和JavaScript来控制前进速度;但是，仍然不知道如何使用键盘单帧前进和后退通过视频。如何实现这一目标？请注意，我的网络浏览器是在Windows 7平台上运行的Firefox 26.

I need to search for some special features/patterns that might be visible in only one (or two) of many frames. The frame rate can be as slow as 25 frames per second and the video may contain over 7500 frames. I often start by scanning the video at high speed looking for a segment where I might find the feature, then rewind. I repeat this procedure while gradually reducing the playback speed, until I find a fairly small time window in which I can expect to find the feature (if it is present). I would then like to step forward and backward by single frames using key hit events (e.g. right arrow and left arrow keys) to find the feature of interest. I have managed to use HTML5 with JavaScript to control the forward speed; but, still do not know how to use the keyboard for single frame stepping forward and backward through a video. How can this be accomplished? Note, my web browser is Firefox 26 running on a Windows 7 platform.

推荐答案

您可以随时在视频中搜索设置currentTime属性。这样的事情：

You can seek to any time in the video by setting the currentTime property. Something like this:

var video = document.getElementById（'video'），
frameTime = 1/25; //假设25 fps

var video = document.getElementById('video'), frameTime = 1 / 25; //assume 25 fps

window.addEventListener('keypress', function (evt) {
    if (video.paused) { //or you can force it to pause here
        if (evt.keyCode === 37) { //left arrow
            //one frame back
            video.currentTime = Math.max(0, video.currentTime - frameTime);
        } else if (evt.keyCode === 39) { //right arrow
            //one frame forward
            //Don't go past the end, otherwise you may get an error
            video.currentTime = Math.min(video.duration, video.currentTime + frameTime);
        }
    }        
});

您需要注意的几件事情，尽管它们不会给您带来太多麻烦：

Just a couple things you need to be aware of, though they shouldn't cause you too much trouble:

1. 无法检测帧速率，因此您必须对其进行硬编码或将其列入某些内容中查询表或猜测。

1. There is no way to detect the frame rate, so you have to either hard-code it or list it in some lookup table or guess.

寻求可能需要几毫秒或更长时间并且不会同步发生。浏览器需要一些时间从网络加载视频（如果尚未加载）并解码帧。如果您需要知道何时完成搜索，您可以倾听搜索事件。

Seeking may take a few milliseconds or more and does not happen synchronously. The browser needs some time to load the video from the network (if it's not already loaded) and to decode the frame. If you need to know when seeking is done, you can listen for the 'seeked' event.

这篇关于如何在视频播放中前进一帧前进一帧？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！