Google Maps V3多边形绘图

Question

我不知道为什么我会在某些区域变色（见图）。注意：当鼠标位于此区域时，它的行为类似于多边形，因此多边形在那里不可点击，但仍然是彩色的。

数据在图片下面。

var coord_region1 = [
{lat: 37, lng: 12},
{lat: 37, lng: 13},
{lat: 37, lng: 14},
{lat: 37, lng: 15},
{lat: 37, lng: 16},
{lat: 38, lng: 16},
{lat: 38, lng: 17},
{lat: 39, lng: 17},
{lat: 39, lng: 18},
{lat: 40, lng: 18},
{lat: 40, lng: 19},
{lat: 41, lng: 19},
{lat: 41, lng: 18},
{lat: 41, lng: 17},
{lat: 42, lng: 17},
{lat: 42, lng: 16},
{lat: 42, lng: 15},
{lat: 43, lng: 15},
{lat: 43, lng: 14},
{lat: 44, lng: 14},
{lat: 44, lng: 13},
{lat: 45, lng: 13},
{lat: 45, lng: 14},
{lat: 46, lng: 14},
{lat: 46, lng: 15},
{lat: 47, lng: 15},
{lat: 47, lng: 14},
{lat: 47, lng: 13},
{lat: 47, lng: 12},
{lat: 47, lng: 11},
{lat: 47, lng: 10},
{lat: 47, lng: 9},
{lat: 47, lng: 8},
{lat: 47, lng: 7},
{lat: 46, lng: 7},
{lat: 46, lng: 6},
{lat: 45, lng: 6},
{lat: 44, lng: 6},
{lat: 44, lng: 7},
{lat: 43, lng: 7},
{lat: 43, lng: 8},
{lat: 43, lng: 9},
{lat: 43, lng: 10},
{lat: 44, lng: 10},
{lat: 44, lng: 9},
{lat: 44, lng: 8},
{lat: 43, lng: 8},
{lat: 42, lng: 8},
{lat: 41, lng: 8},
{lat: 40, lng: 8},
{lat: 39, lng: 8},
{lat: 39, lng: 9},
{lat: 39, lng: 10},
{lat: 40, lng: 10},
{lat: 41, lng: 10},
{lat: 42, lng: 10},
{lat: 42, lng: 11},
{lat: 42, lng: 12},
{lat: 41, lng: 12},
{lat: 41, lng: 13},
{lat: 41, lng: 14},
{lat: 40, lng: 14},
{lat: 40, lng: 15},
{lat: 39, lng: 15},
{lat: 38, lng: 15},
{lat: 38, lng: 14},
{lat: 39, lng: 14},
{lat: 39, lng: 13},
{lat: 39, lng: 12},
{lat: 38, lng: 12},
{lat: 37, lng: 12},
]; 

Answer 1

我明白了。问题是你需要定义像[path_outer，path_inner]这样的数据的多边形“洞”。重要的部分是在与外部路径相反的方向上定义点。

像谷歌文档说的那样：

    // Define the LatLng coordinates for the polygon's  outer path.
    var outerCoords = [
      {lat: 25.774, lng: -80.190},
      {lat: 18.466, lng: -66.118},
      {lat: 32.321, lng: -64.757}
    ];

    // Define the LatLng coordinates for the polygon's inner path.
    // Note that the points forming the inner path are wound in the
    // opposite direction to those in the outer path, to form the hole.
    var innerCoords = [
      {lat: 28.745, lng: -70.579},
      {lat: 29.570, lng: -67.514},
      {lat: 27.339, lng: -66.668}
    ];

https://developers.google.com/maps/documentation/javascript/examples/polygon-hole