angular-three-postprocessing
TypeScript icon, indicating that this package has built-in type declarations

3.7.2 • Public • Published

angular-three-postprocessing

This is the main entry point for post-processing effects in Angular Three. It provides a way to apply various visual effects to your 3D scene after it has been rendered. This library relies on maath, three-stdlib, and postprocessing as dependencies.

Installation

npm install angular-three-postprocessing three-stdlib maath postprocessing
# yarn add angular-three-postprocessing three-stdlib maath postprocessing
# pnpm add angular-three-postprocessing three-stdlib maath postprocessing

NgtpEffectComposer

This is a wrapper component that manages and applies post-processing effects to your scene. It takes content children of effects and applies them in the order they are provided.

Object Inputs (NgtpEffectComposerOptions)

Property Description Default Value
enabled Whether the effect composer is enabled. true
depthBuffer Whether to use a depth buffer. undefined
enableNormalPass Whether to enable the normal pass. This is only used for SSGI currently. undefined
stencilBuffer Whether to use a stencil buffer. undefined
autoClear Whether to automatically clear the output buffer before rendering. true
resolutionScale A scaling factor for the resolution of the effect composer. undefined
multisampling The number of samples to use for multisample anti-aliasing (MSAA). Set to 0 to disable MSAA. 8
frameBufferType The data type to use for the frame buffer. HalfFloatType
renderPriority The render priority of the effect composer. 1
camera The camera to use for rendering. If not provided, the default camera from the store will be used. undefined
scene The scene to render. If not provided, the default scene from the store will be used. undefined
<ngtp-effect-composer [options]="{ multisampling: 0, frameBufferType: FloatType, enableNormalPass: true }">
	<ngtp-bloom />
</ngtp-effect-composer>
```

NgtpEffectComposerApi

This is an interface that provides access to the underlying NgtpEffectComposer instance, as well as the camera and scene being used. It also includes references to the NormalPass and DepthDownsamplingPass if they are enabled

export interface NgtpEffectComposerApi {
	composer: EffectComposer;
	camera: Camera;
	scene: Scene;
	normalPass: NormalPass | null;
	downSamplingPass: DepthDownsamplingPass | null;
	resolutionScale?: number;
}

To retrieve the NgtpEffectComposerApi for components within <ngtp-effect-composer />, you can use the injectEffectComposerApi function.

Effects

TBD

Package Sidebar

Install

npm i angular-three-postprocessing

Weekly Downloads

1,141

Version

3.7.2

License

MIT

Unpacked Size

279 kB

Total Files

42

Last publish

Collaborators

  • nartc