I'm trying to extract frames from a video on angular. I found several post here on SO, especially this post
But the thing is, i need to specify how many frames would i wanted from this. here's what i did
loadImages() {
this.loading = true;
this.video.getFrames('/assets/ForBiggerBlazes.mp4', 375, VideoToFramesMethod.totalFrames).then((frames) => {
console.log(frames);
frames.forEach((frame) => {
var canvas = document.createElement('canvas');
canvas.width = frame.width;
canvas.height = frame.height;
canvas.getContext('2d').putImageData(frame, 0, 0);
document.getElementsByTagName('div')[0].appendChild(canvas);
});
});
}
number 375
is an estimate how many frame my video is, is there any way to get how many frames a video have on upload?
CodePudding user response:
The average HTML frame rate is 24 FPS, so if the video is 30 seconds, the total frame number is 30 x 24 Get the time of the video
const videoDOM=document.getElementById("video");
videoDom.duration
this will give u NaN
, so to avoid that, we need to wait for the duration to change then call videoDom.duration
videoDom.ondurationchange = () => {
this.vidDuration = vid.duration;
};
that way we can get an actual duration