define a center point c current mouse point at m

在你的鼠标拖拽事件处理程序中，你会有

var dx = m.x-c.x;
var dy = m.y-c.y;

var scale = radius/Math.sqrt(dx*dx+dy*dy);

slider.x = dx*scale + c.x;
slider.y = dy*scale + c.y;

半径将是滑杆的预设值。

这个怎么样：http://www.thewebmasterservice.com/dev-blog/curved-rounded-or-circular-sliders-javascript-jquery-ui

一些说明和演示。

我写了一个支持全/半圆形滑块的jQuery插件。

演示页面 & 文档

请查看此处的jQuery roundSlider插件： http://roundsliderui.com/。这正是您想要的。

这个圆形滑块具有类似于jQuery ui滑块的选项。它支持默认、最小范围和范围滑块类型。它不仅支持圆形滑块，还支持各种圆形形状，如季度圆形、半圆形和派圆形状。

欲了解更多细节，请查看演示和文档页面。

请查看来自jsFiddle的演示。

相关答案：https://stackoverflow.com/a/31367164/1845801和https://stackoverflow.com/a/31369265/1845801。

截图：

将此翻译成中文：