View source for Tutorial:Graphic Transformations

This tutorial covers the basics of using graphic transformations.

== [[love.graphics.push]]/[[love.graphics.pop]] ==

These two functions allow you to save and return to the previous transformation state. 
Every push must be paired up with a pop, and each pair can also be called within another push/pop.

Here's an example:

<source lang="lua">
function love.draw()
	love.graphics.push() -- Store the previous transformation state
		-- Shift the coordinate system down 10, right 10
		love.graphics.translate(10,10)
		love.graphics.point(0,0)
	love.graphics.pop() -- Return to the previous transformation state
	love.graphics.point(0,0) -- The origin is back at (0,0)
end
</source>

== Order of Transformations ==

Graphic transformations are not commutative. This means the call order affects the 
final result.

Here's an example:

<source lang="lua">
function love.draw()
	love.graphics.push()
		love.graphics.translate(10,10)
		love.graphics.scale(-1,-1)
		love.graphics.point(10,10) -- The point is located at global (0,0)
	love.graphics.pop()
	
	love.graphics.scale(-1,-1)
	love.graphics.translate(10,10)
	love.graphics.point(10,10) -- The point is located at global (-20,-20)
end
</source>

There are two ways to visualize the above code.The first way is to think of each transformation as
relative to the new coordinate system from previous transformations. For example,
the scaling to the first point would be applied relative to the new origin at (10,10).

The second way (which is more intuitive in my humble opinion) is to visualize each transformation in 
REVERSE ORDER relative to the global coordinate system. Let's take the first point as an example. 
Scaling is applied first and places the new point at (-10,-10). Lastly, the translation moves the new 
point to (0,0).

== See Also ==
* [[love.graphics.scale]]
* [[love.graphics.shear]]
* [[love.graphics.rotate]]
* [[love.graphics.translate]]

[[Category:Tutorials]]
{{#set:LOVE Version=0.8.0}}
{{#set:Description=Covers the basic of using graphic transformations}}

== Other Languages ==
{{i18n|Tutorial:Graphic Transformations}}