Это код, (не убивайте меня, я только начал изучать javascript) ... Консоль Firefox'errors возвращает мне ошибку «Canvas is null», но я не понимаю, почему. Я предполагаю, что, возможно, это могло быть потому, что я передал идентификатор переменной неверным способом.
<html>
<canvas id="c1">
Your browser doesn't support canvas!
</canvas>
<video style="display:none;" id="video1" controls height="600px" width="800px" >
<source src="videos/movie.mp4" type="vide/mp4" >
<source src="videos/movie.ogv" type='video/ogg; codecs="theora, vorbis"'/>
<source src="videos/movie.webm" type='video/webm' >
</video>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function () {
video = document.getElementById("video1");
video.height = 600;
video.width = 400;
video.play();
aggiornacanvas("c1");
function aggiornacanvas(id) {
canvas = document.getElementById(id);
canvasContext = canvas.getContext("2d");
canvasContext.drawImage(video, 0, 0);
data = canvasContext.getImageData(0, 0, canvas.width, canvas.height);
//Modificare qui i dati dell'immagine
canvasContext.putImageData(data, 0, 0);
setTimeout(aggiornacanvas, 0);
}
}, false);
</script>
</html>
Хорошо, теперь работает, но есть другие ошибки
function aggiornacanvas(id)
{
canvas = document.getElementById(id);
canvasContext = canvas.getContext("2d");
canvasContext.drawImage(video,0,0);
var data = canvasContext.getImageData(0,0,canvas.width,canvas.height);
alert("ok");
canvasContext.putImageData(data,0,0);
setTimeout(aggiornacanvas(id),40);
}
Таким образом, это не работает, и я поправляюсь только один раз ... но если я напишу
function aggiornacanvas(id)
{
canvas = document.getElementById(id);
canvasContext = canvas.getContext("2d");
canvasContext.drawImage(video,0,0);
//var data = canvasContext.getImageData(0,0,canvas.width,canvas.height);
alert("ok");
//canvasContext.putImageData(data,0,0);
setTimeout(aggiornacanvas(id),40);
}
это работает! Проблема в том, что я думаю, что строки корректны, поэтому я не могу понять, почему они не работают с ними: (
ОБНОВЛЕНО Это работает! Это была проблема браузера, которая не позволяет получить доступ к imagedata локально! СПАСИБО, ребята, на мой первый вопрос там ответили!