5 - Advanced image handling (1)

So, we've managed to draw an image onto our canvas, what else can we do with it?

Well, there are a few additional options available to us.
First up we have...

drawPart

This command is used, as its name suggests to "draw" a "part" of an image to a location.

imagename.drawPart(whichcanvas,xpos,ypos,partx,party,partw,parth,alpha,rotation,
scalex,scaley);

IMAGENAME refers to the variable name, in our example it is "mylogo".

WHICHCANVAS refers to the name of the canvas you wish to draw to. XPOS and YPOS refer to the location on the canvas X number of pixels in from the left, and Y number of pixels down from the top. PARTX and PARTY refer to the location on the image X number of pixels in from the left, and Y number of pixels down from the top you wish to start cropping from. PARTW and PARTH refer to the size of the "part" of the image you wish to draw onto our canvas. These two values will be in pixels. ALPHA is the normalised value of the alpha (default=1, 0 would be invisible, 0.5 would be semi-transparent).

ROTATION refers to the rotation angle of the image in degrees (default=0). (It should be noted that 360 is the same as 0, 370 is the same as 10 and so on).

SCALEX and SCALEY is the normalised zoom factor (default=1, 2 is twice as big etc). The two values are NOT required to be the same, so shape distortion is possible. (It should be noted that if the image zoom is higher than 1, canvas will be default attempt to smooth the image - if you wish to retain the sharpness of the image, and resultant pixelation, a set of additional commands must be added to the "init" function - see end of this section for me details). Unused elements of the command can be ignored, and the default will be applied. So therefore, the following two commands are the same: mylogo.drawPart(mycanvas,20,20,40,40,200,50);

mylogo.drawPart(mycanvas,20,20,40,40,200,50,1,0,1,1);

So, for a "real" example, we will use three different examples of this command. function go(){

mylogo.drawPart(mycanvas,50,50,40,40,200,80);

} This example would draw part of the image, 50 pixels in from the left, and 50 pixels down from the top. The part would be "cut" 40 pixels in from the left, and 40 pixels down from the top, and the "piece" we have "cut" would be 200 pixels wide, and 80 pixels high. This example, shows the normal draw command, along with a drawPart command in use.