Hello math enthusiasts and experts! I'm a software developer who has recently become enamored with animation on the web. Several of the posts on this forum have already proven extremely helpful in solving some of my earlier conundrums, but I think I've run into one that requires some specific assistance. As such, I've just now registered and this is my first post. Thank you in advance.
I'm trying to do some programmatic animation, and I've been puzzling over the actual cartesian coordinates that will reside on the motion path. Here's what I want:
In a rectangular area with cartesian point of (0, 0) as its center point, my object (a circle) has a center point initially located at any coordinates that do not have a zero for either the X or Y value.
My object's final resting point (end of animation) will be a point mirrored to the quadrant that is vertically opposite of the one from whence the object originates. For example, if my starting point is (3, -2), then my end point will be (3, 2). If my starting point is (-5, 4), them my end point will be (-5, -4). As such, if my starting point is (x1, y1), my end point is (x1, -y1).
The midpoint of my object's path will be (0, 0).
The path that the object will traverse will be visually identical to that of one half of an ellipse.
Based on these requirements, I believe what I'm looking for is a way to calculate the Steiner circumellipse of the isosceles triangle defined by the start, mid, and endpoints of the animation.
I've been reading up on Steiner circumellipses, but I'm not certain I understand how to perform a formulaic calculation to determine such. To exacerbate the calculation, I wish to determine the cartesian position of my object based on the percentage of the animation that has completed.
Complete example: My animation start point is (40, 25). As specified above, my animation end point is therefore (40, -25) and my animation midpoint is (0, 0). At 0% of the way through the animation, my circle's center point coordinates will be those of the start point (40, 25). At 100% of the way through the animation, my circle's center point coordinates will be those of the end point (40, -25). At 50% of the way through the animation, my circle's center point coordinates will be (0, 0).
What I'm looking for is a way to solve for the correct cartesian coordinates of my circle's center point at p, where p is the percentage of the animation that has completed.
So if my start point is (40, 25), what are the correct coordinates for the circle when p=35? What about when p=96? what about when p=42?