javascript - 小数值转为 RGB 再转回十进制

标签 javascript rgb

我有一个十进制形式的颜色,需要将其转换为 rgb 并返回到 de,因此我使用了以下方法:

var currentcolor = 0xffd100;

const rgb_format = (c) => {
  var newrgb = {r: (c & 0xff0000) >> 16,
                g: (c & 0x00ff00) >> 8,
                b: (c & 0x0000ff)}

  return newrgb;
};

var rgb = rgb_format(currentcolor);

const decimal_format = (newrgb) => {
  let decimal = (newrgb.r << 16) + (newrgb.g << 8) + (newrgb.b);

  console.log(decimal);

  return decimal;
};

color.color = decimal_format(rgb);

事实是,我有一个 RGB 编辑器,其中每个值(r、g、b)都有 slider 。它们按应有的方式工作,但是当 r 中的值等于或小于 16 时,其他 slider (g、b)停止更改我正在编辑颜色的组件的颜色。

rb为0并且g大于16时,也会发生同样的情况。在这种情况下,g将颜色更改为红色,而小于16时,大于16时不显示颜色。 这是一个 gif 来显示我的问题: color-editing-problem-gif 或者 alternate

最佳答案

...I am also displaying the color like this: style="background: #{currentcolor.toString(16)};

这将无法正常工作。考虑颜色 1092 十进制 (0x000444)。如果 currentcolor 具有该值,则 currentcolor.toString(16) 结果为 444#444 与 CSS 中的 #000444 不同,#444 是颜色 #444444 。同样,颜色 65535 (0x00FFFF) 将导致 #ffff,这是无效的 CSS 颜色(它们必须是三位数或六位数,而不是四位数)。

要正确输出颜色,需要填充字符串的开头:

style="background: #{currentcolor.toString(16).padStart(6, "0")}

关于javascript - 小数值转为 RGB 再转回十进制,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61014109/

相关文章:

javascript - 如何使用复选框来过滤 Angular 智能表中的数据?

javascript - 如果 div 没有内容隐藏其他 div

javascript - 单击切换时增加序列号

python-3.x - 在 Python 中将 RGBA 转换为 RGB

javascript - hsl 到 rgb 的转换。值(value)观太差了。与解决方案进行比较。我做了什么不同的事情?

imagemagick - 如何从 ImageMagick 导出多个文件的详细结果

c++ - 将浮点值转换为 RGB 值

python - 为 matplotlib 图分配随机颜色

javascript - 由于 PHP 重定向,AJAX 请求未完成

javascript - 从表行发布数据,如 json 格式