title: Scaling marker size with marker icons from a sprite in Google Maps API v3
body: <p>I'm playing with the Google Maps API (v3) and I've run into an issue with marker icons. I'm trying to vary the size of my markers depending on their individual data attributes.</p>
  
  <p>The icons themselves are in a sprite that contains three different circular markers, each 16px by 16px. I'm trying to <strong>scale individual icons</strong>, but am so far unsuccessful.</p>
  
  <p>Here's my code:</p>
  
  <pre><code>var offset = Math.floor(Math.random() * 3) * 16; // pick one of the three icons in the sprite
  
  // Calculate desired pixel-size of the marker
  var size = Math.floor(4*(count-1) + 8);
  
  // Create custom marker
  var marker = new google.maps.Marker({
      position: new google.maps.LatLng(lat, lng),
      icon: new google.maps.MarkerImage(
          'img/dot.png', // my sprite with 3 circular icons
          new google.maps.Size(16, 16), // 16x16 is the original size of each individual icon
          new google.maps.Point(0, offset), // picking one of the three icons in the sprite
          new google.maps.Point(Math.floor(size/2), Math.floor(size/2)), // setting correct anchor for the marker
          new google.maps.Size(size, size) // trying to scale the marker
         )
      });
  </code></pre>
  
  <p>The problem seems to be at the last line, where I'm trying to scale the marker icon to the desired size. Instead of it scaling properly, I'm <strong>getting a weird, distorted ellipse-shaped icon</strong>.</p>
  
  <p>What am I doing wrong?</p>