GMaps:用多边形覆盖所有地球并在那里打个洞

时间:2012-01-31 23:36:51

标签: google-maps google-maps-api-3

我在地图上绘制了两个多边形。第二个多边形在第一个多边形中形成一个孔。我希望第一个多边形尽可能地覆盖地球。因此,让我们专注于那个并暂时放下洞。

由于max / min lat = 90,-90和max / min lng = 180,-180。

如果我画出以下内容,似乎“互相吃饭”

nw = new google.maps.LatLng(90, -180, true); 
ne = new google.maps.LatLng(90, 180, true); 
se = new google.maps.LatLng(-90, 180, true); 
sw = new google.maps.LatLng(-90, -180, true);

points = [nw, ne, se, sw];

如果我稍微调整一下这些数值,我可以让他们不要互相吃饭,但我总会留下相当大的错过。

提前致谢。

1 个答案:

答案 0 :(得分:2)

我得到了它的工作,这是代码:

<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript"> 
function drawCircle(point, radius, dir) { 
var d2r = Math.PI / 180;   // degrees to radians 
var r2d = 180 / Math.PI;   // radians to degrees 
var earthsradius = 3963; // 3963 is the radius of the earth in miles

   var points = 1000; 

   // find the raidus in lat/lon 
   var rlat = (radius / earthsradius) * r2d; 
   var rlng = rlat / Math.cos(point.lat() * d2r); 


   var extp = new Array(); 
   if (dir==1)  {var start=0;var end=points+1} // one extra here makes sure we connect the
   else     {var start=points+1;var end=0}
   for (var i=start; (dir==1 ? i < end : i > end); i=i+dir)  
   { 
      var theta = Math.PI * (i / (points/2)); 
      ey = point.lng() + (rlng * Math.cos(theta)); // center a + radius x * cos(theta) 
      ex = point.lat() + (rlat * Math.sin(theta)); // center b + radius y * sin(theta) 
  extp.push(new google.maps.LatLng(ex, ey)); 
  bounds.extend(extp[extp.length-1]);
   } 
   // alert(extp.length);
   return extp;
   }

var map = null;
var bounds = null;

function initialize() {
  var myOptions = {
    zoom: 10,
    center: new google.maps.LatLng(42,-80),
    mapTypeControl: true,
    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    navigationControl: true,
    mapTypeId: google.maps.MapTypeId.TERRAIN
  }
  map = new google.maps.Map(document.getElementById("map_canvas"),
                            myOptions);

  bounds = new google.maps.LatLngBounds();

  var donut = new google.maps.Polygon({
             paths: [triangleCoords = [
                        new google.maps.LatLng(-87, 120), 
                        new google.maps.LatLng(-87, -87), 
                        new google.maps.LatLng(-87, 0)],
                     drawCircle(new google.maps.LatLng(42,-80), 1000, -1)],
             strokeColor: "#000000",
             strokeOpacity: 0.6,
             strokeWeight: 2,
             fillColor: "#999999",
             fillOpacity: 0.6
 });
 donut.setMap(map);

 map.fitBounds(bounds);



}

</script>