Why i have shadow acne with MeshBasicMaterial and no lights in my scene?

Questions
,
1

in my scene i have NO LIGHTS.
i use MeshBasicMaterial for my object.
i have only 1 plane with texture (stripes black and white). this is close screenshot:

chrome_JB00YXMgIQ
chrome_JB00YXMgIQ1521×745 3.21 KB

when camera is close, it looks normal. but
if i move my camera little bit far away it causes “shadow acnes”:

chrome_9bsJrjoKLk
chrome_9bsJrjoKLk744×378 3.62 KB

the acnes are more visible if the angle of my camera is more acute:

chrome_qrGyXocuyf

i tried to find an answer to that, but everybody is talking about something related to lights. but i DONT HAVE LIGHTS IN MY SCENE, so i cant manipulate bais of the light.

without the texture, it works fine. so the problem must be related to the texture…

2

This is Moiré pattern.

You can reduce it by setting a good .minFilter and .anisotropy for the texture, as well as setting .antialias for in renderer’s parameters.

1 Like
3

Oops. Forgot to post an example:

Reducing Moire pattern (but not eliminating it completely)

image

1 Like
4

yeah i thought it must be related to the pixels, i played with texture.minFilter with all options:

// THREE.NearestFilter
// THREE.NearestMipmapNearestFilter
// THREE.NearestMipmapLinearFilter
// THREE.LinearFilter
// THREE.LinearMipmapNearestFilter
// THREE.LinearMipmapLinearFilter

i see the distorted shapes changes with different options, but still it remains

also my settings is like this
texture.anisotropy = renderer.getMaxAnisotropy();
renderer = new THREE.WebGLRenderer( { antialias: true } );

the examples above are with these settings.

5

It looks like no minification filter and anisotropy are applied at all. What are the dimensions of your texture? Make sure they are powers of 2; for example, 1024x512.

6

976x859.

i changed it to 1024x512, well still the same problem. i guess there is no 100% correction to that? btw thanks for the right term “Moiré pattern”. you taught me something new today lol.

7

This is caused by the nature of raster graphics. I don’t know how to eliminate it (besides crafting special textures or using some advances sampling). Even in my example above there is Moire pattern, although much less than in your images. I still think your image can be improved. Would it be possible for you to prepare online editable example?

1 Like
8

if i use different texture (not stripes black and white), its hard to see the distortion, and its works fine for my purpose. thanks for your help man. i will upload example if the problem comes back. for now im good :slight_smile: