SVG анимация должна быть простой

Question

У меня есть простой рисунок SVG с анимацией.
У меня есть два объекта, которые движутся по кругу вокруг общего центра с разными скоростями вращения. Я хочу нарисовать линию, соединяющую два объекта.

Рисунок SVG выглядит следующим образом:

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <circle cx="200" cy="150" r="5" fill="blue">
        <animateTransform
            attributeName="transform"
            begin="0s"
            dur="30s"
            type="rotate"
            from="90 150 150"
            to="-90 150 150"
            repeatCount="indefinite"
        />
    </circle>
    <circle cx="226.2" cy="150" r="5" fill="red">
        <animateTransform
            attributeName="transform"
            begin="0s"
            dur="30s"
            type="rotate"
            from="47.8 150 150"
            to="-47.8 150 150"
            repeatCount="indefinite"
        />
    </circle>
</svg>

Достаточно просто рассчитать положение объектов в любой момент времени, но SVG, похоже, не позволяет легко сделать это таким образом.
Я убежден, что это можно сделать с помощью нескольких вращений и, возможно, масштабирования, но я не могу понять, как это будет работать.

Итак, кто-нибудь знает, что делать?