Encontré una biblioteca de generación de procedimientos para threejs
Enlace: https://github.com/IceCreamYou/THREE.Terrain
Estoy siguiendo el tutorial proporcionado en el archivo ReadMe.md pero sigo recibiendo este error: No se pueden leer las propiedades de undefined (leyendo 'Linear')
Estoy usando tres js a través de npm y también descargué esto a través de npm. Así es como se ve mi código
índice.html
import * as THREE from 'three'; import "three.terrain.js" const scene = new THREE.Scene(); const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 ); const renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); /*const geometry = new THREE.BoxGeometry(1, 1, 1); const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 }); const cube = new THREE.Mesh(geometry, material); scene.add(cube); */ var xS = 63, yS = 63; terrainScene = THREE.Terrain({ easing: THREE.Terrain.Linear, frequency: 2.5, heightmap: THREE.Terrain.DiamondSquare, material: new THREE.MeshBasicMaterial({color: 0x5566aa}), maxHeight: 100, minHeight: -100, steps: 1, xSegments: xS, xSize: 1024, ySegments: yS, ySize: 1024, }); // Assuming you already have your global scene, add the terrain to it scene.add(terrainScene); camera.position.z = 5; function animate() { requestAnimationFrame(animate); cube.rotation.x += 0.01; cube.rotation.y += 0.01; renderer.render(scene, camera); } animate();índice.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Game</title> <link rel="stylesheet" href="index.css" /> </head> <body> <script src="dist/main.js"></script> <script src="https://cdn.jsdelivr.net/npm/three/build/three.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/three.terrain.js/build/THREE.Terrain.min.js"></script> </body> </html>Cualquier ayuda sería muy apreciada
¡Gracias de antemano!
Creo que usaste Terrain inside Terrain, por lo que es el error porque Terrain inside Terrain no está definido, por lo que dice No se pueden leer las propiedades de undefined