Google Maps API v3: How to remove an Event Listener?

Question

How do I remove the 'bounds_changed' Event listener in Google Maps API v3?

google.maps.event.removeListener(_???_);

I think I found what you were looking for. It was the 3rd event function in API docs. — Maiku Mori, Oct 09 '09 at 14:50
I feel your pain. You would think this documentation would be on http://code.google.com/apis/maps/documentation/javascript/events.html but its not. Grrrr — Drew LeSueur, Sep 23 '10 at 06:57

Maiku Mori · Accepted Answer · 2009-10-09T14:46:19.873

156

Usually you can find answers to such questions in Google Maps API documentation.

As Andrew said, addListener returns a handle which you can use later to remove the listener. That's because a single event can have many listeners and to remove them you must save a reference to each of attached listeners.

There's also a function which removes all of the listeners at the same time:

clearListeners(instance:Object, eventName:string);
//In your case:
google.maps.event.clearListeners(map, 'bounds_changed');

Here's the Google Maps API reference where you can read about it.

edited Oct 09 '09 at 14:46

answered Oct 09 '09 at 14:41

Maiku Mori

7,419
2
40
52

2

So will this remove ONLY the bounds_changed event? – mp_ Oct 09 '09 at 14:54
What's the pro/con of using this method vs Andrews method? – mp_ Oct 09 '09 at 14:55
This removes all listeners from the bounds_changed event. While Andrew's method removes one. If you don't want to store the handle somewhere and you only have to worry about 1 listener for given event then this is the way to go. – Maiku Mori Oct 09 '09 at 14:57
As I said events can have many listeners, but it seems like you're just using 1 in your code. If you'll understand that concept you will see the different uses for both functions. Also see the link I provided, it has nice explanations for both of those functions. – Maiku Mori Oct 09 '09 at 14:59
This is currently throwing errors. Looks like it's been depreciated. – Kelderic Oct 13 '15 at 17:00
@AndyM As far as I can tell it's not deprecated. If you follow the documentation link then you can still find the function. Even if you go to experimental (next version) documentation the function and event is still there. You may want to check your code again. – Maiku Mori Oct 13 '15 at 17:05
2

Figured it out. `google.maps.event.clearListeners(map, 'idle')` works. But `map.clearListeners('idle')` doesn't. That syntax works for everything else in the API (`.addListener`, etc). Odd. – Kelderic Oct 13 '15 at 17:05

score 98 · Answer 2 · answered Oct 09 '09 at 14:37

98

addListener returns a handle which you can later pass to removeListener:

var listenerHandle = google.maps.event.addListener(map, 'bounds_changed', function() {

google.maps.event.removeListener(listenerHandle);

answered Oct 09 '09 at 14:37

Andrew

6,231
2
29
37

So there is no longer static variables for the listeners? – mp_ Oct 09 '09 at 14:42
Listeners need to be removed one by one. You can't unbind them all ala jQuery. I know because I thought the same and got confused on this point too. I eventually worked it out and the pseudo-code above roughly illustrates how I did it. – Andrew Oct 09 '09 at 14:49
Look at my answer, I think it's a better solution. – Maiku Mori Oct 09 '09 at 14:49
1

Drat! Yours *is* a better answer. – Andrew Oct 09 '09 at 14:53
Where is this documented? I can't seem to find it. – Drew LeSueur Sep 23 '10 at 06:59
4

Better answer for me, that's removing only the event listener we created and it does not impact the other scripts – Matthieu Napoli May 24 '12 at 18:13
2

Better answer for two reasons. Only, removes actual listener. Also, doesn't have the snarky "You can find it in the API docs' comment. – keithhackbarth Sep 11 '12 at 22:18

score 20 · Answer 3 · edited Apr 15 '14 at 09:13

20

This seems to work in the current release.

var listenerHandle = google.maps.event.addListener(map, 'bounds_changed', function() {
    // Handler code.
});
listenerHandle.remove();

edited Apr 15 '14 at 09:13

Maiku Mori

7,419
2
40
52

answered Jun 14 '13 at 19:04

ether6

351
3
10

And the nice thing about this approach is that `listenerHandler.remove()` works for data-layer listeners as well -- i.e. `google.maps.data.addListener` -- since there is NO `google.maps.data.removeListener` method defined. – Christopher King Nov 18 '15 at 19:39
Yeap.... https://developers.google.com/maps/documentation/javascript/events#removing – Pedro Ferreira Oct 15 '16 at 04:15

score 0 · Answer 4 · answered Jul 06 '15 at 13:25

0

If you couldnt hold the listener object somehow you could remove listener(s) directly as google.maps.event.clearListeners(objectListened, 'event');

Ex: google.maps.event.clearListeners(map, 'bounds_changed');

answered Jul 06 '15 at 13:25

Tarık Özgün Güner

1,051
10
10

Google Maps API v3: How to remove an Event Listener?

4 Answers4

Linked