如何实现多个颜色叠加效果?

如何给参数定义两个颜色?又如何让他们相互叠加(如同在PS里的混合层叠)。例如:
color1:0,255,255
color2:255,255,0
multiplied:0,255,0
请输入图片描述

原问题:How to multiply two colors in javascript?

阅读 8.7k
1 个回答

David:基于一个非常简单的叠加公式即可实现,如下所示,这是一个JavaScript针对RGB的代码,Demo:http://jsfiddle.net/unrLC/

function multiply(rgb1, rgb2) {
    var result = [],
        i = 0;
    for( ; i < rgb1.length; i++ ) {
        result.push(Math.floor(rgb1[i] * rgb2[i] / 255));
    }
    return result;
}

请输入图片描述


Samuel:这里是颜色叠加公式,还包含其他混合模式的公式,地址:http://en.wikipedia.org/wiki/Blend_modes#Multiply

Formula: Result Color = (Top Color) * (Bottom Color) /255

你可以在JavaScript中轻松的实现:

var newRed = red1 * red2 / 255;
var newGreen = green1 * green2 / 255;
var newBlue = blue1 * blue2 / 255;

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
logo
Stack Overflow 翻译
子站问答
访问
宣传栏