Tôi đang cố gắng thay đổi màu sắc của hình ảnh bằng cách sử dụng trình đổ bóng mảnh GLSL. Tôi muốn đạt được một cái gì đó tương tự như lớp Hue / Saturation Điều chỉnh của Photoshop.
Trong hình ảnh sau đây bạn có thể thấy những gì tôi đã có cho đến nay. Tôi muốn thay đổi màu sắc của hình vuông màu xanh lá cây để nó trông giống hình vuông màu đỏ ở bên phải, nhưng với shader này, tôi nhận được một nửa hình vuông màu đỏ nửa hồng (hình vuông ở giữa).
Những gì tôi đang làm trong trình đổ bóng mảnh là chuyển đổi màu của kết cấu thành HSV, sau đó tôi thêm màu HSV mà tôi nhận được từ trình tạo bóng đỉnh cho nó và tôi chuyển đổi màu trở lại RGB.
Tôi đang làm gì sai?
Mảnh vỡ mảnh:
precision mediump float;
varying vec2 vTextureCoord;
varying vec3 vHSV;
uniform sampler2D sTexture;
vec3 convertRGBtoHSV(vec3 rgbColor) {
float r = rgbColor[0];
float g = rgbColor[1];
float b = rgbColor[2];
float colorMax = max(max(r,g), b);
float colorMin = min(min(r,g), b);
float delta = colorMax - colorMin;
float h = 0.0;
float s = 0.0;
float v = colorMax;
vec3 hsv = vec3(0.0);
if (colorMax != 0.0) {
s = (colorMax - colorMin ) / colorMax;
}
if (delta != 0.0) {
if (r == colorMax) {
h = (g - b) / delta;
} else if (g == colorMax) {
h = 2.0 + (b - r) / delta;
} else {
h = 4.0 + (r - g) / delta;
}
h *= 60.0;
if (h < 0.0) {
h += 360.0;
}
}
hsv[0] = h;
hsv[1] = s;
hsv[2] = v;
return hsv;
}
vec3 convertHSVtoRGB(vec3 hsvColor) {
float h = hsvColor.x;
float s = hsvColor.y;
float v = hsvColor.z;
if (s == 0.0) {
return vec3(v, v, v);
}
if (h == 360.0) {
h = 0.0;
}
int hi = int(h);
float f = h - float(hi);
float p = v * (1.0 - s);
float q = v * (1.0 - (s * f));
float t = v * (1.0 - (s * (1.0 - f)));
vec3 rgb;
if (hi == 0) {
rgb = vec3(v, t, p);
} else if (hi == 1) {
rgb = vec3(q, v, p);
} else if (hi == 2) {
rgb = vec3(p, v, t);
} if(hi == 3) {
rgb = vec3(p, q, v);
} else if (hi == 4) {
rgb = vec3(t, p, v);
} else {
rgb = vec3(v, p, q);
}
return rgb;
}
void main() {
vec4 textureColor = texture2D(sTexture, vTextureCoord);
vec3 fragRGB = textureColor.rgb;
vec3 fragHSV = convertRGBtoHSV(fragRGB);
fragHSV += vHSV;
fragHSV.x = mod(fragHSV.x, 360.0);
fragHSV.y = mod(fragHSV.y, 1.0);
fragHSV.z = mod(fragHSV.z, 1.0);
fragRGB = convertHSVtoRGB(fragHSV);
gl_FragColor = vec4(convertHSVtoRGB(fragHSV), textureColor.w);
}EDIT:
Sử dụng các chức năng Sam Hocevar cung cấp trong câu trả lời của mình, vấn đề với các dải màu hồng đã được giải quyết, nhưng tôi chỉ có thể đạt được một nửa phổ màu. Tôi có thể thay đổi màu sắc từ màu đỏ sang màu xanh lá cây, nhưng tôi không thể thay đổi màu sắc thành màu xanh hoặc màu hồng.
Trong shader mảnh, tôi đang làm điều này:
void main() {
vec4 textureColor = texture2D(sTexture, vTextureCoord);
vec3 fragRGB = textureColor.rgb;
vec3 fragHSV = rgb2hsv(fragRGB);
float h = vHSV.x / 360.0;
fragHSV.x *= h;
fragHSV.yz *= vHSV.yz;
fragHSV.x = mod(fragHSV.x, 1.0);
fragHSV.y = mod(fragHSV.y, 1.0);
fragHSV.z = mod(fragHSV.z, 1.0);
fragRGB = hsv2rgb(fragHSV);
gl_FragColor = vec4(hsv2rgb(fragHSV), textureColor.w);
}
int hi = int(h/60.0); float f = h/60.0 - float(hi);thay vìint hi = int(h); float f = h - float(hi);? Mặc dù vậy, không biết đó là nguyên nhân.