将JavaScript十六进制/ RGB颜色转换为波长,反之亦然

时间:2019-06-02 14:25:31

标签: javascript colors

我发现了this代码,它从波长范围( 到rgb)。

function wavelengthToColor(wavelength) {
  var r,
      g,
      b,
      alpha,
      colorSpace,
      wl = wavelength,
      gamma = 1;


  if (wl >= 380 && wl < 440) {
      R = -1 * (wl - 440) / (440 - 380);
      G = 0;
      B = 1;
 } else if (wl >= 440 && wl < 490) {
     R = 0;
     G = (wl - 440) / (490 - 440);
     B = 1;  
  } else if (wl >= 490 && wl < 510) {
      R = 0;
      G = 1;
      B = -1 * (wl - 510) / (510 - 490);
  } else if (wl >= 510 && wl < 580) {
      R = (wl - 510) / (580 - 510);
      G = 1;
      B = 0;
  } else if (wl >= 580 && wl < 645) {
      R = 1;
      G = -1 * (wl - 645) / (645 - 580);
      B = 0.0;
  } else if (wl >= 645 && wl <= 780) {
      R = 1;
      G = 0;
      B = 0;
  } else {
      R = 0;
      G = 0;
      B = 0;
  }

  // intensty is lower at the edges of the visible spectrum.
  if (wl > 780 || wl < 380) {
      alpha = 0;
  } else if (wl > 700) {
      alpha = (780 - wl) / (780 - 700);
  } else if (wl < 420) {
      alpha = (wl - 380) / (420 - 380);
  } else {
      alpha = 1;
  }

  colorSpace = ["rgba(" + (R * 100) + "%," + (G * 100) + "%," + (B * 100) + "%, " + alpha + ")", R, G, B, alpha]

  // colorSpace is an array with 5 elements.
  // The first element is the complete code as a string.  
  // Use colorSpace[0] as is to display the desired color.  
  // use the last four elements alone or together to access each of the individual r, g, b and a channels.  

  return colorSpace;

}

然后this 似乎表示可以将RGB(或就此而言,十六进制或任何其他计算机颜色格式)转换为波长,但是我无法理解/遵循发布。想知道是否可以在JavaScript中解释/显示如何至少转换为近似值(十六进制/ rgb / hsl / etc)。 (计算机颜色)值到纳米的波长。

我想取一个十六进制颜色并最终找到它的波长,同样,要取一个波长并找到它的十六进制。

如果不可能精确地做,那么任何粗略的近似都可以。我只是在尝试获取科学的波长值并将其转换为十六进制,并同样为十六进制值找到一个大概的波长范围,以显示(大致)十六进制颜色的科学对象。

1 个答案:

答案 0 :(得分:0)

Example

我编写了叠加在this wikipedia image上的给定颜色函数的示例。

因此,您的色彩功能不是很真实。您的解决方案不应基于此。但是,作为答案,您需要针对每种颜色的波长将光谱中的红色,绿色和蓝色通道分开。

此链接可以使您更好地理解。 https://thewayeyeseesit.com/2018/03/23/the-visible-spectrum-rgb-channels-explained/

来自this web page的图像可能使您更好地了解如何构造每个通道的分割功能。

Wavelengths