[html5] canvas shape rotatation & order of execution

[Dean, John]

My code below successfully rotates a drawing object at the center of the drawing object, but I want to understand happens behind the scenes:

1. ctx.translate(100, 100);
2. ctx.rotate(Math.PI / 4);
3. ctx.translate(-100, -100);
4. ctx.fillRect(50, 80, 100, 40);

https://html.spec.whatwg.org/multipage/scripting.html#current-transformation-matrix says transformations are performed in reverse order. Does that mean the execution order is 4, 3, 2, 1? Or 3, 2, 1, 4? More importantly, how does it work exactly?

john

[cid:image08f985.JPG at 2cc8618d.46ba3b12]<http://www.park.edu>    John Dean
Associate Professor of Computer Science
Park University - Parkville Campus
Computer Science, Information Systems and Mathematics
8700 NW River Park Drive
Parkville, MO  64152
816-584-6422 (Office)
John.Dean at park.edu<mailto:John.Dean at park.edu>

This e-mail message and any attached files are confidential and are intended solely for the use of the addressee(s) named above. If you are not the intended recipient or person responsible for delivering this confidential communication to the intended recipient, you have received this communication in error, and any review, use, dissemination, forwarding, printing, copying, or other distribution of this e-mail message and any attached files is strictly prohibited. If you have received this confidential communication in error, please notify the sender immediately by reply e-mail message and permanently delete the original message. Thank you.

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/help-whatwg.org/attachments/20160122/0f927746/attachment.htm>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image08f985.JPG
Type: image/jpeg
Size: 7268 bytes
Desc: image08f985.JPG
URL: <http://lists.whatwg.org/pipermail/help-whatwg.org/attachments/20160122/0f927746/attachment.jpeg>