adrien/daedalus
adrien/daedalus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

use three-hex-tiling for ground material

Browse Source
This commit is contained in:
Adrien MALINGREY 2023-11-18 12:45:50 +01:00
parent cb1b0bb541
commit a0b2aa96ad
2 changed files with 18 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -14,7 +14,7 @@
"imports": { "imports": {
"three": "https://unpkg.com/three@0.158/build/three.module.js?module", "three": "https://unpkg.com/three@0.158/build/three.module.js?module",
"three/addons/": "https://unpkg.com/three@0.158/examples/jsm/", "three/addons/": "https://unpkg.com/three@0.158/examples/jsm/",
"three-hex-tiling": "https://cdn.jsdelivr.net/npm/three-hex-tiling@0.1.1/+esm" "three-hex-tiling": "https://cdn.jsdelivr.net/npm/three-hex-tiling@0.1.1/dist/index.js"
} }
} }
</script> </script>

31
main.js
View File

@ -106,13 +106,7 @@ const wallMaterial = new THREE.MeshStandardMaterial({
normalMap : loader.load('textures/Poly-cobblestone-wall/normal_map_opengl.jpg'), normalMap : loader.load('textures/Poly-cobblestone-wall/normal_map_opengl.jpg'),
aoMap : loader.load('textures/Poly-cobblestone-wall/ao_map.jpg'), aoMap : loader.load('textures/Poly-cobblestone-wall/ao_map.jpg'),
roughnessMap : loader.load('textures/Poly-cobblestone-wall/roughness_map.jpg'), roughnessMap : loader.load('textures/Poly-cobblestone-wall/roughness_map.jpg'),
roughness : 1, roughness : 1
hexTiling: {
patchScale: 2,
useContrastCorrectedBlending: true,
lookupSkipThreshold: 0.01,
textureSampleCoefficientExponent: 8,
}
}) })
const maze = new MazeMesh(mazeWidth, mazeWidth, 1, wallMaterial); const maze = new MazeMesh(mazeWidth, mazeWidth, 1, wallMaterial);
@ -147,42 +141,42 @@ const groundMaterial = new THREE.MeshStandardMaterial({
'textures/angled-blocks-vegetation/albedo.png', 'textures/angled-blocks-vegetation/albedo.png',
texture => { texture => {
texture.wrapS = texture.wrapT = THREE.RepeatWrapping texture.wrapS = texture.wrapT = THREE.RepeatWrapping
texture.repeat.set(mazeWidth / 4, mazeWidth / 4) texture.repeat.set(mazeWidth / 2, mazeWidth / 2)
} }
), ),
aoMap: loader.load( aoMap: loader.load(
'textures/angled-blocks-vegetation/ao.png', 'textures/angled-blocks-vegetation/ao.png',
texture => { texture => {
texture.wrapS = texture.wrapT = THREE.RepeatWrapping texture.wrapS = texture.wrapT = THREE.RepeatWrapping
texture.repeat.set(mazeWidth / 4, mazeWidth / 4) texture.repeat.set(mazeWidth / 2, mazeWidth / 2)
} }
), ),
metalnessMap: loader.load( metalnessMap: loader.load(
'textures/angled-blocks-vegetation/metallic.png', 'textures/angled-blocks-vegetation/metallic.png',
texture => { texture => {
texture.wrapS = texture.wrapT = THREE.RepeatWrapping texture.wrapS = texture.wrapT = THREE.RepeatWrapping
texture.repeat.set(mazeWidth / 4, mazeWidth / 4) texture.repeat.set(mazeWidth / 2, mazeWidth / 2)
} }
), ),
normalMap: loader.load( normalMap: loader.load(
'textures/angled-blocks-vegetation/normal-dx.png', 'textures/angled-blocks-vegetation/normal-dx.png',
texture => { texture => {
texture.wrapS = texture.wrapT = THREE.RepeatWrapping texture.wrapS = texture.wrapT = THREE.RepeatWrapping
texture.repeat.set(mazeWidth / 4, mazeWidth / 4) texture.repeat.set(mazeWidth / 2, mazeWidth / 2)
} }
), ),
roughnessMap: loader.load( roughnessMap: loader.load(
'textures/angled-blocks-vegetation/roughness.png', 'textures/angled-blocks-vegetation/roughness.png',
texture => { texture => {
texture.wrapS = texture.wrapT = THREE.RepeatWrapping texture.wrapS = texture.wrapT = THREE.RepeatWrapping
texture.repeat.set(mazeWidth / 4, mazeWidth / 4) texture.repeat.set(mazeWidth / 2, mazeWidth / 2)
} }
), ),
hexTiling: { hexTiling: {
patchScale: 2, patchScale: 1,
useContrastCorrectedBlending: true, useContrastCorrectedBlending: true,
lookupSkipThreshold: 0.01, lookupSkipThreshold: 0.01,
textureSampleCoefficientExponent: 8, textureSampleCoefficientExponent: 32,
} }
}) })
@ -400,6 +394,7 @@ if (dev) {
raftRotationFolder.add(raft.rotation, "x") raftRotationFolder.add(raft.rotation, "x")
raftRotationFolder.add(raft.rotation, "y") raftRotationFolder.add(raft.rotation, "y")
raftRotationFolder.add(raft.rotation, "z") raftRotationFolder.add(raft.rotation, "z")
raftFolder.close();
const skyFolder = gui.addFolder('Sky'); const skyFolder = gui.addFolder('Sky');
skyFolder.add(parameters, 'elevation', 0, 90, 0.1).onChange(updateSun); skyFolder.add(parameters, 'elevation', 0, 90, 0.1).onChange(updateSun);
@ -503,6 +498,14 @@ if (dev) {
}); });
waveCFolder.open(); waveCFolder.open();
const HexTilingFolder = gui.addFolder('Hex Tiling')
const groundMaterialFolder = HexTilingFolder.addFolder("ground")
groundMaterialFolder.add(groundMaterial.hexTiling, "patchScale", 0, 10)
groundMaterialFolder.add(groundMaterial.hexTiling, "useContrastCorrectedBlending")
groundMaterialFolder.add(groundMaterial.hexTiling, "lookupSkipThreshold", 0, 1)
groundMaterialFolder.add(groundMaterial.hexTiling, "textureSampleCoefficientExponent", 0, 64).name("SampleCoefExp")
HexTilingFolder.close()
} }
// //