在Google地图中绘制多边形内的圆圈

时间:2016-11-03 22:39:17

标签: google-maps polygon geometry

我正在使用react.js,我目前知道如何通过以下方法在多边形中放置一个洞:

drawShape(google){
    var entireMap = [
    new google.maps.LatLng(-85.1054596961173, -180),
    new google.maps.LatLng(85.1054596961173, -180),
    new google.maps.LatLng(85.1054596961173, 180),
    new google.maps.LatLng(-85.1054596961173, 180),
    new google.maps.LatLng(-85.1054596961173, 0)];

 var innerCoords = [
    {lat: 28.745, lng: -70.579},
    {lat: 29.570, lng: -67.514},
    {lat: 27.339, lng: -66.668}
  ];

    const poly = new google.maps.Polygon({
        paths: [entireMap, innerCoords],
        strokeColor: '#000000',
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: '#000000',
        fillOpacity: 0.35
    });

    poly.setMap(google.map);
    }

现在,我有一个包含lng和lat的属性列表。使用lng和lat,而不是将多边形作为孔,我希望将圆圈作为孔。

到目前为止,我发现文档允许您单独创建圈子:

var cityCircle = new google.maps.Circle({
      strokeColor: '#FF0000',
      strokeOpacity: 0.8,
      strokeWeight: 2,
      fillColor: '#FF0000',
      fillOpacity: 0.35,
      map: map,
      center: citymap[city].center,
      radius: Math.sqrt(citymap[city].population) * 100
    });

但是,我希望圆圈是entireMap多边形内的“洞”。是否可以组合entireMap形状和圆形,或者我是否需要创建一个从多边形形状创建圆的函数?

0 个答案:

没有答案