---
title: "Animatable | JavaScript maps SDK"
description: "Documentation for MapTiler SDK"
---

> For AI agents: a documentation index is available at [/llms.txt](https://docs.maptiler.com/llms.txt). Markdown versions of all pages are available by appending .md to any URL.

# Interface Animatable

interface Animatable {  
    [animate](#animate-1)(  
        keyframes: [Keyframe](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Keyframe/)\[\] | [PropertyIndexedKeyframes](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.PropertyIndexedKeyframes/) | null,  
        options?: number | [KeyframeAnimationOptions](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.KeyframeAnimationOptions/),  
    ): [Animation](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Animation/);  
    [getAnimations](#getanimations-1)(options?: [GetAnimationsOptions](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.GetAnimationsOptions/)): [Animation](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Animation/)\[\];  
}

#### Hierarchy ([View Summary](https://docs.maptiler.com/sdk-js/api-reference/hierarchy/#Externals.Animatable))

-   Animatable
    -   [Element](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Element/)

##### Index

### Methods[](#methods)

[animate](#animate) [getAnimations](#getanimations)

## Methods[](#methods-1)

### animate[](#animate)

-   animate(  
        keyframes: [Keyframe](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Keyframe/)\[\] | [PropertyIndexedKeyframes](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.PropertyIndexedKeyframes/) | null,  
        options?: number | [KeyframeAnimationOptions](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.KeyframeAnimationOptions/),  
    ): [Animation](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Animation/)[](#animate-1)
    
    [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/animate)
    
    #### Parameters
    
    -   keyframes: [Keyframe](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Keyframe/)\[\] | [PropertyIndexedKeyframes](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.PropertyIndexedKeyframes/) | null
    -   `Optional`options: number | [KeyframeAnimationOptions](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.KeyframeAnimationOptions/)
    
    #### Returns [Animation](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Animation/)
    

### getAnimations[](#getanimations)

-   getAnimations(options?: [GetAnimationsOptions](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.GetAnimationsOptions/)): [Animation](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Animation/)\[\][](#getanimations-1)
    
    [MDN Reference](https://developer.mozilla.org/docs/Web/API/Element/getAnimations)
    
    #### Parameters
    
    -   `Optional`options: [GetAnimationsOptions](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.GetAnimationsOptions/)
    
    #### Returns [Animation](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.Animation/)\[\]