根据文档,您可以将 HTMLVideoElement 传递给 Easel.js 位图。来自文档
Bitmap ( image )
Parameters:
image <Image | HTMLCanvasElement | HTMLVideoElement> The Image, Canvas, or Video to render to the display list.
我已经设法加载图像并将其添加到 Canvas 中,所以我知道我的库设置和代码可以正常工作,但我不知道如何添加视频。
我可以添加一个视频标签并让文件在 Canvas 和框架之外播放,我可以通过访问上下文将视频直接添加到 Canvas 而无需使用 Easel,所以我知道视频是好的。
如果能提供几行示例代码,我们将不胜感激。
最佳答案
为了添加视频,您需要将它添加到您的 DOM(html5 上的典型视频标签)并在 js 上选择该元素并将其作为参数传递给您的 Bitmap 实例。
JS:
var introVideo = document.getElementById("introVideo");
var bitmap = new Bitmap (introVideo);
stage.addChild (bitmap);
HTML:
<video autoplay id="introVideo" style="display:none">
<source src="./videos/01_Intro.mp4" type="video/mp4" />
<source src="./videos/01_Intro.ogv" type="video/ogg" />
</video>
希望对您有所帮助!
关于javascript - 使用 Easel.js 将视频添加到 HTML 5 Canvas,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8059351/