Skip to content

A plugin for Leaflet to have a bounce animation when adding a Marker to a map

License

Notifications You must be signed in to change notification settings

maximeh/leaflet.bouncemarker

Repository files navigation

BounceMarker for Leaflet

This little plugin for Leaflet will make a Marker bounce when you add it on a map on whenever you want it to.

Watch the demo.

Version

Things may break in master, so please don't use this in production. Tags should be preferred for used in production.

Last stable: v1.2.3

Documentation

Functions

bounce(options, endCallback)

Make a marker bounce at anytime you wish.

stopBounce()void

Stop the animation and place the marker at its destination.

onAdd(map)

Add a Marker to {map} and optionaly make it bounce.

onRemove(map)

Stop any animation running and remove the Marker from {map}.

Typedefs

bounceOnAddOptions : Object

User defined options

bounceOnAddCallbackvoid

Callback run at the end of the whole animation.

bounce(options, endCallback)

Make a marker bounce at anytime you wish.

Kind: global function

Param Type Description
options bounceOnAddOptions user defined options
endCallback bounceOnAddCallback run at end of animation

Example

marker = new L.Marker([48.85, 2.35], {bounceOnAdd: true}).addTo(map);
marker.on('click', function () {
    marker.bounce({duration: 500, height: 100});
});

stopBounce() ⇒ void

Stop the animation and place the marker at its destination.

Kind: global function

onAdd(map)

Add a Marker to {map} and optionaly make it bounce.

Kind: global function

Param Type Description
map L.Map Leaflet map to add the marker to

Example

L.marker([48.85, 2.35],
  {
    bounceOnAdd: true,
  }).addTo(map);

onRemove(map)

Stop any animation running and remove the Marker from {map}.

Kind: global function

Param Type Description
map L.Map Leaflet map to add the marker to

bounceOnAddOptions : Object

User defined options

Kind: global typedef
Properties

Name Type Default Description
[bounceOnAddOptions.duration] Number 1000 Animation's duration in ms.
[bounceOnAddOptions.height] Number topY Height (in pixel) from which the marker is "dropped".
[bounceOnAddOptions.loop] Number 1 Number of times the animation should play. -1 is a special value for infinite loop.

bounceOnAddCallback ⇒ void

Callback run at the end of the whole animation.

Kind: global typedef