如何从 HTML5 视频播放器帧访问原始像素数据？
[英]How do I access raw pixel data from an HTML5 video player frame?
问题描述
我已经对此进行了一些谷歌搜索，但似乎无法找到有关如何完成的结果。 我想以图像识别为核心进行实验，而不是使用库，我正在尝试弄清楚如何访问帧的原始像素数据。
它是如何完成的？ 我想查看单个视频帧的像素网格数据结构并对该原始数据运行公式，以明确我的要求。 我对 JavaScript 非常擅长 - 我不是在寻找关于此的大教程，我只是想学习如何从视频帧访问图像数据。 例如使用什么方法或存在什么属性来访问像素数据。
2 个解决方案
解决方案1
2 2015-09-07 01:17:31
您可以将视频绘制到画布中。 然后从画布中，使用getImageData 。 它返回一个具有data属性的ImageData对象。 它是一个 Uint8ClampedArray，它包含 rgba 序列中的像素数据。
解决方案2
2 2015-09-07 01:18:07
您将视频帧绘制到 html5 画布中，然后使用getImageData从那里获取像素。
这里问题的主要来源是同源策略：只有脚本和视频在同一主机上时，它才会起作用。
此页面有一些无需库即可直接访问的示例： http : //html5doctor.com/video-canvas-magic/
如何使用JavaScript从html5 canvas检索原始位图数据？
[英]How do I retrieve raw bitmap data from html5 canvas using JavaScript?
如何使用带有修改HTML5视频播放器的onClick函数的div动态填充页面？
[英]How do I dynamically populate a page with divs with onClick functions that modify an HTML5 video player?
如何通过 chrome 的控制台截取 html5 视频的当前帧并将其复制到剪贴板
[英]How do I take a screenshot of the current frame of an html5 video through chrome's console and copy it to clipboard
如何使用HTML5和Jquery从视频中捕获缩略图（帧）？
[英]How to capture thumbnails (frame) from video with HTML5 and Jquery?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.