leaflet-image-animator

0.1.0 • Public • Published

leaflet-image-animator NPM version NPM Downloads

Simple plugin to animate mutiple images as keyframes.

Screenshot

install

npm install leaflet-image-animator --save

use and options

See demo for detailed example.

const imageAnimatorLayer = L.imageAnimatorLayer({
  frames: [
    {
      time: '<time string>',
      img: '<base64 image string>'
    }
  ],
  startFrameIndex: 0,
  bbox: [
    '142.020371',
    '-28.589904',
    '155.372974',
    '-7.4053889999999996'
  ],
 
  // optional - supply the name of an existing custom pane 
  // default overlayPane (leaflet v0.7 compatible)
  paneName: 'myCustomPane' 
    
  // optional callbacks when layer is added/removed from map
  onAdd: function(){}
  onRemove: function(){}
});

public methods

method params description
isActive check if the layer is currently active on the map
getFrameTimes Get an ascending array of all ISO times (can then be used to call setFrameTime)
setFrameTime time: {string} display the image at the given frame time
getFrameTime Get the current frame time (-1 if not set)
setFrameIndex index: {Number} display the particles at the given frame index
getFrameIndex Get the current frame index (-1 if not set)

Example data

Data shown for the Great Barrier Reef has been derived from CSIRO's eReefs products

Package Sidebar

Install

npm i leaflet-image-animator

Weekly Downloads

2

Version

0.1.0

License

none

Unpacked Size

30 kB

Total Files

8

Last publish

Collaborators

  • danwild