Сенките на земята изглеждат неточни и кални

Направих проект Threejs, където динамично създавам основа от perlin шум. Ето кода:

createGround() {

const resolutionX = 100
const resolutionY = 100
const actualResolutionX = resolutionX + 1 // plane adds one vertex
const actualResolutionY = resolutionY + 1


const geometryPlane = new THREE.PlaneGeometry(this.sizeX, this.sizeY, resolutionX, resolutionY)

const noise = perlin.generatePerlinNoise(actualResolutionX, actualResolutionY)

let i = 0

for (let x = 0; x < actualResolutionX; x++) {
  for (let y = 0; y < actualResolutionY; y++) {
    let h = noise[i]
    }

    geometryPlane.vertices[i].z = h
    i++
  }
}

geometryPlane.verticesNeedUpdate = true
geometryPlane.computeFaceNormals()

const materialPlane = new THREE.MeshStandardMaterial({
  color: 0xffff00,
  side: THREE.FrontSide,
  roughness: 1,
  metallness: 0,
})

const ground = new THREE.Mesh(geometryPlane, materialPlane)
geometryPlane.computeVertexNormals()
ground.name = GROUND_NAME
ground.receiveShadow = true
scene.add(ground)

}

Доволен съм от геометрията, която се генерира, но проблемът е, че сенките изглеждат наистина неточни.

въведете описание на изображението тук

Ето моят код за светлината:

const light = new THREE.DirectionalLight(
  'white',
  1,

)
light.shadow.mapSize.width = 512 * 12 // default is 512. doesnt do anything
light.shadow.mapSize.height = 512 * 12 // default is 512
light.castShadow = true
light.position.set(100, 100, 100)
scene.add(light)

light.shadowCameraVisible = true

Въпросът ми е как мога да направя сянката на терена да изглежда по-точна и дефинирана и да покажа геометрията на терена?

Останалата част от кода можете да намерите тук: https://github.com/Waltari10/workwork


person Waltari    schedule 12.10.2018    source източник


Отговори (1)


Тази сянка не изглежда толкова зле предвид факта, че не сте настроили никакви светлини :).

Предполагам, че това изобразяване работи с някакво осветление по подразбиране или осветление, което сте добавили, преди да мислите за сенките.

Опитайте да добавите малко насочена светлина, симулираща посоката и цвета на слънцето и вижте дали това помага, или ни кажете повече за вашата настройка на осветлението.

Ако вече имате някакви светлини, които изобразяват картата на сенките, проверете нейната разделителна способност, може да се наложи да я увеличите.

person kolenda    schedule 15.10.2018
comment
Добавих кода, който използвам за светлината. Как да направя картата на сенките по-голяма? - person Waltari; 16.10.2018
comment
@Waltari Относно картата на сенките, вижте документацията: threejs. org/docs/index.html#api/en/lights/shadows/ - person prisoner849; 17.10.2018
comment
Добавих light.shadow.mapSize.width = 512 * 12, но това не изглежда да променя нищо, независимо дали го задам на 5 или 5000. - person Waltari; 25.10.2018
comment
Също така е добавено публичното git repo към въпроса за целия код. - person Waltari; 25.10.2018