所以我目前在我的地图上放了一个圆圈：
var optionsCercle = {
center: latlang,
map: map,
radius: 1000,
fillOpacity: 0.1,
strokeWeight: 0
};
this.circ = new google.maps.Circle(optionsCercle);
现在我将圆的内部设置为fillOpacity:0.1，但我想要做的是将地图上除圆内以外的所有内容都设置为fillOpacity:0.1。我希望视口中除圆圈外的所有内容都“模糊”。我怎样才能做到这一点？
一个在纽约市上空放置一个圆形“洞”的例子（从这个谷歌例子修改）：
var citymap = {};
citymap['newyork'] = {
center: new google.maps.LatLng(40.714352, -74.005973),
population: 8143197
};
var cityCircle;
var bounds = new google.maps.LatLngBounds();
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 use 6371 if using kilometers
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 ends
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));
var ey = point.lng() + (rlng * Math.cos(theta)); // center a + radius x * cos(theta)
var 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]);
}
return extp;
}
function initialize() {
// Create the map.
var mapOptions = {
zoom: 4,
center: new google.maps.LatLng(37.09024, -95.712891),
mapTypeId: google.maps.MapTypeId.TERRAIN
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
var outerbounds = [ // covers the (mercator projection) world
new google.maps.LatLng(85,180),
new google.maps.LatLng(85,90),
new google.maps.LatLng(85,0),
new google.maps.LatLng(85,-90),
new google.maps.LatLng(85,-180),
new google.maps.LatLng(0,-180),
new google.maps.LatLng(-85,-180),
new google.maps.LatLng(-85,-90),
new google.maps.LatLng(-85,0),
new google.maps.LatLng(-85,90),
new google.maps.LatLng(-85,180),
new google.maps.LatLng(0,180),
new google.maps.LatLng(85,180)];
// options for the polygon
var populationOptions = {
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
map: map,
paths: [outerbounds,drawCircle(citymap['newyork'].center,10,-1)]
};
// Add the circle for this city to the map.
cityCircle = new google.maps.Polygon(populationOptions);
map.fitBounds(bounds);
}
google.maps.event.addDomListener(window, 'load', initialize);
{-Lat, (Long-180)%180, 20037508.34-Radius}对我来说效果很好，感谢 Bahram Ardalan。这是我的代码：
lat = 53;
lng = 10;
distance = 10 * 1000; // 10km
new google.maps.Circle({
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
map: this.map,
center: {lat: -1 * lat, lng: (lng - 180 ) % 180},
radius: 20037508.34 - distance
在相反的位置画一个圆并补充半径，如
{-Lat, (Long-180)%180, 20037508.34-Radius}