New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Impossible to set render gamma value. #12831

Closed
wdanilo opened this Issue Dec 8, 2017 · 6 comments

Comments

Projects
None yet
3 participants
@wdanilo

wdanilo commented Dec 8, 2017

Description of the problem

Hi!
I'm trying to blend colors in Three.js, however it seems that Three.js does some gamma processing that I cannot disable or change. According to documentation, I should be able to tell:

renderer = new THREE.WebGLRenderer({
    antialias: true
    gammaInput  = false
    gammaOutput = false
    gammaFactor = 1.0
});

However, changing these settings does not affect the final image at all. I've created a sample scene in shadertoy here: https://www.shadertoy.com/view/4tsfzf . Note that the shader converts the colorspace from linear to sRGB explicitely. The results I've got are as follow:

1

Starting from the left to right side:

  • Running the shader in Three.js with explicit conversion from linear to sRGB space
  • Running the shader in Three.js without the conversion
  • Running the shader in shadertoy with explicit conversion from linear to sRGB space (and this is the correct way it should look like).

Changing the parameters described above does not affect how it looks like. It seems to me that it is a bug, because I cannot disable some gamma setting that Three.js is applying. It could be something else, but this is my strongest bet here.

I would be thankful for any help / workaround. I've been reading other threads, like #11110 and tested other options (mentioned to be introduced in the future, but without any success).

Thanks! :)

Three.js version
  • Dev
  • r88
  • ...
Browser
  • All of them
  • Chrome
  • Firefox
  • Internet Explorer
OS
  • All of them
  • Windows
  • macOS
  • Linux
  • Android
  • iOS
@Mugen87

This comment has been minimized.

Show comment
Hide comment
@Mugen87

Mugen87 Dec 8, 2017

Collaborator

You posted code is wrong. It should be:

var renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.gammaFactor = 1.0;
renderer.gammaInput = false; // actually not necessary since the default value is 'false'
renderer.gammaOutput = false; // same here

The gamma* properties are no part of the constructor's parameter object (because they are no WebGL context parameter).

Collaborator

Mugen87 commented Dec 8, 2017

You posted code is wrong. It should be:

var renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.gammaFactor = 1.0;
renderer.gammaInput = false; // actually not necessary since the default value is 'false'
renderer.gammaOutput = false; // same here

The gamma* properties are no part of the constructor's parameter object (because they are no WebGL context parameter).

@Mugen87

This comment has been minimized.

Show comment
Hide comment
@wdanilo

This comment has been minimized.

Show comment
Hide comment
@wdanilo

wdanilo Dec 8, 2017

@Mugen87 thank you for your response! Actually I was trying both versions, but neither changes anything - setting it here or there makes completely no effect and I get exactly the same results (even if I set them to true and the gamma to strange value like 100.0, everything is still the same) :( Sorry for the confusion though!

wdanilo commented Dec 8, 2017

@Mugen87 thank you for your response! Actually I was trying both versions, but neither changes anything - setting it here or there makes completely no effect and I get exactly the same results (even if I set them to true and the gamma to strange value like 100.0, everything is still the same) :( Sorry for the confusion though!

@WestLangley

This comment has been minimized.

Show comment
Hide comment
@WestLangley

WestLangley Dec 8, 2017

Collaborator

renderer.gammaFactor is not intended to be changed.

Changing renderer.gammaInput or renderer.gammaOutput requires setting

material.needsUpdate = true;

Please use the forum if you need further help.

Collaborator

WestLangley commented Dec 8, 2017

renderer.gammaFactor is not intended to be changed.

Changing renderer.gammaInput or renderer.gammaOutput requires setting

material.needsUpdate = true;

Please use the forum if you need further help.

@WestLangley WestLangley closed this Dec 8, 2017

@wdanilo

This comment has been minimized.

Show comment
Hide comment
@wdanilo

wdanilo Dec 8, 2017

@WestLangley Thank you, however I actually think this might still be a bug:

  1. If I'm not able to remove the gamma automatically added by Three.js, I cannot add custom gamma in shaders / post processing. So far, it seems there is no such option, because as you told, we cannot change renderer.gammaOutput.
  2. I'm setting gammaInput and gammaOutput before rendering a single frame, so material.needsUpdate sohuldn't be needed. Even if I set it, still there is no effect.

Doesn't sound it like a bug to you?

wdanilo commented Dec 8, 2017

@WestLangley Thank you, however I actually think this might still be a bug:

  1. If I'm not able to remove the gamma automatically added by Three.js, I cannot add custom gamma in shaders / post processing. So far, it seems there is no such option, because as you told, we cannot change renderer.gammaOutput.
  2. I'm setting gammaInput and gammaOutput before rendering a single frame, so material.needsUpdate sohuldn't be needed. Even if I set it, still there is no effect.

Doesn't sound it like a bug to you?

@WestLangley

This comment has been minimized.

Show comment
Hide comment
@WestLangley

WestLangley Dec 8, 2017

Collaborator

You have not demonstrated a three.js bug. You need to provide code or a live link to do that.

FYI, the docs are incorrect. gammaInput only applies to certain textures -- not input colors. Colors are assumed to be in linear space and are not changed on input.

Collaborator

WestLangley commented Dec 8, 2017

You have not demonstrated a three.js bug. You need to provide code or a live link to do that.

FYI, the docs are incorrect. gammaInput only applies to certain textures -- not input colors. Colors are assumed to be in linear space and are not changed on input.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment