You can not directly change the video aspect of a video in a html5 video tag; however you can read the video (assuming it is on the same domain) and place it into a canvas … first create a canvas to hold the aspect ratio of the video 640 x 480 and use the style to size it in this case to a 100 x 100 box.
<canvas id=”processCanvas” height=”480″ width=”640″ style=”width:100px; height:100px”>
</canvas>
Now use straight javascript with canvas functions to copy the video from the video tag onto the canvas.
function draw( )
{
gold = document.getElementById(‘vid’);
process.drawImage(gold, 0,0,640,480);
}
var canvas = document.getElementById(‘processCanvas’);
var process = canvas.getContext(’2d’);
setInterval ( “draw()”, 30 );
The aspect has now been changed from 640×480 to a 1 by 1 aspect or any other aspect ratio that I need. And is displayed in the canvas tag.
