这个五角大楼示例显示可以在多边形内添加孔:http://code.google.com/p/gmaps-samples-v3/source/browse/trunk/poly/pentagon.html?r=40
我想在圆圈内加一个洞
目前我正在通过制作一个圆形多边形并放置内部和外部边界来模仿它并且它工作正常,但是代码非常长,因为地图中有大约 15 个圆圈。
任何帮助将不胜感激
谢谢!
我没有找到 Circle 类的任何东西,但是有人想出了一个可以减少代码大小的函数。它做的事情和你做的一样,创建形状像圆形的多边形。
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 = 32;
// 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(-33.9, 151.2),
mapTypeControl: true,
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
navigationControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
bounds = new google.maps.LatLngBounds();
var donut = new google.maps.Polygon({
paths: [drawCircle(new google.maps.LatLng(-33.9,151.2), 100, 1),
drawCircle(new google.maps.LatLng(-33.9,151.2), 50, -1)],
strokeColor: "#0000FF",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#FF0000",
fillOpacity: 0.35
});
donut.setMap(map);
map.fitBounds(bounds);
}
http://www.geocodezip.com/v3_polygon_example_donut.html
函数drawCircle(point, radius, dir)使用dir来区分正空间和孔洞。你必须交替它们来创造洞。