The first svg graphic is created by plotting the x and y values of circle
with a radius of 100. If the x values are divided by 2, a vertical ellipse is created (i.e. rx=50, ry=100).
If the y values are divided by 2, a horizontal ellipse is created. (i.e. rx=100, ry=50).
The second svg graphic is created using the svg ellipse object. The ellipse object requires cx and cy canvas coordinates for the center
and rx ry (x radius and y radius). cx cy is the is center of the ellipse. rx=100, ry=100 creates circle with a radius of 100.
rx=50, ry=100 creates a vertical ellipse. rx=100, ry=50 creates a horizontal ellipse.
cx, cy, rx, ry are not the foci of the ellipse. cx cy is the mid point of the ellipse. rx is the x radius and ry is the y radius around the mid point.
The third svg graphic is the same as the second graphic but with a transform='rotate' applied to the second ellipse.
The rotate transform requires at least three parameters. They are the degrees of rotation and the cx cy (mid point).