Math behind simulating a simple light source for rotated rectangle?

Question

Say I have a 2D Rectangle. By offsetting its position by x y and rendering a shadow by an offset, it gives the illusion of a shadow. If I rotate the rectangle Z degrees and try it with the same offset, it appears as though the light source has moved. How can I compensate for the angle so it appears as though the shadow is always coming from the same direction?

Answer 1

I tried recreating this and to me it seems like the light source is fixed correctly, e.g. here the light source remains to the top right of the figure:

So I think maybe what you're doing wrong is the order in which you apply the rotation and the offset. You need to apply the rotation first, and then the translation. (And if you had a scale, it would also need to come before the translation)

I'm using XNA so SpriteBatch already got the multiplication order right for me by default :) But here's my code for reference anyway:

private Vector2 position = new Vector2(450, 200);
private Vector2 offset = new Vector2(-100, 100);
private float rotation = 0f
private Vector2 origin = new Vector2(shadow.Width/2f, shadow.Height/2f);

spriteBatch.Begin();
spriteBatch.Draw(shadow, position + offset, null, Color.Black * 0.2f, rotation, origin, Vector2.One, SpriteEffects.None, 0f);
spriteBatch.Draw(shadow, position, null, Color.White, rotation, origin, Vector2.One, SpriteEffects.None, 0f);
spriteBatch.End();

On this example I'm also rotating the rectangle around its center, but I tried with the origin set to zero and it didn't cause any problems for the shadow.

And to show you why order of multiplication matters when applying transformations check this image:

The reason for this behavior is simply because transformations are always applied using the "origin" of the current space. Translation remains the same regardless of the origin, since it's just a displacement and does not need a point of reference. But scaling and rotation vary greatly as you can see from the picture.

Applied to your example of shadows if you don't keep in mind the correct order you'll get a shadow that's glued to your figure!