Graphic Transformations Explained

[kbmonkey]

A practical example is when you want to make canvas scroll.

When you draw a bunch of sprites (pseudo code):

Code: Select all

background:draw()
enemies:draw()
player:draw()

And want to offset all their drawing, without needing to update the sprite positions themselves, you can simply offset where we draw them on screen:

Code: Select all

translate(scrollX, 0)
background:draw()
enemies:draw()
player:draw()

In essence you won't need to pollute your game code with all the scroll-code, which can become a nightmare when a bug creeps in!

By the same token, you can draw your game at different scales without needing to change any of your sprite code:

(pseudo code)

Code: Select all

scale(0.5, 0.5)  -- half-sized displays
background:draw()
enemies:draw()
player:draw()