I've been trying to set <div id="myMarker">
or <div class="myClass">
attributes of google map markers so that I can later apply CSS formatting to them.
I understand that google.maps.Marker
class are extension of the MVCObject
so I use for example:
var marker = new google.maps.Marker(markerOptions);
marker.set('id', 'myMarker');
console.log(marker.get('id');
Everything is good the property id is set as shown in console log. In fact, I don't even have to use .set()
I can write it directly in markerOptions
. Anyways, when I do a div inspection I see that the property I set, in this case id="myMarker"
, does not appear in the marker markup as I intended. In other words, indeed marker
has a property key named id
whose value is myMarker
but it is not the <div id="myMarker">
that I intent to produce for later css formatting.
I have seen that every marker belongs to a element that is usually referenced by the title attribute. I am wondering if there is a more straightforward way to do that (such as a class or an Id).
So I'm stuck in figuring this out since a similar question in SO indicates .set(key,value)
works. Indeed it works for setting a property but this property however is not inserted as html markup for later referencing and formatting. Any lights shed would be most helpful.
Regards.