Задать вопрос

Собрать круг через дуги-path'?

Как лучше реализовать на SVG круг, состоящий из 8 дуг разных цветов. Спасибо!
  • Вопрос задан
  • 1652 просмотра
Подписаться 1 Простой Комментировать
Помогут разобраться в теме Все курсы
  • Яндекс Практикум
    Профессиональная вёрстка на HTML и CSS
    3 месяца
    Далее
  • Яндекс Практикум
    Фронтенд-разработчик расширенный
    13 месяцев
    Далее
Решения вопроса 1
youngmysteriouslight
@youngmysteriouslight
ТК, ТТ, JS, FP, WM
Написано топорно. Магическая константа 70=100/sqrt(2).
<path d="M 100 200 a 100 100 0 0 1 30 -70" stroke="blue" stroke-width="5" fill="none" />
<path d="M 130 130 a 100 100 0 0 1 70 -30" stroke="yellow" stroke-width="5" fill="none" />
<path d="M 200 100 a 100 100 0 0 1 70 30" stroke="blue" stroke-width="5" fill="none" />
<path d="M 270 130 a 100 100 0 0 1 30 70" stroke="black" stroke-width="5" fill="none" />
<path d="M 100 200 a 100 100 0 0 0 30 70" stroke="cyan" stroke-width="5" fill="none" />
<path d="M 130 270 a 100 100 0 0 0 70 30" stroke="red" stroke-width="5" fill="none" />
<path d="M 200 300 a 100 100 0 0 0 70 -30" stroke="yellow" stroke-width="5" fill="none" />
<path d="M 270 270 a 100 100 0 0 0 30 -70" stroke="grey" stroke-width="5" fill="none" />
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы