gpt4 book ai didi

javascript - 在考虑背景的情况下将 RGBA 转换为 RGB

转载 作者:数据小太阳 更新时间:2023-10-29 05:13:16 26 4
gpt4 key购买 nike

<分区>

Possible Duplicate:
Convert RGBA color to RGB

我正在尝试将 alpha < 1 的 RGBA 颜色转换为考虑到背景颜色的纯 RGB 表示。

使用 this question 提供的算法我设法正确转换为纯 RGB 颜色 - 但仅当 alpha = 0.5 时。

这是我的测试代码:

<!DOCTYPE html>
<html>
<head></head>
<body>
<script type="text/javascript">
// Basic RGB(A) to CSS property value
function _toString(obj) {
var type = 'rgb', out = obj.red + ', ' + obj.green + ', ' + obj.blue;

if (obj.alpha !== undefined) {
type += 'a';
out += ', ' + obj.alpha;
}

return type + '(' + out + ')';
}

// Background color, assume this is always RGB
var bg = {red: 255, green: 51, blue: 0};
// RGBA color
var RGBA = {red: 0, green: 102, blue: 204, alpha: 0};
// Output RGB
var RGB = {red: null, green: null, blue: null};
// Just a cache...
var alpha;

while (RGBA.alpha < 1) {
alpha = 1 - RGBA.alpha;
RGB.red = Math.round((alpha * (RGBA.red / 255) + ((1 - RGBA.alpha) * (bg.red / 255))) * 255);
RGB.green = Math.round((alpha * (RGBA.green / 255) + ((1 - RGBA.alpha) * (bg.green / 255))) * 255);
RGB.blue = Math.round((alpha * (RGBA.blue / 255) + ((1 - RGBA.alpha) * (bg.blue / 255))) * 255);

document.write('<div style="display: block; width: 150px; height: 100px; background-color: ' + _toString(bg) + '">\
<div style="color: #fff; width: 50px; height: 50px; background-color: ' + _toString(RGBA) + '"><small>RGBA<br>' + RGBA.alpha + '</small></div>\
<div style="color: #fff; width: 50px; height: 50px; background-color: ' + _toString(RGB) + '"><small>RGB<br>' + RGBA.alpha + '</small></div>\
</div>');

// Increment alpha
RGBA.alpha += 0.25;
}
</script>
</body>
</html>

当 alpha 为 0.5 时,在 Chrome 和 Firefox 中运行上面的代码会导致 RGBA->RGB 成功,任何偏离 0.5 的结果都会导致不匹配,如果偏差非常小则非常微妙(即当alpha 为 0.55)。

我已经多次重写逻辑,将逻辑完全扩展到最基本的部分,但我都没有成功。

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com