html5 видео рисует черный ящик (пустой) на холст

Question

Я динамически загружаю и рисую первые кадры маленьких видеоэлементов на более крупный холст. (когда вы переворачиваете его, он их играет). Обычно он работает (90% времени), но случайным образом иногда одно или другое видео рисует черный ящик, означающий, что imagedata, отснятый с видео, пуст.

Как я это делаю, чтобы использовать событие canplaythrough для каждого из видео, чтобы определить, готово ли видео для отбора, но мне интересно, есть ли лучшее событие, которое я должен использовать?

, например:

myvid.addEventListener("canplaythrough",function() 
     { 
      //do the sampling now 
     }); 

но выше иногда и, казалось бы, случайно рисует пустой?

Любые идеи? Я также пробовал: onloadeddata и canplay но они были еще менее надежными

Answer 1

Я чувствую, что причина пустой рамки - даже одно секундное видео также состоит из множества кадров. Таким образом, он может содержать пробел между ними. Я чувствую, что событие может проиграть. Вы можете изменить логику выборки.

myvid.addEventListener("canplaythrough",function() 
     { 
      //check the intensity of some pixels of sample if they are blank. If blank then raise canplaythrough event 
//else do the sampling now 
     });