Methods

DotLottie instances expose the following methods that can be used to control the animation:

Method	Description
`play()`	Begins playback from the current animation position.
`pause()`	Pauses the animation without resetting its position.
`stop()`	Halts playback and returns the animation to its initial frame.
`setSpeed(speed: number)`	Sets the playback speed with the given multiplier.
`setLoop(loop: boolean)`	Configures whether the animation should loop continuously.
`setFrame(frame: number)`	Directly navigates the animation to a specified frame.
`addEventListener(event: string, listener: Function)`	Registers a function to respond to a specific animation event.
`removeEventListener(event: string, listener?: Function)`	Removes a previously registered function from responding to a specific animation event.
`destroy()`	Destroys the renderer instance and unregisters all event listeners. This method should be called when the canvas is removed from the DOM to prevent memory leaks.
`load(config: Config)`	Loads a new configuration or a new animation.
`setMode(mode: string)`	Sets the animation play mode.
`setSegments(startFrame: number, endFrame: number)`	Sets the start and end frame of the animation.
`freeze()`	Freezes the animation by stopping the animation loop.
`unfreeze()`	Unfreezes the animation by resuming the animation loop.
`setBackgroundColor(color: string)`	Sets the background color of the canvas.
`resize()`	This method adjusts the canvas size to match its bounding box dimensions, considering the device’s pixel ratio. This prevents the canvas from appearing blurry on high-resolution screens. Call this method when the window or the canvas element is resized.
`setUseFrameInterpolation(useFrameInterpolation: boolean)`	Sets whether the animation should update on subframes.
`setRenderConfig(renderConfig: RenderConfig)`	Sets the render configuration. check RenderConfig for more details.
`loadAnimation(animationId: string)`	Loads a new animation from the .lottie file, using its ID as specified in the `manifest.json` file of the .lottie file.
`setMarker(marker: string)`	Sets the lottie named marker to play.
`setLayout(layout: Layout)`	Sets the animation layout configuration.
`loadTheme(themeId: string)`	Loads a new theme from the .lottie file, using its ID as specified in the `manifest.json` file of the .lottie file.
`loadThemeData(themeData: string)`	Loads a new theme from the provided theme data.

Static Methods

The DotLottie class exposes the following static methods:

Method	Description
`setWasmUrl(url: string)`	Sets the URL to the renderer.wasm binary.