Ottieni i numeri di fotogramma in HTML5 Video

Question

Sto provando a catturare ogni numero di fotogramma del video, ma sembra che non ci sia modo di ottenerlo. Così ho iniziato il mio orologio per abbinare i numeri di fotogramma del video, ma non corrispondono mai e la differenza continua ad aumentare con l'avanzare del video.

Per favore dai un'occhiata al mio cestino. http://jsbin.com/dopuvo/4/edit

Ho aggiunto il numero di fotogramma a ciascun fotogramma del video da Adobe After Effect in modo da avere informazioni più precise sulla differenza. Il video è in esecuzione a 29,97 fps e anche la richiestaAnimationFrame è impostata per aumentare il numero alla stessa velocità, tuttavia non sono sicuro da dove provenga questa differenza.

A volte corrispondono e a volte no. Ho anche provato a farlo offline ma ottengo gli stessi risultati. Qualsiasi aiuto.

Answer 1

Ho trovato qualcosa su github per questo. https://github.com/allensarkisyan/VideoFrame

ho implementato in questo violino: http://jsfiddle.net/Ck6Zq/184/

var currentFrame = $('#currentFrame'); 
var video = VideoFrame({ 
    id : 'video', 
    frameRate: 29.97, 
    callback : function(frame) { 
     currentFrame.html(frame); 
    } 
}); 

$('#play-pause').click(function(){ 
    if(video.video.paused){ 
     video.video.play(); 
     video.listen('frame'); 
     $(this).html('Pause'); 
    }else{ 
     video.video.pause(); 
     video.stopListen(); 
     $(this).html('Play'); 
    } 
}); 

EDIT: aggiornato violino al nuovo video in modo che funziona di nuovo.

Answer 2

Il problema è che setTimeout non è realmente prevedibile, quindi non si può essere sicuri che esattamente una nuova cornice sia stata visualizzata ogni volta che si esegue la funzione. È necessario controllare lo currentTime del video ogni volta che si aggiorna la visualizzazione della cornice e moltiplicarla per la frequenza dei fotogrammi.

Ecco un esempio funzionante: http://jsbin.com/xarekice/1/edit È disattivato da un frame, ma sembra che all'inizio ci siano due frame contrassegnati con "000000".

alcune cose circa l'elemento video che si consiglia di essere a conoscenza di:

1. Come ti sembra di aver scoperto, non c'è alcun modo affidabile per determinare il frame rate, in modo da avere a scoprirla altrove e hard-code. Ci sono alcune cose interessanti in corso con video metrics, ma sono non standard, non ampiamente supportate e, secondo la mia esperienza, completamente inefficaci nel determinare il frame rate effettivo.

2. Il currentTime non è sempre esattamente rappresentativo di ciò che è sullo schermo. A volte è un po 'più avanti, soprattutto durante la ricerca (che è il motivo per cui nel mio JSBin, non aggiorno la cornice mentre stai cercando).

credo currentTime gli aggiornamenti su un thread separato dal sorteggio video reale, in modo che tipo di opere come essa la propria orologio che continua a andare avanti. È dove il video vuole essere, non necessariamente dove si trova. Quindi puoi avvicinarti, ma devi arrotondare i risultati del calcolo del fotogramma e una volta ogni tanto potresti essere spenta di un fotogramma.