HTML and CSS Reference
In-Depth Information
context . strokeStyle = '#000000' ;
context . strokeRect ( 5 , 5 , theCanvas . width 10 , theCanvas . height 10 );
//video
//*** Start rotation calculation
context . save ();
context . setTransform ( 1 , 0 , 0 , 1 , 0 , 0 );
var
var angleInRadians = rotation * Math . PI / 180 ;
var
var x = 100 ;
var
var y = 100 ;
var
var videoWidth = 320 ;
var
var videoHeight = 240 ;
context . translate ( x + . 5 * videoWidth , y + . 5 * videoHeight );
context . rotate ( angleInRadians );
//****
context . drawImage ( videoElement , - . 5 * videoWidth , - . 5 * videoHeight );
//*** restore screen
context . restore ();
rotation ++ ;
//***
}
Figure 6-9 shows what the video will look like when rotating on the canvas. You can see the
full code for this in Example 6-9 .
Search WWH ::




Custom Search