title: Google Map markers - add a custom icon with a unique label for each marker
body: <p>I have implemented a google map with multiple markers but what i am failing to do is how to add a unique label for each marker i.e. Each marker needs have a letter:<br />e.g.<br />
  Marker 1 needs to display 'A'<br />
  Marker 2 needs to display 'B'<br />
  Marker 3 needs to display 'C'<br />
  Marker 4 needs to display 'D'<br />
  ...<br />
  an example of what i am trying to achieve is: <a href="http://www.athenos.com/locator/" rel="nofollow">http://www.athenos.com/locator/</a> --- enter 11205 in the zip search<br /><br />
  here is a portion of my map code - my <em>init</em> and <em>add_marker</em> methods:<br /></p>
  
  <pre><code>init : function() {
  
      var self = this;
  
      // set map property
      var map = new google.maps.Map(self.dom_element, self.options);
      self.map = map;
  
      // set some other shit
      new google.maps.Size(95, 77),
      new google.maps.Point(0,0),
      new google.maps.Point(47, 76);
  
      // creating new bounds 
      var bounds = new google.maps.LatLngBounds();
  
      // for loop to iterate through locations
      for (var i = 0; i &lt; self.locations.length; i++) {
  
          // extend the bounds
          bounds.extend(self.locations[i].latlng);
  
          // add the marker
          self.add_marker(self.locations[i].latlng, i);
      }
  
      // centers the map based on the existing map markers
      self.map.fitBounds(bounds);
  },
  
  add_marker : function(latlng, marker_index) {
      var self = this;
      var marker = new google.maps.Marker({
          position: latlng,
          map: self.map,
          icon: self.map_icon,
          zIndex: 998,
          id: marker_index // give the marker an ID e.g. 0, 1, 2, 3 - use this for indexing the listed venues
      });
  
      google.maps.event.addListener(marker, 'mouseover', function(event) {
  
          var this_marker = this;
          // executes handler and passes the marker as 'this' and event data as an argument
          self.handle_marker_mouseover.call(self, this, event);
          this_marker.setZIndex(999);
  
      });
  
      google.maps.event.addListener(marker, 'mouseout', function(event) {
  
          // executes handler and passes the marker as 'this' and event data as an argument
          self.handle_marker_mouseout.call(self, this, event);
  
  
      });
  
      google.maps.event.addListener(marker, 'click', function(event) {
  
          // executes handler and passes the marker as 'this' and event data as an argument
          self.handle_marker_click.call(self, this, event);
  
  
      });
  },
  </code></pre>
  
  <p>...</p>
  
  <p>Please help.
  Thanks in advance</p>