title: Google Maps Javascript V3: How can I Set the Marker Shadow's Offset from the Marker?
body: <p>I've got a Google Map with a few different types of icons. I've got a shadow on each icon. How can I adjust the marker shadow's offset from the marker? </p>
  
  <p>In the loop that builds each marker, I've got: </p>
  
  <pre><code>var icon = customIcons[type];
  var marker = new google.maps.Marker({
      map: map,
      position: point,
      icon: icon.icon,
      shadow: icon.shadow
      });
  </code></pre>
  
  <p>The icon gets set by type.</p>
  
  <pre><code>var customIcons = {
    Football: {
      icon: 'http://path-to-image1.png', 
      shadow: 'http://path-to-shadow-image1.png'
    },
    Lacrosse: {
      icon: 'http://path-to-image2.png',
      shadow: 'http://path-to-shadow-image2.png'
    }
  };
  </code></pre>
  
  <p>In this <a href="http://code.google.com/apis/maps/documentation/javascript/overlays.html#Markers" rel="nofollow">tutorial</a>, they set the size and offset for a single icon as follows:</p>
  
  <pre><code>var image = new google.maps.MarkerImage('images/beachflag.png',
        // This marker is 20 pixels wide by 32 pixels tall.
        new google.maps.Size(20, 32),
        // The origin for this image is 0,0.
        new google.maps.Point(0,0),
        // The anchor for this image is the base of the flagpole at 0,32.
        new google.maps.Point(0, 32));
    var shadow = new google.maps.MarkerImage('images/beachflag_shadow.png',
        // The shadow image is larger in the horizontal dimension
        // while the position and offset are the same as for the main image.
        new google.maps.Size(37, 32),
        new google.maps.Point(0,0),
        new google.maps.Point(0, 32));
  </code></pre>
  
  <p>In my situation, I've got multiple icons and they are set in an object. How can I add the size and offset to <code>var customIcons</code> ? </p>
  
  <p>Thank you.</p>