hello, i try to make a simple puzzle game. but i have some problem.
i make some box and set color same to background color.
but it is not matched on result.
please see this screenshot.
and here is code.
i just create two light(directional, hemisphere) and no ambient light.
as i know MeshBasicMaterial not affect by light, so why show different color when i set a same color?
when i set a color to white(0xffffff) or black(0x000000) it works what i want.
i’m using r110 version.
best regards.
Mugen87
December 10, 2019, 12:50pm
2
I’m afraid I’m not able to reproduce with the following live example:
https://jsfiddle.net/73zmbogj/
Can you please try to update the live example in order to demonstrate the issue?
first of all, i found what cause problem.
if WebGLRenderer’s gammaOutput is true, it show a color problem.
if gammaOutput are false, it works fine what i want.
what i understand after read document, if gammaOutput is true, all type of materials are affect the texture and color.
so if I want the background color and the color of the object to be the same, should the gammaOutput option be true?
in my previous practice, GLTF models are too dark when gammaOutput are false.
https://jsfiddle.net/r9kc5Lvq/4/
Mugen87
December 10, 2019, 4:36pm
4
The problem is that scene.background
is only affected by WebGLRenderer.gammaOutput
if it is a texture. This is a known issue and tracked by https://github.com/mrdoob/three.js/issues/11337 . The goal is to provide an easier-to use color management in three.js
. For now, you can fix the issue like so:
scene.background.convertLinearToGamma( 2 );
This will perform the missing color space conversion.
https://jsfiddle.net/j6w8xcvg/
2 Likes