title: google maps polygon outline color vary when polygons overlap
body: <p>(I posted this in the google maps forum before I saw a specific one for the API.  oops)</p>
  
  <p>I have a google maps webpage where I am trying to draw a lot of polygons. Currently using Google maps api v3.8 (Firefox 17.0.1 under Ubuntu 10).</p>
  
  <pre><code>&lt;script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.8&amp;libraries=geometry&amp;sensor=false" &gt;&lt;/script&gt;
  </code></pre>
  
  <p>I use ajax calls to create each a polygon using:</p>
  
  <pre><code>record.poly = new google.maps.Polygon({
      strokeColor: lineColor,
      strokeOpacity: lineOpacity,
      strokeWeight: lineWidth,
      fillColor: lineColor,
      fillOpacity: fillOpacity
  });
  for (var i = 0; i &lt; points.length; i += 2)
  {
      var point = new google.maps.LatLng(points[i + 1], points[i]);
      record.poly.getPath().push(point);
  }
  </code></pre>
  
  <p>In this example, I created about 3400 polygons (color blue, width 2, line opacity 0.7, fill opacity 0.2) by calling:</p>
  
  <pre><code>record.poly.setMap(myMap);
  </code></pre>
  
  <p>when I am ready to display.</p>
  
  <p>Then I created another roughly 3600 polygons in green (width 6, line opacity 0.7, fill opacity 0.2) by calling the same code.</p>
  
  <p>The problem is what I see isn't consistent. I expected to see a lot of greenish-blue squares or a lot of blueish-greeen squares, depending on which the browser draws first. But I don't. I a see both greenish-blue and blueish-greeen.</p>
  
  <p>I can't really link to my application, but this is what the map looks like when I zoom out:<br>
  <a href="http://itic.occinc.com/brian/gmap-boxes-full.png" rel="nofollow">http://itic.occinc.com/brian/gmap-boxes-full.png</a>
  <br>and when you zoom in:<br>
  <a href="http://itic.occinc.com/brian/gmap-boxes-zoom.png" rel="nofollow">http://itic.occinc.com/brian/gmap-boxes-zoom.png</a></p>
  
  <p>I don't really care too much if it is blue-green or green-blue when both are displayed, but I do need it to be consistent across the map.</p>
  
  <p>At a high level, any ideas? Am I bumping against some sort of shape limit?</p>
  
  <ul>
  <li>B</li>
  </ul>