Add numbering label to google map marker

Question

May I know how to add numbering label to google map marker using google map api? Just add label, not trying to change the icon. Thank you.

Answer 1

I think a better solution is to use a infoWindow. Something like this:

$(document).ready(function () {
    var golfoMexico = new google.maps.LatLng(20.61536,-87.078975);
    var settings = {
        zoom: 18,
        center: golfoMexico,
        mapTypeControl: true,
        mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
        navigationControl: true,
        navigationControlOptions: {style: google.maps.NavigationControlStyle.ZOOM_PAN},
        mapTypeId: google.maps.MapTypeId.HYBRID
    };

    var map = new google.maps.Map(document.getElementById("map_canvas"), settings);
    var pos1= new google.maps.LatLng(20.61536,-87.078975);
     var infowindow = new google.maps.InfoWindow({
           content: "Casa Stavola F8 II"
         });
    var companyMarker = new google.maps.Marker({ position: pos1, map: map,title:"Casa Stavola F8 II", visible:true});
    infowindow.open(map,companyMarker);
});

Answer 2

If you don't want to use custom icons for each marker then I suggest looking into creating a label class with the OverlayView and then binding the position to the marker.

Or you could look at using something like: http://github.com/nmccready/google-maps-utility-library-v3-infobox

Answer 3

Check out the example at http://www.geocodezip.com/basic8j.asp?filename=example_number.xml (for V2 of the API). There was also a question here about something similar - How can I create numbered map markers in Google Maps V3?.