added god rays

This commit is contained in:
2025-07-29 00:15:57 +01:00
parent 51427294da
commit 1508b3cb29
20 changed files with 2436 additions and 3 deletions

View File

@@ -0,0 +1,16 @@
import { type Disposable, Pass, type Resizable } from 'postprocessing';
import * as THREE from 'three';
import type { GodraysBlurParams } from './index';
export declare const GODRAYS_BLUR_RESOLUTION_SCALE = 1;
declare class BilateralFilterMaterial extends THREE.ShaderMaterial {
constructor(input: THREE.Texture);
}
export declare class BilateralFilterPass extends Pass implements Resizable, Disposable {
material: BilateralFilterMaterial;
constructor(input: THREE.Texture);
setSize(width: number, height: number): void;
render(renderer: THREE.WebGLRenderer, _inputBuffer: THREE.WebGLRenderTarget, outputBuffer: THREE.WebGLRenderTarget, _deltaTime?: number | undefined, _stencilTest?: boolean | undefined): void;
updateUniforms(params: GodraysBlurParams): void;
dispose(): void;
}
export {};

View File

@@ -0,0 +1,28 @@
import { Pass, type Resizable } from 'postprocessing';
import * as THREE from 'three';
import type { PerspectiveCamera } from 'three';
import type { GodraysPassParams } from './index';
interface GodraysCompositorMaterialProps {
godrays: THREE.Texture;
edgeStrength: number;
edgeRadius: number;
color: THREE.Color;
camera: THREE.PerspectiveCamera;
gammaCorrection: boolean;
}
export declare class GodraysCompositorMaterial extends THREE.ShaderMaterial implements Resizable {
constructor({ godrays, edgeStrength, edgeRadius, color, camera, gammaCorrection, }: GodraysCompositorMaterialProps);
updateUniforms(edgeStrength: number, edgeRadius: number, color: THREE.Color, gammaCorrection: boolean, near: number, far: number): void;
setSize(width: number, height: number): void;
}
export declare class GodraysCompositorPass extends Pass {
sceneCamera: PerspectiveCamera;
private depthCopyRenderTexture;
private depthTextureCopyPass;
constructor(props: GodraysCompositorMaterialProps);
updateUniforms(params: GodraysPassParams): void;
render(renderer: THREE.WebGLRenderer, inputBuffer: THREE.WebGLRenderTarget, outputBuffer: THREE.WebGLRenderTarget | null, _deltaTime?: number | undefined, _stencilTest?: boolean | undefined): void;
setDepthTexture(depthTexture: THREE.Texture, depthPacking?: THREE.DepthPackingStrategies | undefined): void;
setSize(width: number, height: number): void;
}
export {};

View File

@@ -0,0 +1,21 @@
import { Pass, type Resizable } from 'postprocessing';
import * as THREE from 'three';
import type { GodraysPassParams } from './index';
export declare const GODRAYS_RESOLUTION_SCALE: number;
export interface GodraysIllumPassProps {
light: THREE.PointLight | THREE.DirectionalLight;
camera: THREE.PerspectiveCamera;
}
export declare class GodraysIllumPass extends Pass implements Resizable {
private material;
private shadowMapSet;
private props;
private lastParams;
private lightWorldPos;
constructor(props: GodraysIllumPassProps, params: GodraysPassParams);
setSize(width: number, height: number): void;
render(renderer: THREE.WebGLRenderer, _inputBuffer: THREE.WebGLRenderTarget, outputBuffer: THREE.WebGLRenderTarget, _deltaTime?: number | undefined, _stencilTest?: boolean | undefined): void;
setDepthTexture(depthTexture: THREE.Texture, depthPacking?: THREE.DepthPackingStrategies | undefined): void;
private updateLightParams;
updateUniforms({ light, camera }: GodraysIllumPassProps, params: GodraysPassParams): void;
}

View File

@@ -0,0 +1,117 @@
import { type Disposable, KernelSize, Pass } from 'postprocessing';
import * as THREE from 'three';
export interface GodraysBlurParams {
/**
* The sigma factor used by the bilateral filter for the blur. Higher values result in more blur, but
* can cause artifacts.
*
* Default: 0.1
*/
variance: number;
/**
* The kernel size for the bilateral filter. Higher values blur more neighboring pixels and can smooth over higher amounts of noise,
* but require exponentially more texture samples and thus can be slower.
*
* Default: `KernelSize.SMALL`
*/
kernelSize: KernelSize;
}
export interface GodraysPassParams {
/**
* The rate of accumulation for the godrays. Higher values roughly equate to more humid air/denser fog.
*
* Default: 1 / 128
*/
density: number;
/**
* The maximum density of the godrays. Limits the maximum brightness of the godrays.
*
* Default: 0.5
*/
maxDensity: number;
/**
* Default: 2
*/
edgeStrength: number;
/**
* Edge radius used for depth-aware upsampling of the godrays. Higher values can yield better edge quality at the cost of performance, as
* each level higher of this requires two additional texture samples.
*
* Default: 2
*/
edgeRadius: number;
/**
* Higher values decrease the accumulation of godrays the further away they are from the light source.
*
* Default: 2
*/
distanceAttenuation: number;
/**
* The color of the godrays.
*
* Default: `new THREE.Color(0xffffff)`
*/
color: THREE.Color;
/**
* The number of raymarching steps to take per pixel. Higher values increase the quality of the godrays at the cost of performance.
*
* Default: 60
*/
raymarchSteps: number;
/**
* Whether or not to apply a bilateral blur to the godrays. This can be used to reduce artifacts that can occur when using a low number of raymarching steps.
*
* It costs a bit of extra performance, but can allow for a lower number of raymarching steps to be used with similar quality.
*
* Default: false
*/
blur: boolean | Partial<GodraysBlurParams>;
gammaCorrection: boolean;
}
export declare class GodraysPass extends Pass implements Disposable {
private props;
private depthTexture;
private depthPacking;
private lastParams;
private godraysRenderTarget;
private illumPass;
private enableBlurPass;
private blurPass;
private blurRenderTarget;
private compositorPass;
/**
* Constructs a new GodraysPass. Casts godrays from a point light source. Add to your scene's composer like this:
*
* ```ts
* import { EffectComposer, RenderPass } from 'postprocessing';
* import { GodraysPass } from 'three-good-godrays';
*
* const composer = new EffectComposer(renderer, { frameBufferType: THREE.HalfFloatType });
* const renderPass = new RenderPass(scene, camera);
* renderPass.renderToScreen = false;
* composer.addPass(renderPass);
*
* const godraysPass = new GodraysPass(pointLight, camera);
* godraysPass.renderToScreen = true;
* composer.addPass(godraysPass);
*
* function animate() {
* composer.render(scene, camera);
* }
* ```
*
* @param light The light source to use for the godrays.
* @param camera The camera used to render the scene.
* @param partialParams The parameters to use for the godrays effect. Will use default values for any parameters not specified.
*/
constructor(light: THREE.PointLight | THREE.DirectionalLight, camera: THREE.PerspectiveCamera, partialParams?: Partial<GodraysPassParams>);
/**
* Updates the parameters used for the godrays effect. Will use default values for any parameters not specified.
*/
setParams(partialParams: Partial<GodraysPassParams>): void;
private maybeInitBlur;
render(renderer: THREE.WebGLRenderer, inputBuffer: THREE.WebGLRenderTarget, outputBuffer: THREE.WebGLRenderTarget, _deltaTime?: number | undefined, _stencilTest?: boolean | undefined): void;
setDepthTexture(depthTexture: THREE.Texture, depthPacking?: THREE.DepthPackingStrategies | undefined): void;
setSize(width: number, height: number): void;
dispose(): void;
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long