如何从另一种颜色中减去一种颜色答案

【问题标题】：How to subtract a color from another如何从另一种颜色中减去一种颜色
【发布时间】：2012-02-18 19:49:45
【问题描述】：

是否可以从另一种颜色中减去一种颜色？

示例（如果我错了，请纠正我）：

如果我从 white 中减去 red 和 green，我期待结果是蓝色。

var white = 0xFFFFFF,
    red = 0xFF0000,
    result = white - red;
console.log(result); //65535 <-- what is that ? can it be converted to 0x00FFFF ?

[更新]

感谢Rocket's answer，原来我需要function() 才能将我的结果转换为实际颜色。

这是最终的工作示例：

var toColor = function ( d ) {
       var c = Number(d).toString(16);
       return "#" + ( "000000".substr( 0, 6 - c.length ) + c.toUpperCase() );
    },
    white = 0xFFFFFF,
    red = 0xFF0000,
    green = 0x00FF00,
    result = toColor( white - red - green );

console.log( result ); // logs the expected result: "#0000FF"

【问题讨论】：

你是怎么做减法的？您使用的是 RGB 还是 CMYK，您是在混合颜色还是光？
直接减法不起作用。考虑0xCC3366 - 0xDD0011 -> 0xFFFF FFFF FFEF 3355。另一方面，您的 65535 只是 0xFFFF 的十进制（以 10 为底）表示 - 一个简单的基本转换将为您提供 FFFF 用于显示目的，但内部两个数字是相同的
65535 == 0x00FFFF 是 true，您的第一种方法有效，您正在减去 RGB 颜色。
@TJHeuvel，我同意你关于用 CMYK 减色的观点，因为减色系统通常使用青色、品红色和黄色染料光谱过滤器，因为青色、品红色和黄色过滤器是“陷波”过滤器，它允许比窄带红色、绿色或蓝色“带通”滤光片具有更大的光能传输。因此，颜色减法比分段减法和地板更复杂。您对用于航空航天应用的 CMYK 减色系统有何看法？

标签： javascript jquery html canvas html5-canvas

【解决方案1】：

您的 white-red 工作正常，只是 JavaScript 将值表示为以 10 为底的值。您需要将它们转换回基数 16（十六进制）。查看this answer，将值转换回十六进制。

var white = 0xFFFFFF, // Stored as 16777215
    red = 0xFF0000, // Stored as 16711680
    result = white - red; // 16777215 - 16711680 = 65535
console.log(result); // It's stored as base 10, so it prints 65535
var resultHex = result.toString(16); // 'ffff', converted back to hex

【讨论】：

0x001100 - 0x000011 = 0x0010ef;从深绿色中减去深蓝色不应产生亮蓝色。分段减法和地板是减色的唯一正确方法。
@Phrogz：啊，这很有道理。没想到会这样。
@Phrogz，假设复合颜色值由叠加在深蓝色非相干光背景上的相干深绿色激光束组成，我们是否仍然可以使用您出色的分段减法公式过滤掉相干深绿色激光光束来自复合颜色值？谢谢。
从带有激光点的非相干驾驶舱背景中减去相干激光点的颜色值是否属于非线性图像减法问题？

【解决方案2】：

我只是假设您使用的是 RGB，因为还有很多其他混合颜色的方法。您必须将颜色表示为 3* 个不同的部分，即 R G 和 B。

//            R  G  B 
var white = [ 1, 1, 1]; 
var red =   [ 0, 0, 0 ];
var result = [ white[0] - red[0], white[1] - red[1], white[2] - red[2] ;

要减去颜色，您必须减去颜色的每个分量，并可能稍后将其转换回十六进制。

* 您可能希望稍后添加 Alpha

【讨论】：