Image texture is looks white

Questions
, ,
1

Hi, I have a problem with an image texture, the texture looks a little whitish after rendering compared to the original image, I think the problem is due to material color(default: 0xffffff)
Is there any change I should make it to look original as possible

Original image

earth_atmos_2048
earth_atmos_20482048×1024 496 KB

Rendered Image
post

var texture = new THREE.TextureLoader().load( “img-path”);
var bodyMat = new THREE.MeshBasicMaterial( {
map: texture,
transparent:true,
side:THREE.DoubleSide,
} );

this is the code I’m using, is there any change I need to apply to make it look as in the original image

2 Likes
2

Can you please show how you configure your renderer?

3

renderer = new THREE.WebGLRenderer({canvas: overlay3d, antialias: true,
preserveDrawingBuffer: true });
renderer.sortObjects = true;
renderer.physicallyCorrectLights = true;
renderer.outputEncoding = THREE.sRGBEncoding;

4

If you do this, it’s necessary to define your color texture as sRGB, too:

texture.encoding = THREE.sRGBEncoding;

Otherwise your color space workflow is not completely defined.

7 Likes
5

Thank you so much it is working now.

1 Like
6

Hey,
I’m facing same issue here but currently this method is showing deprecated so can you please tell me another way of doing same?

7

The line from the solution should look like so now:

texture.colorSpace = THREE.SRGBColorSpace;
11 Likes
8

it worked. thanks

9

This works…Thanks!