Estoy tratando de extraer cuadros de un video en angular. Encontré varias publicaciones aquí en SO, especialmente esta publicación https://stackoverflow.com/a/32708998 , intenté implementar la primera solución pero no puedo obtener ningún marco, todavía no sé por qué. Así que investigué al respecto nuevamente y encontré este recurso videotoframes que ya tiene una versión de tipo, después de algunas soluciones finalmente puedo extraer los marcos de un video como este y ponerlo en el lienzo.
Pero la cuestión es que necesito especificar cuántos fotogramas quiero de esto. esto es lo que hice
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); }); }); } el número 375 es una estimación de cuántos cuadros tiene mi video, ¿hay alguna forma de saber cuántos cuadros tiene un video al subirlo?
La velocidad de fotogramas HTML promedio es de 24 FPS, por lo que si el video dura 30 segundos, el número total de fotogramas es 30 x 24 Obtenga el tiempo del video
const videoDOM=document.getElementById("video"); videoDom.duration esto le dará NaN , así que para evitar eso, debemos esperar a que cambie la duración y luego llamar a videoDom.duration
videoDom.ondurationchange = () => { this.vidDuration = vid.duration; };de esa manera podemos obtener una duración real