Defeated by coordinate spaces and transformations; need help figuring out what questions to ask

28 Views Asked by At

I'm trying to write a toy app that generates "procedural art" by rolling circles around inside each other. I have been banging my head against the math for months now, repeatedly thinking I've figured it out, but then every time I try to add something to it, it breaks. My "understanding" is brittle, apparently.

I'm writing this in Swift, which has an object called CGAffineTransform, which I understand perfectly, although not in a deeply theoretical sense, I'm sure. It has three methods, one for scaling, one for translating, and one for rotating. I have some code that applies these to each concentric circle to position and orient them on the screen, transforming each "child" circle to its "parent" size+position+orientation, until I reach the screen space. It all makes perfect sense, and works well enough, but as I say, now I'm trying to add something to it, and I can't get it to work, so I guess I'm missing something fundamental, so it's back to the drawing board.

I'm not sure what questions to ask. Maybe just for starters, what would be the correct general algorithm to transform a position+orientation through a chain of "parent" coordinate spaces? Specifically, how to position the red dot in the diagram:

The bane of my existence

I can get it to work if the green circle is at (0, 0) and has no rotation:

  1. Let p = dot position
  2. Transform p by rotating to the blue circle's rotation
  3. Transform p by scaling to the blue circle's radius
  4. Transform p by translating to the blue circle's position
  5. Transform p by scaling to the green circle's radius

This works. It seems like this could be extended in a kind of naive way if the green circle had non-zero position or rotation, just by replacing #5 above with these:

  1. Transform p by rotating to the green circle's rotation
  2. Transform p by scaling to the green circle's radius
  3. Transform p by translating to the green circle's position

But this isn't working out. My dot comes out on the circumference of the blue circle as expected, but in the wrong place on the circle. I'm guessing there's more that I don't understand, but I don't know what questions to ask. Maybe if I can get this part down, I'll understand all of it better and can answer my own questions. What's the "right" way to do this, ie, how would a mathematician go about it?