【发布时间】:2011-08-24 14:23:24
【问题描述】:
我目前正在尝试自定义一个 HTML5 视频播放器,以便我可以添加一个返回当前帧号的按钮。
假设我有一个持续 90 秒的 30fps 视频。当我单击该按钮时,我希望它打印当前帧的编号。这可能吗?
【问题讨论】:
标签: javascript html html5-video
我目前正在尝试自定义一个 HTML5 视频播放器,以便我可以添加一个返回当前帧号的按钮。
假设我有一个持续 90 秒的 30fps 视频。当我单击该按钮时,我希望它打印当前帧的编号。这可能吗?
【问题讨论】:
标签: javascript html html5-video
我认为跨浏览器没有设置标准帧速率,也没有任何方式可以使用 html5 视频开箱即用地访问当前帧。您可以做的是使用每秒 29.97 帧的电视标准帧速率,然后简单地将其乘以视频的当前时间,如下所示:(vid.currentTime * 29.97).toPrecision(6)。
这是我设置的小提琴,演示如何将其绑定到按钮以获取当前帧: http://jsfiddle.net/893aM/1/
【讨论】:
.currentTime 不够准确,无法达到每帧级别。
我认为您可以将以下 API 用于基于 Webkit/Mozilla 的浏览器:
Mozilla 在 Firefox 中实现了以下统计信息:
mozParsedFrames - number of frames that have been demuxed and extracted out of the media.
mozDecodedFrames - number of frames that have been decoded - converted into YCbCr.
mozPresentedFrames - number of frames that have been presented to the rendering pipeline for rendering - were "set as the current image".
mozPaintedFrames - number of frames which were presented to the rendering pipeline and ended up being painted on the screen. Note that if the video is not on screen (e.g. in another tab or scrolled off screen), this counter will not increase.
mozFrameDelay - the time delay between presenting the last frame and it being painted on screen (approximately).
Mozilla 也在研究此处列出的一些统计数据。
Webkit 已经实现了这些:
webkitAudioBytesDecoded - number of audio bytes that have been decoded.
webkitVideoBytesDecoded - number of video bytes that have been decoded.
webkitDecodedFrames - number of frames that have been demuxed and extracted out of the media.
webkitDroppedFrames - number of frames that were decoded but not displayed due to performance issues.
我还在研究 IE9 上的分辨率...
参考:http://wiki.whatwg.org/wiki/Video_Metrics
【讨论】:
有一个不错的 Video Frame JS 库来处理帧 https://github.com/X3TechnologyGroup/VideoFrame
这是一个非常古老的问题,但这可能对新读者有用。
【讨论】: