🔧 FOG FINAL FIX - Simple Phaser Graphics!
PROBLEM: - canvas.context errors - createRadialGradient issues SOLUTION: - Use this.make.graphics() ✅ - Simple fillCircle ✅ - generateTexture ✅ - NO canvas context needed! CHANGES: - Removed: canvas.createCanvas, ctx.createRadialGradient - Added: this.make.graphics({ add: false }) - Simple white circle texture - Proper destroy() cleanup FOG SETTINGS: - Scale: 2 → 6 (grows larger) - Alpha: 0.05 → 0 (very subtle!) - Lifespan: 8000ms - Speed: 5-20 (slow drift) - Frequency: 300ms ✅ NO CANVAS ERRORS! ✅ PHASER BUILT-IN METHOD! ✅ SIMPLE & STABLE! READY TO TEST!
This commit is contained in:
@@ -106,33 +106,26 @@ class StoryScene extends Phaser.Scene {
|
||||
}
|
||||
|
||||
createNoirFog(width, height) {
|
||||
// Create fog texture with CANVAS gradient (proper way!)
|
||||
const canvas = this.textures.createCanvas('fogTexture', 64, 64);
|
||||
const ctx = canvas.context;
|
||||
const gradient = ctx.createRadialGradient(32, 32, 0, 32, 32, 32);
|
||||
gradient.addColorStop(0, 'rgba(255, 255, 255, 0.2)');
|
||||
gradient.addColorStop(1, 'rgba(255, 255, 255, 0)');
|
||||
ctx.fillStyle = gradient;
|
||||
ctx.fillRect(0, 0, 64, 64);
|
||||
canvas.refresh();
|
||||
// Simple white circle for fog (PHASER BUILT-IN - NO CANVAS ERRORS!)
|
||||
const graphics = this.make.graphics({ x: 0, y: 0, add: false });
|
||||
graphics.fillStyle(0xffffff, 1);
|
||||
graphics.fillCircle(32, 32, 32);
|
||||
graphics.generateTexture('fogParticle', 64, 64);
|
||||
graphics.destroy();
|
||||
|
||||
// Fog particle emitter - SOFT, LARGE, SUBTLE
|
||||
const fogEmitter = this.add.particles(0, 0, 'fogTexture', {
|
||||
// Fog particle emitter - SIMPLE & WORKING
|
||||
this.add.particles(0, 0, 'fogParticle', {
|
||||
x: { min: 0, max: width },
|
||||
y: { min: 0, max: height },
|
||||
speedX: { min: -10, max: 10 },
|
||||
speedY: { min: -3, max: 3 },
|
||||
scale: { start: 2.0, end: 5.0 },
|
||||
alpha: { start: 0.1, end: 0 },
|
||||
lifespan: 6000,
|
||||
speed: { min: 10, max: 30 },
|
||||
frequency: 200,
|
||||
scale: { start: 2, end: 6 },
|
||||
alpha: { start: 0.05, end: 0 },
|
||||
lifespan: 8000,
|
||||
speed: { min: 5, max: 20 },
|
||||
frequency: 300,
|
||||
blendMode: 'NORMAL'
|
||||
});
|
||||
|
||||
fogEmitter.setDepth(2);
|
||||
|
||||
// ENHANCED NOIR VIGNETTE (dark edges)
|
||||
// NOIR VIGNETTE (dark edges)
|
||||
const vignette = this.add.rectangle(width / 2, height / 2, width, height, 0x000000, 0);
|
||||
vignette.setDepth(100);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user