como/three-offshore-vibe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修正夜空

Browse Source
This commit is contained in:
como
2026-03-27 16:20:05 +08:00
parent 36965a7dc3
commit 4a9410802d
2 changed files with 39 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/OceanScene.js
View File

@@ -619,7 +619,7 @@ export class OceanScene {
}
`,
transparent: true,
depthTest: false,
depthTest: true,
depthWrite: false,
blending: THREE.AdditiveBlending,
vertexColors: true
@@ -638,11 +638,11 @@ export class OceanScene {
color: 0xe9f0ff,
transparent: true,
depthWrite: false,
depthTest: false,
blending: THREE.AdditiveBlending
depthTest: true,
blending: THREE.NormalBlending
});
this.moonSprite = new THREE.Sprite(moonMaterial);
this.moonSprite.scale.setScalar(980);
this.moonSprite.scale.setScalar(490);
this.scene.add(this.moonSprite);
const galaxyTexture = this.createGalaxyTexture();
@@ -652,7 +652,7 @@ export class OceanScene {
transparent: true,
opacity: 0,
depthWrite: false,
depthTest: false,
depthTest: true,
blending: THREE.AdditiveBlending
});
this.galaxyBand = new THREE.Sprite(galaxyMaterial);
@@ -665,25 +665,39 @@ export class OceanScene {
canvas.width = 256;
canvas.height = 256;
const ctx = canvas.getContext('2d');
const glow = ctx.createRadialGradient(128, 128, 0, 128, 128, 128);
glow.addColorStop(0, 'rgba(255,255,255,0.98)');
glow.addColorStop(0.2, 'rgba(244,248,255,0.98)');
glow.addColorStop(0.34, 'rgba(228,238,255,0.96)');
glow.addColorStop(0.58, 'rgba(175,205,255,0.42)');
glow.addColorStop(0.82, 'rgba(126,164,235,0.12)');
glow.addColorStop(1, 'rgba(120,150,220,0)');
ctx.fillStyle = glow;
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.save();
ctx.translate(128, 128);
ctx.beginPath();
ctx.arc(-8, 0, 76, 0, Math.PI * 2);
ctx.closePath();
ctx.clip();
const moonFill = ctx.createLinearGradient(-76, -48, 26, 44);
moonFill.addColorStop(0, 'rgba(250,252,255,1)');
moonFill.addColorStop(0.55, 'rgba(232,239,250,1)');
moonFill.addColorStop(1, 'rgba(198,212,232,1)');
ctx.fillStyle = moonFill;
ctx.beginPath();
ctx.arc(-8, 0, 76, 0, Math.PI * 2);
ctx.fill();
ctx.globalCompositeOperation = 'destination-out';
ctx.beginPath();
ctx.arc(42, 0, 76, 0, Math.PI * 2);
ctx.fill();
ctx.globalCompositeOperation = 'multiply';
ctx.fillStyle = 'rgba(150,170,210,0.18)';
ctx.fillStyle = 'rgba(138,152,182,0.12)';
ctx.beginPath();
ctx.arc(152, 104, 34, 0, Math.PI * 2);
ctx.arc(-40, -18, 7, 0, Math.PI * 2);
ctx.fill();
ctx.beginPath();
ctx.arc(98, 152, 20, 0, Math.PI * 2);
ctx.arc(-34, 20, 9, 0, Math.PI * 2);
ctx.fill();
ctx.globalCompositeOperation = 'source-over';
ctx.restore();
const texture = new THREE.CanvasTexture(canvas);
texture.colorSpace = THREE.SRGBColorSpace;
@@ -1945,6 +1959,7 @@ export class OceanScene {
const nightFactor = THREE.MathUtils.clamp((12.0 - this.params.elevation) / 16.0, 0.0, 1.0);
const weatherFade = this.params.rainEnabled ? 0.08 : this.params.snowEnabled ? 0.55 : 1.0;
const opacity = (this.params.starEnabled ? this.params.starIntensity : 0.0) * nightFactor * weatherFade;
const isBlackNight = this.params.elevation < -1.0;
this.starField.visible = opacity > 0.001;
this.starField.material.uniforms.intensity.value = opacity;
@@ -1957,10 +1972,10 @@ export class OceanScene {
THREE.MathUtils.lerp(260, 520, nightFactor),
Math.sin(moonAngle) * moonDistance
);
const moonGlow = THREE.MathUtils.clamp((nightFactor - 0.18) / 0.72, 0, 1);
this.moonSprite.visible = moonGlow > 0.01;
const moonGlow = isBlackNight ? THREE.MathUtils.clamp((nightFactor - 0.18) / 0.72, 0, 1) : 0.0;
this.moonSprite.visible = isBlackNight && moonGlow > 0.01;
this.moonSprite.material.opacity = THREE.MathUtils.lerp(0.0, 2.4, moonGlow);
const moonScale = THREE.MathUtils.lerp(820, 1460, moonGlow);
const moonScale = THREE.MathUtils.lerp(410, 730, moonGlow);
this.moonSprite.scale.setScalar(moonScale);
}
@@ -1973,9 +1988,9 @@ export class OceanScene {
Math.sin(angle) * radius
);
this.galaxyBand.material.rotation = THREE.MathUtils.degToRad(-24);
const galaxyFade = THREE.MathUtils.clamp((opacity - 0.18) / 1.1, 0, 1) * weatherFade;
const galaxyFade = isBlackNight ? THREE.MathUtils.clamp((opacity - 0.18) / 1.1, 0, 1) * weatherFade : 0.0;
this.galaxyBand.material.opacity = galaxyFade * 0.92;
this.galaxyBand.visible = this.galaxyBand.material.opacity > 0.01;
this.galaxyBand.visible = isBlackNight && this.galaxyBand.material.opacity > 0.01;
}
}

2
src/weatherPresets.js
View File

@@ -26,7 +26,7 @@ export const DEFAULT_SCENE_PARAMS = {
snowSpeed: 0.85,
starEnabled: true,
starIntensity: 0.7,
lightningEnabled: false,
lightningEnabled: true,
lightningIntensity: 0.75,
mieCoefficient: 0.005,
mieDirectionalG: 0.8