O'Reilly logo

Sams Teach Yourself SVG in 24 Hours by Micah Laaker

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Transforming with the scale Property

Scaling objects is handled by applying

transform="scale(x,y)" 

to your desired object. In this case, “x,y” refers to the horizontal scale and vertical scale of the applied object (not x and y positioning as with the translate property). To scale an object uniformly, you need include only the x value, as the y value will be assumed to be the same.

In each case, the value of 1 is equivalent to “100%.” So, to apply a scale transformation that is twice as large as the original object, you would apply transform="scale(2)". Reductions are thus handled using decimal values; to apply a scale transformation making an object half as big as the original object, you would apply transform="scale(0.5)".

To illustrate this ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required