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

Question

[Александр]

Как лучше реализовать на SVG круг, состоящий из 8 дуг разных цветов. Спасибо!

Answer 1

[youngmysteriouslight]

Написано топорно. Магическая константа 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" />