Metoda HTML canvas setTransform ()

Przykłady

Narysuj prostokąt setTransform () reset i utworzyć nową macierz transformacji, narysuj prostokąt ponownie, reset i utworzyć nową macierz transformacji, a następnie ponownie narysować prostokąt. Należy pamiętać, że w dowolnym momencie wezwać setTransform (), która przywraca przed macierzy transformacji, a następnie zbudować nową matrycę, w poniższym przykładzie, czerwony prostokąt nie jest wyświetlana, ponieważ znajduje się poniżej niebieskiego prostokąta:

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");

ctx.fillStyle="yellow";
ctx.fillRect(0,0,250,100)

ctx.setTransform(1,0.5,-0.5,1,30,10);
ctx.fillStyle="red";
ctx.fillRect(0,0,250,100);

ctx.setTransform(1,0.5,-0.5,1,30,10);
ctx.fillStyle="blue";
ctx.fillRect(0,0,250,100);

Spróbuj »

Pomoc Browser

Internet Explorer 9, Firefox, Opera, Chrome i Safari wsparcie setTransform metoda ().

Uwaga: 8 i wcześniejsze wersje programu Internet Explorer nie obsługuje <canvas> elementu.

Definicja i Wykorzystanie

Każdy obiekt na płótnie posiada aktualną macierz transformacji.

Metoda setTransform () do bieżącej macierzy transformacji Resetuje macierz, a następnie uruchomić z tymi samymi parametrami Transform () .

Innymi słowy, setTransform () pozwala powiększać, obracać, przesuwać i pochylać bieżące środowisko.

Uwaga: Ta metoda konwersji będzie dotyczyła jedynie setTransform () jest wywoływana po rysunku.

Składnia JavaScript:	Ramy .setTransform (a, b, c, d, e, f);

parametr Wartość

参数	描述
a	水平缩放绘图。
b	水平倾斜绘图。
c	垂直倾斜绘图。
d	垂直缩放绘图。
e	水平移动绘图。
f	垂直移动绘图。

HTML Instrukcja płótno referencyjny

Poprzedni: HTML płótnie przekształcić () metoda