Update game.js

game.js

@@ -41,41 +41,48 @@ class TankPlayer {
     }
 
     async initialize(scene, loader) {
-        try {
-            const bodyResult = await loader.loadAsync('/models/abramsBody.glb');
-            this.body = bodyResult.scene;
-            this.body.position.copy(this.position);
-            
-            const turretResult = await loader.loadAsync('/models/abramsTurret.glb');
-            this.turret = turretResult.scene;
-            
-            this.turretGroup.position.y = 0.2;
-            this.turretGroup.add(this.turret);
-            this.body.add(this.turretGroup);
-            
-            this.body.traverse((child) => {
-                if (child.isMesh) {
-                    child.castShadow = true;
-                    child.receiveShadow = true;
-                }
-            });
-            
-            this.turret.traverse((child) => {
-                if (child.isMesh) {
-                    child.castShadow = true;
-                    child.receiveShadow = true;
-                }
-            });
+    try {
+        const bodyResult = await loader.loadAsync('/models/abramsBody.glb');
+        this.body = bodyResult.scene;
+        
+        const turretResult = await loader.loadAsync('/models/abramsTurret.glb');
+        this.turret = turretResult.scene;
+        
+        this.turretGroup.position.y = 0.2;
+        this.turretGroup.add(this.turret);
+        this.body.add(this.turretGroup);
+        
+        this.body.traverse((child) => {
+            if (child.isMesh) {
+                child.castShadow = true;
+                child.receiveShadow = true;
+            }
+        });
+        
+        this.turret.traverse((child) => {
+            if (child.isMesh) {
+                child.castShadow = true;
+                child.receiveShadow = true;
+            }
+        });
 
-            scene.add(this.body);
-            this.isLoaded = true;
-            this.updateAmmoDisplay();  // 추가: 초기 탄약 표시
-            
-        } catch (error) {
-            console.error('Error loading tank models:', error);
-            this.isLoaded = false;
+        // 여기서 유효한 스폰 위치를 찾아 적용
+        if (window.gameInstance) {
+            const spawnPos = window.gameInstance.findValidSpawnPosition();
+            this.body.position.copy(spawnPos);
+        } else {
+            this.body.position.copy(this.position);
         }
+
+        scene.add(this.body);
+        this.isLoaded = true;
+        this.updateAmmoDisplay();
+        
+    } catch (error) {
+        console.error('Error loading tank models:', error);
+        this.isLoaded = false;
     }
+}
 
     shoot(scene) {
     if (this.isReloading || this.ammo <= 0) return null;
@@ -488,73 +495,91 @@ class Game {
     }
 
     async initialize() {
-        try {
-            // 안개 효과 제거
-            this.scene.fog = null;
-            this.scene.background = new THREE.Color(0x87CEEB);
-
-            // 주변광 설정 - 더 밝게
-            const ambientLight = new THREE.AmbientLight(0xffffff, 0.6);
-            this.scene.add(ambientLight);
-
-            // 태양광 설정
-            const directionalLight = new THREE.DirectionalLight(0xffffff, 0.8);
-            directionalLight.position.set(100, 100, 50);
-            directionalLight.castShadow = true;
-            directionalLight.shadow.mapSize.width = 1024;
-            directionalLight.shadow.mapSize.height = 1024;
-            this.scene.add(directionalLight);
-
-            // 사막 지형 생성
-            const groundGeometry = new THREE.PlaneGeometry(MAP_SIZE, MAP_SIZE, 100, 100);
-            const groundMaterial = new THREE.MeshStandardMaterial({
-                color: 0xD2B48C,
-                roughness: 0.8,
-                metalness: 0.2
-            });
-
-            const ground = new THREE.Mesh(groundGeometry, groundMaterial);
-            ground.rotation.x = -Math.PI / 2;
-            ground.receiveShadow = true;
+    try {
+        // 안개 효과 제거
+        this.scene.fog = null;
+        this.scene.background = new THREE.Color(0x87CEEB);
+
+        // 주변광 설정 - 더 밝게
+        const ambientLight = new THREE.AmbientLight(0xffffff, 0.6);
+        this.scene.add(ambientLight);
+
+        // 태양광 설정
+        const directionalLight = new THREE.DirectionalLight(0xffffff, 0.8);
+        directionalLight.position.set(100, 100, 50);
+        directionalLight.castShadow = true;
+        directionalLight.shadow.mapSize.width = 1024;
+        directionalLight.shadow.mapSize.height = 1024;
+        this.scene.add(directionalLight);
+
+        // 지형 생성 수정
+        const groundGeometry = new THREE.PlaneGeometry(MAP_SIZE, MAP_SIZE, 100, 100);
+        const groundMaterial = new THREE.MeshStandardMaterial({
+            color: 0xD2B48C,
+            roughness: 0.8,
+            metalness: 0.2
+        });
 
-            // 지형의 기복 추가
-            const vertices = ground.geometry.attributes.position.array;
-            let seed = Math.random() * 100;
-            for (let i = 0; i < vertices.length; i += 3) {
-                vertices[i + 2] = Math.sin(vertices[i] * 0.01) * Math.cos(vertices[i + 1] * 0.01) * 20;
-            }
+        const ground = new THREE.Mesh(groundGeometry, groundMaterial);
+        ground.rotation.x = -Math.PI / 2;
+        ground.receiveShadow = true;
 
-            ground.geometry.attributes.position.needsUpdate = true;
-            ground.geometry.computeVertexNormals();
+        // 더 완만한 지형 생성
+        const vertices = ground.geometry.attributes.position.array;
+        const heightScale = 10; // 높이 스케일 감소
+        const frequency = 0.005; // 주파수 감소로 더 완만한 경사 생성
+        
+        for (let i = 0; i < vertices.length; i += 3) {
+            const x = vertices[i];
+            const y = vertices[i + 1];
+            // Perlin 노이즈와 유사한 효과를 내는 수정된 수식
+            vertices[i + 2] = 
+                (Math.sin(x * frequency) * Math.cos(y * frequency) * heightScale) +
+                (Math.sin(x * frequency * 2) * Math.cos(y * frequency * 2) * heightScale * 0.5);
             
-            this.scene.add(ground);
-
-            await this.addDesertDecorations();
-            await this.tank.initialize(this.scene, this.loader);
-          if (!this.tank.isLoaded) {
-                throw new Error('Tank loading failed');
-            }
+            // 맵 가장자리로 갈수록 높이를 점진적으로 줄임
+            const distanceFromCenter = Math.sqrt(x * x + y * y) / (MAP_SIZE * 0.5);
+            const edgeFactor = Math.max(0, 1 - distanceFromCenter);
+            vertices[i + 2] *= edgeFactor;
+        }
 
-            const tankPosition = this.tank.getPosition();
-            this.camera.position.set(
-                tankPosition.x,
-                tankPosition.y + 15,
-                tankPosition.z - 30
-            );
-            this.camera.lookAt(tankPosition);
-            
-            this.isLoading = false;
-            document.getElementById('loading').style.display = 'none';
-            
-            this.animate();
-            this.spawnEnemies();
-            this.startGameTimer();
+        ground.geometry.attributes.position.needsUpdate = true;
+        ground.geometry.computeVertexNormals();
+        this.ground = ground; // 지형 참조 저장
+        this.scene.add(ground);
 
-        } catch (error) {
-            console.error('Game initialization error:', error);
-            this.handleLoadingError();
+        // 사막 장식 추가
+        await this.addDesertDecorations();
+        
+        // 탱크 초기화
+        await this.tank.initialize(this.scene, this.loader);
+        if (!this.tank.isLoaded) {
+            throw new Error('Tank loading failed');
         }
+
+        // 카메라 초기 위치 설정
+        const tankPosition = this.tank.getPosition();
+        this.camera.position.set(
+            tankPosition.x,
+            tankPosition.y + 15,
+            tankPosition.z - 30
+        );
+        this.camera.lookAt(tankPosition);
+        
+        // 로딩 완료
+        this.isLoading = false;
+        document.getElementById('loading').style.display = 'none';
+        
+        // 게임 시작
+        this.animate();
+        this.spawnEnemies();
+        this.startGameTimer();
+
+    } catch (error) {
+        console.error('Game initialization error:', error);
+        this.handleLoadingError();
     }
+}
 
     // 레이더 업데이트 메서드 추가
     updateRadar() {
@@ -669,6 +694,90 @@ class Game {
        }
    }
 
+   getHeightAtPosition(x, z) {
+        if (!this.ground) return 0;
+
+        // 지형의 정점 데이터
+        const vertices = this.ground.geometry.attributes.position.array;
+        const segmentsX = Math.sqrt(vertices.length / 3) - 1;
+        const segmentsZ = segmentsX;
+
+        // 맵 좌표를 지형 격자 좌표로 변환
+        const gridX = ((x + MAP_SIZE / 2) / MAP_SIZE) * segmentsX;
+        const gridZ = ((z + MAP_SIZE / 2) / MAP_SIZE) * segmentsZ;
+
+        // 가장 가까운 격자점 찾기
+        const x1 = Math.floor(gridX);
+        const z1 = Math.floor(gridZ);
+        const x2 = Math.min(x1 + 1, segmentsX);
+        const z2 = Math.min(z1 + 1, segmentsZ);
+
+        // 격자점들의 높이 가져오기
+        const getHeight = (x, z) => {
+            if (x < 0 || x > segmentsX || z < 0 || z > segmentsZ) return 0;
+            const index = (z * (segmentsX + 1) + x) * 3 + 2;
+            return vertices[index];
+        };
+
+        const h11 = getHeight(x1, z1);
+        const h21 = getHeight(x2, z1);
+        const h12 = getHeight(x1, z2);
+        const h22 = getHeight(x2, z2);
+
+        // 보간으로 정확한 높이 계산
+        const fx = gridX - x1;
+        const fz = gridZ - z1;
+
+        const h1 = h11 * (1 - fx) + h21 * fx;
+        const h2 = h12 * (1 - fx) + h22 * fx;
+
+        return h1 * (1 - fz) + h2 * fz;
+    }
+
+    findValidSpawnPosition() {
+        const margin = 50;
+        let position;
+        let attempts = 0;
+        const maxAttempts = 50;
+        const maxSlope = 0.3; // 최대 허용 경사
+
+        while (attempts < maxAttempts) {
+            position = new THREE.Vector3(
+                (Math.random() - 0.5) * (MAP_SIZE - margin * 2),
+                0,
+                (Math.random() - 0.5) * (MAP_SIZE - margin * 2)
+            );
+
+            // 현재 위치의 높이 가져오기
+            const height = this.getHeightAtPosition(position.x, position.z);
+            position.y = height + TANK_HEIGHT;
+
+            // 주변 지형의 경사 체크
+            const checkPoints = [
+                { x: position.x + 2, z: position.z },
+                { x: position.x - 2, z: position.z },
+                { x: position.x, z: position.z + 2 },
+                { x: position.x, z: position.z - 2 }
+            ];
+
+            const slopes = checkPoints.map(point => {
+                const pointHeight = this.getHeightAtPosition(point.x, point.z);
+                return Math.abs(pointHeight - height) / 2;
+            });
+
+            const maxCurrentSlope = Math.max(...slopes);
+
+            if (maxCurrentSlope <= maxSlope) {
+                return position;
+            }
+
+            attempts++;
+        }
+
+        // 실패 시 기본 위치 반환
+        return new THREE.Vector3(0, TANK_HEIGHT, 0);
+    }
+
    setupEventListeners() {
        document.addEventListener('keydown', (event) => {
            if (this.isLoading || this.isGameOver) return;
@@ -886,37 +995,48 @@ class Game {
    }
 
    getValidEnemySpawnPosition() {
-       const margin = 20;
-       let position;
-       let attempts = 0;
-       const maxAttempts = 50;
-
-       do {
-           position = new THREE.Vector3(
-               (Math.random() - 0.5) * (MAP_SIZE - margin * 2),
-               ENEMY_GROUND_HEIGHT,
-               (Math.random() - 0.5) * (MAP_SIZE - margin * 2)
-           );
+    const margin = 50;
+    let position;
+    let attempts = 0;
+    const maxAttempts = 50;
+    const maxSlope = 0.3;
+
+    do {
+        position = new THREE.Vector3(
+            (Math.random() - 0.5) * (MAP_SIZE - margin * 2),
+            0,
+            (Math.random() - 0.5) * (MAP_SIZE - margin * 2)
+        );
 
-           const distanceToPlayer = position.distanceTo(this.tank.getPosition());
-           if (distanceToPlayer < 100) continue;
+        const height = this.getHeightAtPosition(position.x, position.z);
+        position.y = height + TANK_HEIGHT;
 
-           let collisionFound = false;
-           for (const building of this.buildings) {
-               const buildingBox = new THREE.Box3().setFromObject(building);
-               if (buildingBox.containsPoint(position)) {
-                   collisionFound = true;
-                   break;
-               }
-           }
+        // 주변 경사 체크
+        const checkPoints = [
+            { x: position.x + 2, z: position.z },
+            { x: position.x - 2, z: position.z },
+            { x: position.x, z: position.z + 2 },
+            { x: position.x, z: position.z - 2 }
+        ];
+
+        const slopes = checkPoints.map(point => {
+            const pointHeight = this.getHeightAtPosition(point.x, point.z);
+            return Math.abs(pointHeight - height) / 2;
+        });
 
-           if (!collisionFound) return position;
+        const maxCurrentSlope = Math.max(...slopes);
 
-           attempts++;
-       } while (attempts < maxAttempts);
+        // 플레이어와의 거리 체크
+        const distanceToPlayer = position.distanceTo(this.tank.getPosition());
+        if (distanceToPlayer > 100 && maxCurrentSlope <= maxSlope) {
+            return position;
+        }
 
-       return null;
-   }
+        attempts++;
+    } while (attempts < maxAttempts);
+
+    return null;
+}
   updateParticles() {
        for (let i = this.particles.length - 1; i >= 0; i--) {
            const particle = this.particles[i];