title: How do I add multiple overlay markers in google maps api
body: <p>I was thankfully able to one marker to show on the screen using this fiddle, however, when I created another marker or any after that, it seems that the markers append&amp;stacked on themselves.</p>
  
  <p>Is there a way to have each marker in it's own location?</p>
  
  <p>The Fiddle:
  <a href="http://jsfiddle.net/syrtrjsa/5/" rel="nofollow">http://jsfiddle.net/syrtrjsa/5/</a></p>
  
  <p>And it's code:</p>
  
  <pre><code>var overlay;
  
  function initialize() {
      var myLatLng = new google.maps.LatLng(62.323907, -150.109291);
      var mapOptions = {
          zoom: 11,
          center: myLatLng,
          mapTypeId: google.maps.MapTypeId.SATELLITE
      };
  
      var gmap = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
  
      function HTMLMarker(lat, lng) {
          this.lat = lat;
          this.lng = lng;
          this.pos = new google.maps.LatLng(lat, lng);
      }
  
      HTMLMarker.prototype = new google.maps.OverlayView();
      HTMLMarker.prototype.onRemove = function () {}
  
      //init your html element here
      HTMLMarker.prototype.onAdd = function () {
          div = document.createElement('DIV');
          div.className = "htmlMarker";
          div.innerHTML = '&lt;img src="http://www.w3schools.com/html/pic_mountain.jpg" alt="Mountain View" style="width:30px;height:22px"&gt;' + 21;
          var panes = this.getPanes();
          panes.overlayImage.appendChild(div);
      }
  
      HTMLMarker.prototype.draw = function () {
          var overlayProjection = this.getProjection();
          var position = overlayProjection.fromLatLngToDivPixel(this.pos);
          var panes = this.getPanes();
          panes.overlayImage.style.left = position.x + 'px';
          panes.overlayImage.style.top = position.y - 30 + 'px';
      }
  
      //to use it
      var htmlMarker = new HTMLMarker(62.323907, -150.109291);
      htmlMarker.setMap(gmap);
      var htmlMarker = new HTMLMarker(62.323907, -151.109291);
      htmlMarker.setMap(gmap);
  }
  </code></pre>