three dots on round-slider

Question

I am trying to figure out the way to add not two but three dots/handles on a round slider (here: https://roundsliderui.com/document.html#options)

According to the documentation number of possible handles is defined by sliderType option which can be either default or min-range or range - the last one defines two handles instead of one.

Any advice how to handle (pun not intended) is welcome.

Answer 1

In roundSlider by default it have one or two handles only. If you want to add multiple handles then you can achieve it by some customization. Check the below demo:

DEMO 1

In addition, based on your requirement I have the below suggestion for you. If you want to divide the circle into 3 pieces then you can do it with 2 handles itself. Check the below demo:

DEMO 2