Javascript 如何从基于X&；的色轮获取颜色值；Y坐标？

所以我有一个颜色轮，它将用于颜色选择器。
我是通过移动应用程序的NativeScript制作的。我想知道如何只使用X/Y坐标获得RGB或十六进制（因为我可以使用其中任何一个）

{x:0，y:0}

是正中心，所以负数是左上，而正数是右下。
我一直在努力弄清楚如何得到颜色。我没有代码显示，因为我不知道从哪里开始

色轮是预先制作的图像，而不是在使用应用程序时使用画布自动生成的图像

---

从这个轮子获取颜色的简单方法是将其获取为Hsl，然后将其转换为RGB（或十六进制）。色调和饱和度值很容易从一个圆确定，tan（色调）=y/x；色调=色调%360//饱和度=√（x²+y²）*100/半径。但亮度值无法从图片中确定，因此我选择50%。

以下所有角度测量都基于通常的数学意义：0°为水平向右，角度逆时针增加，因此90°向上，180°向左，270°向下

使用MS PowerPoint中的色轮（因为它是可用的），将圆圈分成3个120°宽的段，分别以0°、120°和240°为中心计算红色、绿色和蓝色的值

在线段边界上，颜色为相邻颜色的100%，因此60°为100%红色和100%绿色。相邻的颜色逐渐淡入段的中心，因此在90°（从红/绿边界到绿色中心的一半）时，颜色为100%绿色和50%红色

这就产生了相邻颜色的混合，相反颜色的混合是基于距离中心的距离

该映射方案不适用于RGB，因为它是一个三维空间，但是如果坐标用于色调和饱和度，并且相邻的滑块用于值，则它会为HSV提供3维中的2维。为简单起见，以下仅使用值设置为1的光盘

有关详细解释，请参阅

/*将弧度转换为度。
*
*@param{number}rad-要转换的弧度，需要
*根据数学atan2，范围内的rad+/-PI
*@返回相当于rad的{number}度
*/
函数rad2deg（rad）{
返回（360+180*rad/Math.PI）%360；
}
/*将h、s、v值转换为r、g、b
*见：https://en.wikipedia.org/wiki/HSL_and_HSV#From_HSV
*
*@param{number}色调-范围[0360]
*@param{number}饱和度-范围为0到1
*@param{number}值-范围为0到1
*@returns{Array | number}[r，g，b]范围在0到255之间
*/
函数hsv2rgb（色调、饱和度、值）{
色调/=60；
让色度=值*饱和度；
设x=chroma*（1-Math.abs（（色调%2）-1））；
让rgb=hue您似乎排除了一些细节，我假设您已经有了坐标转换方法或其他方法，我知道您有一个画布，因此您有画布api和图像数据

function getRGB(x, y, canvas) {
  let context = canvas.getContext('2d');
  let [red, green, blue, alpha] = context.getImageData(x, y, 1, 1).data;
  return {red, green, blue, alpha};
} 

在笛卡尔坐标系中，y轴通常是正向上的。你的挑战是将二维坐标转换为三维空间。你需要提供转换的算法，然后也许你可以研究如何实现它。关于RobG留下的评论，你可能希望看一下我在fe上写的一些代码w年前。不确定你是否觉得它有用。试试轮子和条带-可能对你来说没问题。你可以将直角坐标转换成极坐标，然后转换成HSV，然后再转换成RGB。看。我们已经有了一个颜色选择器插件-，你有机会试试吗？@Manoj yea实际上这就是我使用的atm。虽然那个插件没有支持android的色轮，这正是我试图创建的。在近100k的声誉下，你当然应该知道不要破坏你的答案。@tripleee答案有误导性，从极坐标直接映射到RGB并不能创建平滑的色轮。有一种技术（在我的评论中链接）将polar转换为HSV，然后将HSV转换为RGB以获得平滑的车轮。当我完成后，我会发布一个真实的答案。但如果OP在此期间试一试，那就太好了……发件人：答案可以由作者随时删除，除非答案被提问者接受。你的答案被提问者接受了吗？@RobG昨晚我有你r“超长”评论加载，但没有互联网接受。但是你的“评论”对我很好，我几乎完全完成了色轮。除了一些错误XD，我仍然接受你的答案。但是你最初的评论比这更有用。谢谢！@fructedProgrammer以前的版本可以通过“编辑"链接。我最初的答案部分正确，但不起作用。先去HSV，然后去RGB的策略是可行的。此外，如果你颠倒x坐标的感觉，你可以使用你的色轮。最后，如果你觉得你现在可以做得更好，你可以发布你自己的答案。：-）不，我没有画布…我使用的是NativeScript
AbsoluteLayout
将背景图像作为色轮