Promotic
WikipediaLinkedInYoutubeTwitterFacebook

transform - metoda objektu CanvasCtx

Popis:
Nahradí současnou transformační matici jinou.
Syntaxe:
transform(a As Long, b As Long, c As Long, d As Long, e As Long, f As Long) As Object
Volání:
ctx.transform(a, b, c, d, e, f);
Parametry:
a(Long) (přednastaveno 1) Horizontální poměr kreslení
b(Long) (přednastaveno 0) Horizontální zkosení kreslení
c(Long) (přednastaveno 0) Vertikální zkosení kreslení
d(Long) (přednastaveno 1) Vertikální poměr kreslení
e(Long) (přednastaveno 0) Horizontální posun kreslení
f(Long) (přednastaveno 0) Vertikální posun kreslení
Poznámka:
Transformace umožňují mapovat pozice z jednoho souřadnicového systému do jiného. Umožňuje to kreslení stejného tvaru do různě zvětšeného/zmenšeného, otočeného, posunutého, zrcadlově otočeného 2D prostoru. Je jednodušší transformovat souřadnice 2D prostoru než ručně přepočítavat souřadnice všech objektů pro dosažení stejného efektu. Veškeré transformace pozic jsou definovány 6 měnitelnými hodnotami a, b, c, d, e, f (z celkem 9) transformační matice pro 2D prostor. Výchozí hodnota netransformovaného 2D prostoru je 1, 0, 0, 1, 0, 0 (tzv jednotková matice). Transformační matice je součástí kreslící plochy. Metody save a restore ukládají i tuto transformační matici.

Transformační metody transform, translate, scale nebo rotate ovlivňují některou (nebo všechy) hodnotu transformační matice. Každá z těchto metod zachová aktuální platný stav transformační matice a do něj provede svojí změnu. Tzn. změny jsou kumulativní a sčítají se.

Transformační metoda setTransform naproti tomu nejdříve nastaví právě platnou transformační matici na výchozí hodnotu a nad ní provede transformaci transform. Jako jediná z transformačních metod umožňuje vynulovat kumulované transformace a nastavit novou transformaci bez kumulace.

 
Metodu lze volat i v událostech grafických prvků pro Web Obrazy.
Příklad1:
ctx.fillStyle = "yellow";
ctx.fillRect(0, 0, 250, 100);
ctx.transform(1, 0.5, -0.5, 1, 30, 10);
ctx.fillStyle = "red";
ctx.fillRect(0, 0, 250, 100);
ctx.transform(1, 0.5, -0.5, 1, 30, 10);
ctx.fillStyle = "blue";
ctx.fillRect(0, 0, 250, 100);
neobracet:
ctx.transform(1,0,0,1,0,0);
vlevo:
ctx.transform(0,-1,1,0,0,dy);
dolu:
ctx.transform(-1,0,0,-1,dx,dy);
vpravo:
ctx.transform(0,1,-1,0,dx,0);
převrátit:
ctx.transform(-1,0,0,1,dx,0);
vlevo převrátit:
ctx.transform(0,1,1,0,0,0);
dolu převrátit:
ctx.transform(1,0,0,-1,0,dy);
vpravo převrátit:
ctx.transform(0,-1,-1,0,dx,dy);
© MICROSYS, spol. s r. o.Tavičská 845/21 703 00 Ostrava-Vítkovice