ReferenceCustom effectsInterface
CreateEffectOptions
Everything that defines a custom effect.
extends BaseEffectOptions
Options for createEffect(), with everything that defines a custom effect: where it happens, when particles are emitted, how they start out and how they change.
Properties
Section titled “Properties”behaviorsoptionalBehavior[]How particles change over their lifetime, run in this order on every simulation step. See Behavior.
canvasoptionalHTMLCanvasElementA canvas to draw onto. If none is provided, party.js draws onto a fullscreen canvas it shares between all effects, and removes it once no effect is using it anymore. If provided, positions are measured from the canvas’ top-left corner: the built-in effects measure their target relative to it, and a custom effect’s origin is given in its coordinates (see measureTarget()).
lightoptionalLive<Vec3>default{ x: 0, y: 0, z: 1 }The direction that light comes from, in particle space. The vector’s length does not matter. This value is read every frame. The default value points straight from the viewer.
lightingoptionalLightingFn|nulldefaultcreateLighting()How a particle’s color changes with the angle between its face and the light. See createLighting(). Pass
nullto disable lighting.originLive<Vec2>The point particle positions are measured from. Read again on every frame, so a function can make the whole effect follow something or, for example, react to the window size. Without a
canvas, party.js draws onto its own fullscreen canvas, and the origin is in page coordinates, i.e. pixels from the top-left of the document, with +y pointing down. With acanvas, it’s in that canvas’ coordinate system instead, i.e. pixels from its top-left corner. To start the effect at an element, use measureTarget(), which also handles the conversion to a canvas’ coordinates.particleInitParticleInitHow new particles start out.
reducedMotionoptionalReducedMotionWhat the effect does when the user has asked their system for reduced motion. A skipped effect draws nothing, and the
finishedpromise on the effect handle resolves as “completed” aftercreateEffect()returns, unless you stop the effect immediately. See ReducedMotion for more information. Without this option, the default set with setDefaultReducedMotion() is used, which is"skip"unless you changed it.rngoptionalRngA random number generator to use instead of the built-in one. This takes precedence over
seed.scheduleEmissionScheduleWhen and how many particles are emitted.
seedoptionalnumberA seed for the effect’s random number generator. The same seed with the same options produces the same visuals each time. Without one, a random seed is generated and every run of the effect looks different.