Refactor OceanLOD and constants for improved LOD management and grid size adjustments
This commit is contained in:
13
index.html
13
index.html
@@ -452,19 +452,10 @@
|
|||||||
displacement += gerstnerWave(pos, time * 2.5, vec2(0.7, -0.7), 0.03 * heightMod, 0.18, t, b);
|
displacement += gerstnerWave(pos, time * 2.5, vec2(0.7, -0.7), 0.03 * heightMod, 0.18, t, b);
|
||||||
tangent += t - vec3(1.0, 0.0, 0.0); binormal += b - vec3(0.0, 0.0, 1.0);
|
tangent += t - vec3(1.0, 0.0, 0.0); binormal += b - vec3(0.0, 0.0, 1.0);
|
||||||
|
|
||||||
displacement += gerstnerWave(pos, time * 2.8, vec2(-0.8, 0.6), 0.025 * heightMod, 0.15, t, b);
|
displacement += gerstnerWave(pos, time * 3.0, vec2(-0.8, 0.6), 0.025 * heightMod, 0.12, t, b);
|
||||||
tangent += t - vec3(1.0, 0.0, 0.0); binormal += b - vec3(0.0, 0.0, 1.0);
|
tangent += t - vec3(1.0, 0.0, 0.0); binormal += b - vec3(0.0, 0.0, 1.0);
|
||||||
|
|
||||||
displacement += gerstnerWave(pos, time * 3.0, vec2(0.5, 0.85), 0.02 * heightMod, 0.12, t, b);
|
displacement += gerstnerWave(pos, time * 3.5, vec2(0.5, -0.9), 0.02 * heightMod, 0.08, t, b);
|
||||||
tangent += t - vec3(1.0, 0.0, 0.0); binormal += b - vec3(0.0, 0.0, 1.0);
|
|
||||||
|
|
||||||
displacement += gerstnerWave(pos, time * 3.2, vec2(-0.95, -0.3), 0.018 * heightMod, 0.10, t, b);
|
|
||||||
tangent += t - vec3(1.0, 0.0, 0.0); binormal += b - vec3(0.0, 0.0, 1.0);
|
|
||||||
|
|
||||||
displacement += gerstnerWave(pos, time * 3.5, vec2(0.3, -0.95), 0.015 * heightMod, 0.08, t, b);
|
|
||||||
tangent += t - vec3(1.0, 0.0, 0.0); binormal += b - vec3(0.0, 0.0, 1.0);
|
|
||||||
|
|
||||||
displacement += gerstnerWave(pos, time * 3.8, vec2(-0.6, 0.8), 0.012 * heightMod, 0.06, t, b);
|
|
||||||
tangent += t - vec3(1.0, 0.0, 0.0); binormal += b - vec3(0.0, 0.0, 1.0);
|
tangent += t - vec3(1.0, 0.0, 0.0); binormal += b - vec3(0.0, 0.0, 1.0);
|
||||||
|
|
||||||
// Store wave height for fragment shader
|
// Store wave height for fragment shader
|
||||||
|
|||||||
@@ -9,13 +9,14 @@ export class OceanLOD {
|
|||||||
centerY: number;
|
centerY: number;
|
||||||
size: number;
|
size: number;
|
||||||
lodLevel: number;
|
lodLevel: number;
|
||||||
|
visible: boolean;
|
||||||
}> = [];
|
}> = [];
|
||||||
|
|
||||||
private readonly LOD_LEVELS = [
|
private readonly LOD_LEVELS = [
|
||||||
{ distance: 2.0, gridSize: 256 }, // Closest - highest detail
|
{ distance: 2.0, gridSize: 128 }, // Closest - highest detail
|
||||||
{ distance: 5.0, gridSize: 128 }, // Medium distance
|
{ distance: 5.0, gridSize: 64 }, // Medium distance
|
||||||
{ distance: 10.0, gridSize: 64 }, // Far distance
|
{ distance: 10.0, gridSize: 32 }, // Far distance
|
||||||
{ distance: 20.0, gridSize: 32 }, // Very far - lowest detail
|
{ distance: 20.0, gridSize: 16 }, // Very far - lowest detail
|
||||||
];
|
];
|
||||||
|
|
||||||
private readonly PATCH_SIZE = 2.0; // World size of each patch
|
private readonly PATCH_SIZE = 2.0; // World size of each patch
|
||||||
@@ -47,7 +48,8 @@ export class OceanLOD {
|
|||||||
centerX,
|
centerX,
|
||||||
centerY,
|
centerY,
|
||||||
size: this.PATCH_SIZE,
|
size: this.PATCH_SIZE,
|
||||||
lodLevel: 3
|
lodLevel: 3,
|
||||||
|
visible: true
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -77,14 +79,17 @@ export class OceanLOD {
|
|||||||
const dotProduct = vec3.dot(viewDir, toPatchDir);
|
const dotProduct = vec3.dot(viewDir, toPatchDir);
|
||||||
|
|
||||||
// Determine if patch is in front of camera and within view cone
|
// Determine if patch is in front of camera and within view cone
|
||||||
const isInFront = dotProduct > -0.2; // Slightly behind is ok for edge cases
|
const isInFront = dotProduct > -0.3; // Slightly behind is ok for edge cases
|
||||||
const isInViewCone = dotProduct > this.VIEW_CONE_COS;
|
const isInViewCone = dotProduct > this.VIEW_CONE_COS;
|
||||||
|
|
||||||
|
// Frustum culling - don't draw patches behind camera
|
||||||
|
patch.visible = isInFront;
|
||||||
|
|
||||||
// Calculate LOD level
|
// Calculate LOD level
|
||||||
let newLodLevel = 3; // Default to lowest detail
|
let newLodLevel = 3; // Default to lowest detail
|
||||||
|
|
||||||
if (!isInFront) {
|
if (!isInFront) {
|
||||||
// Behind camera - always lowest detail
|
// Behind camera - skip (will not be drawn)
|
||||||
newLodLevel = 3;
|
newLodLevel = 3;
|
||||||
} else if (isInViewCone) {
|
} else if (isInViewCone) {
|
||||||
// In view cone - use distance-based LOD
|
// In view cone - use distance-based LOD
|
||||||
@@ -125,8 +130,10 @@ export class OceanLOD {
|
|||||||
}
|
}
|
||||||
|
|
||||||
draw(gl: WebGL2RenderingContext, wireframe: boolean = false): void {
|
draw(gl: WebGL2RenderingContext, wireframe: boolean = false): void {
|
||||||
for (const { grid } of this.grids) {
|
for (const patch of this.grids) {
|
||||||
grid.draw(gl, wireframe);
|
if (patch.visible) {
|
||||||
|
patch.grid.draw(gl, wireframe);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
// Configuration Constants
|
// Configuration Constants
|
||||||
export const GRID_SIZE = 256;
|
export const GRID_SIZE = 128;
|
||||||
export const NOISE_TEXTURE_WIDTH = 1024;
|
export const NOISE_TEXTURE_WIDTH = 1024;
|
||||||
export const NOISE_TEXTURE_HEIGHT = 1024;
|
export const NOISE_TEXTURE_HEIGHT = 1024;
|
||||||
export const CANVAS_WIDTH = 800;
|
export const CANVAS_WIDTH = 800;
|
||||||
|
|||||||
Reference in New Issue
Block a user