https://codepen.io/topicstarter/pen/rPpZoa такие вещи на SVG делаются как в лужу Пукнуть ... что и даёт нам возможность для работы с canvas и анимировать каждую деталь по отдельности
MegaPuxapb, Это не сложно, открываем бесплатный векторный редактор InkScape и импортируем в него ваше изображение вот так :
Растягиваем изображение до удобного разрешения и рисуем по верх изображения для получения PixelPerfect , выбираем инструмент ellipse или рисование кругов вот так :
дальше я не буду комментировать так как на скриншотах я уже прокоментил
Дальше получаем круг с прерывистой линией ( там большой выбор прерывистых линий) нажимаем инструмент править кривые наводим на изображение и по бокам есть круглые маркеры вот их перетаскиваем до получения нужного разрыва - второй клик по объекты позволит крутить объект ...в общем на скринах всё видно