我正在使用 HTML5 画布和 DrawImage 函数来显示低速率视频。tnt 给出了很好的建议来让这个项目起步:尝试使用 Canvas 和 DrawImage 以 90 度显示低速率视频
虽然通过使用 onload 函数在加载时知道相机和角度时 tnt 的解决方案工作正常,但我需要能够在多个相机之间关闭和打开视频并更改其他参数。为了处理这个问题,需要一些单独的函数,但我无法首先在相机上执行 setInterval,然后将不断变化的图像传递给 DrawImage。'cam_1.jpg' 是下例中的视频。下面 body onload 中显示的函数也必须在运行时由其他例程调用。任何建议将被认真考虑。
var cam = null;
var c = null;
var ctx = null;
var ra = 0;
function init() {
cam = new Image;
c = document.getElementsByTagName('canvas')[0];
ctx = c.getContext('2d');
}
function draw(cam) {
ctx.save();
ctx.clearRect( 0, 0, 240, 320 );
ctx.translate( 240, 0);
ctx.rotate(1.57);
ctx.drawImage(cam, 0, 0 );
ctx.restore();
}
function inter() {
setInterval(function(){cam.src = 'cam_1.jpg?uniq='+Math.random();},500);
}
</script></head><body onload = "init(), draw(cam), inter()" >
谢谢你。