如何从x，y坐标转换为唯一的RGB值？

Question

我正在尝试为屏幕上的每个x，y坐标生成一个唯一的RGB值（我正在JS中执行此操作。

每个RGB值至少显示一次并不重要，但每个显示的RGB值唯一（这不是必须显示所有颜色，但不能有重复的颜色）是很重要的。

[我见过很多人建议使用HSL / HSV以确保使用所有颜色，但是由于在我的情况下这不是必需的，所以我想知道是否有更简单的方法。

我想出的方法如下：

var x = event.pageX/window.screen.width;
var y = event.pageY/window.screen.height;
var z = 1-x-y;

var r = parseInt(x*255);
var g = parseInt(y*255);
var b = parseInt(z*255);

我将x和y坐标转换为介于0和1之间的值，从这两个坐标中获得z，然后乘以255以从0-1到1-255之间的值。

尽管这是功能，但在x〜0.5和y〜0.5附近有重复的颜色，并且错过了RGB光谱的相当大的一部分。

有人在保持相对简单的同时，还知道有更好的方法吗？

Answer 1

假设x和y都适合12位，您将获得24位，这是三种8位颜色的正确数字。因此，这将为高达4096x4096的屏幕每个像素生成唯一的颜色。

function xy_to_rgb(x,y) {
  var t = x&0xFFF | (y<<12)&0xFFF;

  return {
    r: t&0xFF,
    g: (t>>8)&0xFF,
    b: (t>>16)&0xFF
  };

}