如何在Google地图中使用多边形绘制圆圈

时间:2014-07-14 09:33:56

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

以下是代码..我想在Maps API V3中使用Polygon函数绘制圆圈,而不是在Google地图中使用圆形函数,因为我必须在圆周上重新创建一些形状,如此处

http://textonly.in/docs/map7.html

无论如何都能获得圆周上的点数?

var mapOptions = {
    zoom: 13,
    center: new google.maps.LatLng(45.512158914823035,-74.12200927734375),
    mapTypeId: google.maps.MapTypeId.TERRAIN
};

var bermudaTriangle;
var bermudaTriangle1;
var rectangle;
var citymap = {};
citymap['chicago'] = {
    center: new google.maps.LatLng(45.637839, -73.648316),
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
  mapOptions);
for (var city in citymap) {
    var populationOptions = {
        strokeColor: '#FF0000',
        strokeOpacity: 0.0,
        strokeWeight: 0,
        fillColor: '#FF0000',
        fillOpacity: 0.35,
        map: map,
        center: citymap[city].center,
        radius: 39 * 1000
    };
    // Add the circle for this city to the map.
    cityCircle = new google.maps.Circle(populationOptions);
}

1 个答案:

答案 0 :(得分:11)

基本上不可能获得点数",因为没有基于点创建一个圆圈(会有无数个点)

可能的解决方法(使用geometry-library)获取"某些点"能够创建一个看起来像圆形的多边形:

在带有递增标题的循环中使用方法google.maps.geometry.spherical.computeOffset

  function circlePath(center, radius, points){
    var a=[],p=360/points,d=0;
    for(var i=0;i<points;++i,d+=p){
        a.push(google.maps.geometry.spherical.computeOffset(center,radius,d));
    }
    return a;
  }

points-argument是所需的返回点数。

该函数返回一个适合用作多边形路径的数组。

演示:http://jsfiddle.net/doktormolle/NLHf9/