Class GIF

loopCount

duration

• get duration(): number

  The animation's duration (in ms)

  Returns number

frames

• get frames(): Frame[]

  The animation's frames: an array that changes the animation when it's changed (e.g. push(), splice(), or setting an index), and can be replaced as a whole

  Returns Frame[]
• set frames(frames: Frame[]): void

  Replaces the animation's frames

  Parameters

  • frames: Frame[]

  Returns void

height

• get height(): number

  The animation's height

  Returns number

width

• get width(): number

  The animation's width

  Returns number

StaticapngEncoder

• apngEncoder(
      width: number,
      height: number,
      options?: APNGAnimationEncoderOptions,
  ): AnimationEncoder

  An encoder that makes an APNG a frame at a time, like Animation.encodeAPNG (the same file), keeping the frames only compressed (the pixel format depends on all of them): await encoder.add(frame) for each frame, then await encoder.finish()

  Parameters

  • width: number

    The canvas width
  • height: number

    The canvas height
  • options: APNGAnimationEncoderOptions = {}

    See APNGAnimationEncoderOptions

  Returns AnimationEncoder

encodeAPNG

• encodeAPNG(options?: APNGEncodeOptions): Promise<Uint8Array<ArrayBufferLike>>

  Encodes the animation as APNG (animated PNG, lossless and with full alpha). Viewers without APNG support show the first frame. Each frame is stored as the area that changed since the frame before, identical frames are merged (unless the optimize option is false): the file shows exactly the same animation, but doesn't necessarily decode to the same frames

  Parameters

  • Optionaloptions: APNGEncodeOptions

    See APNGEncodeOptions

  Returns Promise<Uint8Array<ArrayBufferLike>>
• encodeAPNG(compression?: number): Promise<Uint8Array<ArrayBufferLike>>

  Encodes the animation as APNG (animated PNG, lossless and with full alpha). Viewers without APNG support show the first frame. Each frame is stored as the area that changed since the frame before, identical frames are merged (unless the optimize option is false): the file shows exactly the same animation, but doesn't necessarily decode to the same frames

  Parameters

  • Optionalcompression: number

    The zlib compression level (0-9), higher is smaller but slower

  Returns Promise<Uint8Array<ArrayBufferLike>>

encodeGIF

• encodeGIF(options?: GIFEncodeOptions): Promise<Uint8Array<ArrayBufferLike>>

  Encodes the animation as GIF. Like all encoders, it stores each frame as the area that changed since the frame before and merges identical frames (unless the optimize option is false), so the file decodes to what the animation shows, but not necessarily to the same frames. Semi-transparent pixels become opaque or transparent after the frames are composited

  Parameters

  • Optionaloptions: GIFEncodeOptions

    See GIFEncodeOptions

  Returns Promise<Uint8Array<ArrayBufferLike>>
• encodeGIF(quality?: number): Promise<Uint8Array<ArrayBufferLike>>

  Encodes the animation as GIF. Like all encoders, it stores each frame as the area that changed since the frame before and merges identical frames (unless the optimize option is false), so the file decodes to what the animation shows, but not necessarily to the same frames. Semi-transparent pixels become opaque or transparent after the frames are composited

  Parameters

  • Optionalquality: number

    1-100, scales the palette size from 8 colors (1) to 256 colors (90 and above)

  Returns Promise<Uint8Array<ArrayBufferLike>>

encodeWebP

• encodeWebP(
      options?: WebPAnimationEncodeOptions,
  ): Promise<Uint8Array<ArrayBufferLike>>

  Encodes the animation as animated WebP, lossless or (with a quality) lossy. Each frame is stored as the area that changed since the frame before, identical frames are merged (unless the optimize option is false): the file shows the same animation, but doesn't necessarily decode to the same frames

  Parameters

  • options: WebPAnimationEncodeOptions = {}

    See WebPAnimationEncodeOptions

  Returns Promise<Uint8Array<ArrayBufferLike>>

StaticgifEncoder

• gifEncoder(
      width: number,
      height: number,
      options?: GIFAnimationEncoderOptions,
  ): AnimationEncoder

  An encoder that makes an animated GIF a frame at a time, like Animation.encodeGIF (the same file), without keeping the frames in memory: await encoder.add(frame) for each frame, then await encoder.finish()

  Parameters

  • width: number

    The canvas width
  • height: number

    The canvas height
  • options: GIFAnimationEncoderOptions = {}

    See GIFAnimationEncoderOptions

  Returns AnimationEncoder

resize

• resize(width: number, height: number, options?: ResizeOptions): this

  Resizes the animation to the given dimensions, scaling every frame and its offsets proportionally. Use Image.RESIZE_AUTO as either width or height to automatically preserve the aspect ratio.

  Parameters

  • width: number
  • height: number
  • Optionaloptions: ResizeOptions

  Returns this
• resize(width: number, height: number, mode?: ResizeMode): this

  Resizes the animation to the given dimensions, scaling every frame and its offsets proportionally. Use Image.RESIZE_AUTO as either width or height to automatically preserve the aspect ratio.

  Parameters

  • width: number
  • height: number
  • Optionalmode: ResizeMode

  Returns this

slice

• slice(start?: number, end?: number): this

  Returns a new animation of the same class containing a range of this one's frames (same semantics as Array.prototype.slice)

  Parameters

  • Optionalstart: number
  • Optionalend: number

  Returns this

  Deprecated

  Use new Animation(animation.frames.slice(start, end), animation.loopCount): in 4.0 animations aren't arrays anymore

StaticwebpEncoder

• webpEncoder(
      width: number,
      height: number,
      options?: WebPAnimationEncoderOptions,
  ): AnimationEncoder

  An encoder that makes an animated WebP a frame at a time, like Animation.encodeWebP (the same file), without keeping the frames in memory: await encoder.add(frame) for each frame (a Frame, or an image with { duration }), then await encoder.finish() for the file

  Parameters

  • width: number

    The canvas width
  • height: number

    The canvas height
  • options: WebPAnimationEncoderOptions = {}

    See WebPAnimationEncoderOptions

  Returns AnimationEncoder