Categories:

Cloud (204)

Entertainment (11)

Facebook (43)

General (50)

Life (31)

Programming (64)

Technology (398)

Testing (4)

Tools (488)

Twitter (5)

Wearable (26)

Web Design (44)

Collections:

Other Resources:

List of Transformation Functions

Q

What are transformation functions?

✍: FYIcenter.com

A

SVG supports 5 transformation functions: translate(), rotate(), scale(), skew(), and matrix().

1. matrix(a, b, c, d, e, f) - Transform the object coordinates by applying a 2-d matrix with the first 4 parameters and followed by a 2-d translation with the last 2 parameter:

x' = a*x + b*y + e y' = b*y + d*y + f

2. rotate(d, cx, cy) - Transform the object coordinates by rotating them around (cx,cy) for d degree clockwise:

x' = (x-cx)*cos(d*PI/180) - (y-cy)*sin(d*PI/180) + cx y' = (x-cx)*sin(d*PI/180) + (y-cy)*cos(d*PI/180) + cy

3. scale(sx, sy) - Transform the object coordinates by scaling x with sx and y with sy:

x' = sx*x y' = sy*y

4. skewX(d) - Transform the object coordinates by pushing the y-axis d degree:

x' = x + y*tan(d*PI/180) y' = y

5. skewY(d) - Transform the object coordinates by pushing the x-axis d degree:

x' = x y' = x*tan(d*PI/180) + y

6. translate(dx, dy) - Transform the object coordinates by moving the origin to the given location:

x' = x + dx y' = y + dy

**⇒** SVG (Scalable Vector Graphics)

**⇐** Transform Group of Objects Using "g"

2023-08-03, 368🔥, 0💬

Popular Posts:

How to view dynamic field codes in Microsoft Word? Each dynamic value is Microsoft Word is driven by...

How to create a new WeChat account with my Facebook account? Creating a new WeChat account with a Fa...

How to make continuous page numbering in a FrameMaker book? I want to see the page number continues ...

Where to find answers to frequently asked questions on Microsoft Teams? Here is a list of frequently...

How to download publication files from libgen.rs? libgen.rs or gen.lib.rus.ec is the most robust Web...