6

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.

davidlee
  • 5,611
  • 17
  • 56
  • 82

3 Answers3

5

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

skarE
  • 5,880
  • 2
  • 23
  • 23
  • The link is broken. Fortunately the repo has been copied to GitHub: https://github.com/nmccready/google-maps-utility-library-v3-infobox – Akseli Palén Nov 07 '16 at 16:22
3

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);
});
robd
  • 9,646
  • 5
  • 40
  • 59
Alex Angelico
  • 3,710
  • 8
  • 31
  • 49
0

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?.

Community
  • 1
  • 1
Budgie
  • 2,279
  • 1
  • 21
  • 26