Как повернуть с одного угла на другой с продолжительностью анимации с помощью библиотеки svg.js?

Question

Я использую библиотеку svg.js для ротации.Я хочу, чтобы вращение происходило от одного угла к другому.Мне нужна анимация продолжительностью 500 мс между поворотами.На краю браузера вращение происходит не по кругу, а прямо к следующему углу.Я уже определил точку вращения как 50,50.

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

function moveHotspotPointer(angle) {
    if (currentBrowser == "ie" || currentBrowser == "edge") {
        var hp = SVG.get('hotspot-pointer');
        hp.animate(500).rotate(angle, 50, 50);

        /* hp.animate(500).transform({ rotation: 255, cx: 50, cy: 50 }).transform({ rotation: angle,  cx: 50, cy: 50 }) */

    }
}

Ожидаемый результат: вращение должно происходить с одного угла на другой с некоторой продолжительностью.

Фактический результат: вращение происходит на полном циферблате, а затем достигает угла назначения вместо угла к углу.