Question

108

Get DOM Element of a marker in Google Maps API 3

rated 0 times [ 110] [ 2] / answers: 1 / hits: 23469 / 15 Years ago, thu, january 14, 2010, 12:00:00

I'm trying to find a way to get the DOM element of a marker. It seems that Google uses different elements for showing a marker and one of handling the event.

I've figured out 2 things so far.
There's a generated variable called fb that holds the DOM element on a marker object, but I think the next time Google updates the API, it will be named something different. So no go.

Second, if one attach a click event to a marker the API send the event DOM element as arguments to what ever function you have specified. While looking through it in Firebug I can't find any relations between the two.

What I'm trying to accomplish is to manipulate the DOM element() and feed it more information then just a 'div' element with a background.

I've done this in version 2 using a name property(undocumented) that generates an id on the div element.

Does anyone have an idea?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

kaileya

Add To Favorites

Follow

Total Points: 168

Total Questions: 95

Total Answers: 72

Location: Antigua and Barbuda

Member since Sat, Apr 24, 2021

3 Years ago

kaileya questions

1 unable to scroll in scrollView

Sun, Aug 16, 20, 00:00, 4 Years ago

1 React | JavaScript : Need to compare two objects

Thu, Jun 25, 20, 00:00, 4 Years ago

1 Override Vue's mixin method

Wed, Jul 3, 19, 00:00, 5 Years ago

1 how to set and get environment variable in node js?

Tue, Apr 23, 19, 00:00, 5 Years ago

1 Create a rounded bar graph with Angular and chartJS

Wed, Feb 20, 19, 00:00, 5 Years ago

View All

answered 15 Years ago blaynetheoi · Accepted Answer

I found a really really bad workaround. One can use the title attribute to pass a id property.

fixMarkerId = function () {

                $('div[title^=mtg_]').each(function (index, elem) {

                    el = $(elem);

                    el.attr('id', el.attr('title'));

                    el.removeAttr('title');

                });

            },

            tryAgainFixMarkerId = function () {

                if ($('div[title^=mtg_]').length) {

                    fixMarkerId();

                } else {

                    setTimeout(function () {

                        tryAgainFixMarkerId();

                    }, 100);

                };

            }



if ($('div[title^=mtg_]').length) {

                fixMarkerId();

            } else {

                setTimeout(function () {

                    tryAgainFixMarkerId();

                }, 100);

            };

I would strongly not recommend this solution for any production environment. But for now I use it so that I can keep developing. But still looking for a better solution.