hosuaby / Leaflet.SmoothMarkerBouncing

Smooth animation of marker bouncing for Leaflet.
BSD 2-Clause "Simplified" License
146 stars 28 forks source link

Integrating with Vue2Leaflet gives TypeError: this._bouncingMotion is undefined #54

Closed MuhammadYasirAliKhan786 closed 3 weeks ago

MuhammadYasirAliKhan786 commented 8 months ago

Hello, I'm trying to implement bounce effect on my markers from vue2-leaflet LMarker. Below is the code snippet:

import 'leaflet.smooth_marker_bouncing/dist/bundle.js'
.
.
.

this.map.eachLayer((layer) => {
                if (layer instanceof L.Marker) {
                    if (layer.getLatLng() === e.target.latLng) {
                        logger.debug('Starting Bounce!')
                        layer.bounce()
                    } else {
                        layer.stopBouncing()
                    }
                }
            })

But it produce the following error: TypeError: this._bouncingMotion is undefined Kindly help.

Pedanfer commented 5 months ago

In case it was something similar to my issue, in my TS, Next.js project I had similar errors. I solved it by importing the lib like so in the file where I use it:

import "node_modules/leaflet.smooth_marker_bouncing/dist/bundle";

I also added @ts-ignore in a few lines as recommended by someone else.

hosuaby commented 3 weeks ago

Hello. Since version v3.1.0 plugin is also provided as ESM module. It can be used like that:

import L from 'leaflet';
import SmoothMarkerBouncing from 'leaflet.smooth_marker_bouncing';

SmoothMarkerBouncing(L); // <-- adds plugins code to global L variable

Soon I will publish an example of how it is used with Angular & Typescript.

Pedanfer commented 3 weeks ago

Nice, it wasnt that hard to get it working though. Great library, it looks amazing!