JSPM

angular-three-postprocessing

4.0.0-next.76
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 112
  • Score
    100M100P100Q70535F
  • License MIT

Postprocessing for Angular Three

Package Exports

    Readme

    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