The LayerKeyframes
class extends the hubble.gl Keyframes
class and offers support for animating deck.gl layers. In your application, extend from LayerKeyframes
as shown in the ScatterPlotLayerKeyframes
example. Add features
to animate, such as radius
. When designing your scene, keyframe values are required for each feature you define. When constructing anything based on LayerKeyframes
the layerId
property may be provided, which should match the layer id of the deck.gl layer you're animating.
import {LayerKeyframes} from '@hubble.gl/core';
class ScatterPlotLayerKeyframes extends LayerKeyframes {
constructor(props) {
super({...props, features: ['radius', 'opacity']});
}
}
Parameters:
layerId
(string
) - deck.gl layer id.features
(Array<string>
) - An array of features to animate.timings
(Array<number>
) - "N" timestamps for beginning of keyframe.keyframes
(Array<Object>
) - "N" camera objects to transition between.
feature
is a key in this object. The value defines the animation.easings
(Array<() => void
) - "N-1" easing functions between keyframes.See hubble.gl Keyframes and luma.gl Keyframes for more information.