HTML 5 Canvas Library
 

mapTFrom Library Method

Short Description: Animate mapped portion of texture canvas

Signature: t.mapTFrom (s,t,ws,wt,hs,ht) or (b,l,r)
Group: Texture
Class: transition Class
 
almost empty element with id="ex10"

This method is used to animate the texture. The parameters have the same meaning as with mapT. mapTTo defines the end of the animation, while mapTFrom defines the begin of the animation.

Examples

var a=taccgl.actor("testimg"); taccgl.a("ex10").mapTFrom(a.x,a.y,a.w,0,0,a.h)
.mapTTo(a.x,a.y,a.w,0,0,a.h/2).start();
RUN
var a=taccgl.actor("testimg"); taccgl.a("ex10").mapElement("testimg").
mapTTo(a.x,a.y,a.w,20,0,a.h-20).start();
RUN
var a=taccgl.actor("testimg"); taccgl.a("ex10").mapTFrom(a.x,a.y,0,a.h,a.w*0.2,0).
mapTTo(a.x+a.w*0.8,a.y,0,a.h,a.w*0.2,0).dur(5).start();
RUN
var a=taccgl.actor("testimg"), e=taccgl.a("ex10"); e.mapTFrom(a.x,a.y,0,e.w,e.h,0).
mapTTo(a.x+a.w-e.h,a.y,0,e.w,e.h,0).dur(5).start();
RUN
taccgl.a("testimg").paint();
taccgl.a("ex10").mapTFrom({el:"testimg"},{el:"testimg",ex:1},{el:"testimg",ey:1}).
mapTTo({el:"testimg"},{el:"testimg",ey:1},{el:"testimg",ex:1}).dur(5).start();
RUN
taccgl.a("testimg").paint();
taccgl.a("ex10").mapTFrom({el:"testimg"},{el:"testimg",ex:1},{el:"testimg",ey:1}).
mapTTo({el:"testimg",ex:1},{el:"testimg"},{el:"testimg",ex:1,ey:1}).dur(6).start();
RUN
taccgl.a("testimg").paint();
taccgl.a("ex10").mapTFrom({el:"testimg"},{el:"testimg",ey:1},{el:"testimg",ex:0.3}).
mapTTo({el:"testimg",ex:0.7},{el:"testimg",ey:1,ex:0.7},{el:"testimg",ex:1}).dur(5).start();
RUN

WebGL™ is a trademark of the Khronos Group Inc.

Next Page:transition.mapTTo - Animate mapped portion of texture canvas
Previous Page: transition.mapT - Map portion of texture canvas