Google Maps JS API多边形渲染问题

Question

我正在创建包含许多多边形的Google地图。问题在于，当我渲染多边形时，它们的颜色不一致（多边形主体上的颜色不同），并且不能完全渲染。其中包括2张图像，您可以在其中看到渲染的给定多边形的数量不一致。

[期望的行为是多边形完全渲染（没有直线在多边形主体的中间向下进行渲染），并且多边形填充的颜色在整个多边形中是一致的。

我认为这是一个平铺问题。这是我用来管理自定义地图类型的“ getTile”和“ releaseTile”逻辑的代码：

GMICMapType.prototype.getTile = function(coord, zoom, ownerDocument) {
    var c = Math.pow(2, zoom);
    var c = Math.pow(2, zoom);
    var tilex=coord.x,tiley=coord.y;
    if (imageWraps) {
      if (tilex<0) tilex=c+tilex%c;
      if (tilex>=c) tilex=tilex%c;
      if (tiley<0) tiley=c+tiley%c;
      if (tiley>=c) tiley=tiley%c;
    }
    else {
      if ((tilex<0)||(tilex>=c)||(tiley<0)||(tiley>=c)) {
        var blank = ownerDocument.createElement('DIV');
        blank.style.width = this.tileSize.width + 'px';
        blank.style.height = this.tileSize.height + 'px';
        return blank;
      }
    }
    var img = ownerDocument.createElement('IMG');
    var d = tilex;
    var e = tiley;
    var f = "t";
    for (var g = 0; g < zoom; g++) {
      c /= 2;
      if (e < c) {
          if (d < c) { f += "q" }
          else { f += "r"; d -= c }
      }
      else {
          if (d < c) { f += "t"; e -= c }
          else { f += "s"; d -= c; e -= c }
      }
}
GMICMapType.prototype.realeaseTile = function(tile) {
      var idx = this.Cache.indexOf(tile);
      if(idx!=-1) this.Cache.splice(idx, 1);
      tile=null;
}

另外，我正在使用此代码将多边形推入地图：

            // Construct the sector outline.
        window[sectorName] = new google.maps.Polygon({
          name: sectorTitle,
          infoWindowPointX: sectorCenterPointX,
          infoWindowPointY: sectorCenterPointY,
          knownSystems: knownSystems,
          factionColor: factionColor,
          paths: sectorCoords,
          sectorDataNum: s,
          strokeColor: sectorColor,
          strokeOpacity: 1,
          strokeWeight: 0.8,
          zIndex: 1,
          fillColor: sectorColor,
          fillOpacity: 1
        });
        polygons.push(window[sectorName]);
        window[sectorName].setMap(map);

我猜这是与该问题相关的代码，但是我不确定是什么导致了该问题，所以我不确定要包括什么代码。如果我应包括代码的其他部分（或所有代码），请告诉我。

Answer 1

我将为以后遇到类似问题的任何人回答我自己的问题，因为我没有收到任何答复并针对每个问题设计了解决方法。

1. 问题：多边形着色不正确。

解决方案：我检查了fillColor属性，发现传递的值不正确。传递正确的值可解决此问题。

2. 问题：并非所有的多边形都在所有缩放级别上渲染。

解决方案：我的原始源图像是一张1000px X 1000px的地图，其内容几乎绘制到4个边缘中的3个边缘上（这意味着3边的边框附近几乎没有空白）。我将源图像增加到2000px X 2000px，并将原始图像放置在中心，这意味着我的地图现在有更多的“空”空间，因此我不会在边缘附近渲染多边形。这导致了较小的地图，坐标的保真度较低（1 X现在是具有内容的地图部分的两倍，以前是它的两倍），但是现在多边形仅位于google map元素的中心附近。由于某些原因，这意味着所有多边形都将在所有缩放级别上渲染，这是我想要的结果，但要牺牲一些保真度和地图图像分辨率。