How to make a controller in the form of a circle?

Question

css

Need advice on how to make a non-standard controller in the form of a circle. Which for example would be responsible for the sound in the player. For example, its shaded part is responsible for the current volume level. Need advice on how to make it up and how to manage it later in js. Maybe there are some libraries. I'll attach a screenshot below to make it clear what I'm talking about.

Answer 1

Look at this article , it is well painted and there is a ready-made example

Answer 2

The easiest way is to use SVG for this purpose. For example, with the help of such a library, it will not be difficult to implement the plan.