зделана мной

[c17213496-pixel]

<title>3D Игра</title> <style> body { margin: 0; overflow: hidden; } #info { position: absolute; top: 10px; left: 10px; color: white; font-family: Arial; } </style>

WASD - движение | Мышка - смотреть

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/controls/PointerLockControls.js"></script> <script> let scene = new THREE.Scene(); scene.background = new THREE.Color(0x87ceeb); let camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000); let renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); // Свет let light = new THREE.HemisphereLight(0xffffff, 0x444444); scene.add(light); // Пол let floorGeometry = new THREE.PlaneGeometry(200, 200); let floorMaterial = new THREE.MeshStandardMaterial({ color: 0x228B22 }); let floor = new THREE.Mesh(floorGeometry, floorMaterial); floor.rotation.x = -Math.PI / 2; scene.add(floor); // Кубы for (let i = 0; i < 20; i++) { let boxGeometry = new THREE.BoxGeometry(); let boxMaterial = new THREE.MeshStandardMaterial({ color: 0xff0000 }); let cube = new THREE.Mesh(boxGeometry, boxMaterial); cube.position.set( Math.random() * 100 - 50, 0.5, Math.random() * 100 - 50 ); scene.add(cube); } // Управление мышкой let controls = new THREE.PointerLockControls(camera, document.body); document.body.addEventListener("click", () => { controls.lock(); }); scene.add(controls.getObject()); camera.position.y = 2; let moveForward = false; let moveBackward = false; let moveLeft = false; let moveRight = false; document.addEventListener("keydown", (event) => { switch(event.code) { case "KeyW": moveForward = true; break; case "KeyS": moveBackward = true; break; case "KeyA": moveLeft = true; break; case "KeyD": moveRight = true; break; } }); document.addEventListener("keyup", (event) => { switch(event.code) { case "KeyW": moveForward = false; break; case "KeyS": moveBackward = false; break; case "KeyA": moveLeft = false; break; case "KeyD": moveRight = false; break; } }); function animate() { requestAnimationFrame(animate); let speed = 0.1; if (moveForward) controls.moveForward(speed); if (moveBackward) controls.moveForward(-speed); if (moveLeft) controls.moveRight(-speed); if (moveRight) controls.moveRight(speed); renderer.render(scene, camera); } animate(); </script>