encodings_pars_fragment: Bug in vector/matrix multiplication

[liamlangli]

three.js/src/renderers/shaders/ShaderChunk/encodings_pars_fragment.glsl.js

Line 82 in 2ad018c

vec3 vRGB = Xp_Y_XYZp.rgb * cLogLuvInverseM;

when i use these lines of code to convert logluv color space data to linear space. render result shows that there is only blue channel preserved. so I read the original page above. The problem is

float3 vRGB = mul(Xp_Y_XYZp, InverseM);

is not the same as

vec3 vRGB = Xp_Y_XYZp.rgb * cLogLuvInverseM;

.
so i move cLogLuvInverseM matrix to the left, problem solved.

[Mugen87]

To clarify your post: According to the reference, LogLuvDecode() was originally written in HLSL like so:

float3 LogLuvDecode(in float4 vLogLuv) {
  float Le = vLogLuv.z * 255 + vLogLuv.w;
  float3 Xp_Y_XYZp;
  Xp_Y_XYZp.y = exp2((Le - 127) / 2);
  Xp_Y_XYZp.z = Xp_Y_XYZp.y / vLogLuv.y;
  Xp_Y_XYZp.x = vLogLuv.x * Xp_Y_XYZp.z;
  float3 vRGB = mul(Xp_Y_XYZp, InverseM);
  return max(vRGB, 0);
}

In three.js, the code looks like this:

vec4 LogLuvToLinear( in vec4 value ) {
  float Le = value.z * 255.0 + value.w;
  vec3 Xp_Y_XYZp;
  Xp_Y_XYZp.y = exp2( ( Le - 127.0 ) / 2.0 );
  Xp_Y_XYZp.z = Xp_Y_XYZp.y / value.y;
  Xp_Y_XYZp.x = value.x * Xp_Y_XYZp.z;
  vec3 vRGB = Xp_Y_XYZp.rgb * cLogLuvInverseM;
  return vec4( max( vRGB, 0.0 ), 1.0 );
}

Since mul() is HLSL syntax, the second last row was changed. According to the following thread, HLSL matrices are row-major, GLSL are column-major. So HLSL like:

float3 n = mul(v, m);

needs to be this in GLSL:

vec3 n = m * v;

So yeah, your bug report is correct! Would you like to do a PR with the fix?

[WestLangley]

@Mugen87

1. LinearToLogLuv() needs to be corrected, too.

2. cLogLuvMand cLogLuvInverseM in the GLSL code are the transposes of the same matrixes in the HLSL code.

3. How did you test this?

[liamlangli]

yep, the same error occurred.

[WestLangley]

I think the most precise explanation is this SO answer: https://stackoverflow.com/a/20438735/1461008.