如何使颜色选择器粘贴/捕捉到某些值

【问题标题】：How to make color picker stick/snap to certain values如何使颜色选择器粘贴/捕捉到某些值
【发布时间】：2017-07-08 13:46:46
【问题描述】：

我将创建一个类似这样的圆形颜色选择器。将有 12 种颜色可供选择（每种颜色 30 度），并且指针可以拖动。

我不需要详细的解决方案，只是关于如何以这种方式使指针可拖动的指南，如果它设置在第一种和第二种颜色之间（比如 32 度），它应该滑动到 45 度（中间第二种颜色）等等。

谢谢！

【问题讨论】：

当你放下你的滑块时，你应该得到一个从 0 到 360 的值。所以你只需将它除以 30（每种颜色的度数），然后对结果执行 Math.round()，然后再乘以30. 您将获得最接近您输入值的值，例如 0、30、60、90 等。如果您希望它位于中间（如 15、45、75 等），只需在乞求时减去 15，然后在最终结果中加上 15。

【解决方案1】：

这是我在评论中提到的一个示例函数：

function roundAngle(angle)
{
    return Math.round((angle-15)/30) * 30 + 15;
}

【讨论】：

非常感谢 Jacob，它的工作方式正是我需要的方式。您能否也帮我处理一下触摸事件，因为我发现它很难工作。
如果你想在这里使用触摸，你需要分别替换鼠标事件：touchstarttouchmove和touchend。此外，您必须使用e.targetTouches[0].clientX 而不是使用e.clientX，这是一个示例：jsfiddle.net/JacobDesight/k58z44kb/24 但是，我不是触摸事件方面的专家，所以我建议了解它们here。