Анимация

Анимация SVG-объекта происходит через тег <animate>, который добавляется между тем тегом, который надо анимировать.

<circle cx="20" cy="20" r="10" fill="black">
    <animate attributeName="cx" from="10" to="300" begin="0s" dur="1.5s" />
</circle>

Пример на JSFiddle

Также можно воспроизводить анимацию при клике на SVG-объект. Событие клика указывается через атрибут begin.

<circle id="curCircle" cx="20" cy="50" r="10" fill="black">
    <animate attributeName="cx" from="10" to="300" dur="1.5s" begin="curCircle.click" />
</circle>

Пример на JSFiddle