I have these two lines in my code being developed in HTML5:
context.rotate(radian);
radian += 0.1;
context.translate(128,128);
The above result gives a different result the below lines:
context.translate(128,128);
context.rotate(radian);
radian += 0.1;
What is the difference between these 2 snippets of code? I get different result but why and how calculation differs, I am not able to understand this.
The difference is the origin of the transformation. If you perform a translate transform before, perhaps you have to adjust the transform-origin of the following rotate transform, or viceversa. It depends on the results you are trying to achieve.