MapBox iOS SDK 3.7.2中interiorPolygons部分区域无法显示孔洞

看起来你的问题根源在于多边形坐标的缠绕方向不符合Mapbox的要求。Mapbox的MGLPolygon对外部环和内部洞的坐标顺序有严格规定：外部多边形的坐标方向必须与内部洞的方向相反，否则SDK无法正确识别出“挖洞”区域，导致部分区域的孔洞不显示。

问题分析 #

你当前代码中，全球遮罩多边形（worldOverlay）和内部六边形（lightPolygon）的坐标方向大概率是一致的，这就导致莫斯科区域没有被识别为需要挖空的部分，反而被当成了遮罩的一部分。

解决方案 #

只需要调整内部多边形的坐标顺序，让它与外部多边形的方向相反即可：

修改后的代码示例 #

// 定义标准的全球外部多边形（逆时针方向，覆盖整个地球）
CLLocationCoordinate2D worldCoords[] = {
    {90.0, -180.0},
    {90.0, 180.0},
    {-90.0, 180.0},
    {-90.0, -180.0}
};
NSUInteger numberOfWorldCoords = sizeof(worldCoords) / sizeof(CLLocationCoordinate2D);

// 将内部六边形的坐标调整为顺时针方向（原数组倒序排列）
CLLocationCoordinate2D lightCoordinate[] = {
    {55.735024042991469, 37.617187500000007},
    {55.742165827861974, 37.639160156249993},
    {55.75644547726997, 37.639160156249993},
    {55.763583342064059, 37.617187500000007},
    {55.75644547726997, 37.595214843749993},
    {55.742165827861974, 37.595214843749993}
};
NSUInteger numberOfLightCoordinates = sizeof(lightCoordinate) / sizeof(CLLocationCoordinate2D);
MGLPolygon *lightPolygon = [MGLPolygon polygonWithCoordinates:lightCoordinate count:numberOfLightCoordinates];
NSArray<MGLPolygon *> *lightPolygonArray = @[lightPolygon];

// 创建带内部洞的遮罩多边形
MGLPolygon *worldOverlay = [MGLPolygon polygonWithCoordinates:worldCoords count:numberOfWorldCoords interiorPolygons:lightPolygonArray];
[self.mapBoxView addOverlay:worldOverlay];

关键调整说明 #

1. 外部多边形方向：使用逆时针方向绘制全球遮罩，符合Mapbox对外部环的默认规则
2. 内部洞方向：将六边形坐标倒序改为顺时针，与外部环方向相反，这样SDK就能正确识别这是需要挖空的区域

额外调试建议 #

如果修改后仍有问题，可以检查以下几点：

• 确保在mapView:rendererForOverlay:方法中正确配置了遮罩的样式，比如：

- (MGLFillStyleLayer *)mapView:(MGLMapView *)mapView rendererForOverlay:(id<MGLOverlay>)overlay {
    if ([overlay isKindOfClass:[MGLPolygon class]]) {
        MGLFillStyleLayer *fillLayer = [[MGLFillStyleLayer alloc] initWithIdentifier:@"mask-layer" polygon:overlay];
        fillLayer.fillColor = [NSExpression expressionForConstantValue:[UIColor colorWithWhite:0 alpha:0.7]];
        fillLayer.fillOpacity = [NSExpression expressionForConstantValue:@0.7];
        return fillLayer;
    }
    return nil;
}

• 可以用Mapbox Studio导入你的多边形坐标，直观查看坐标方向是否正确

内容的提问来源于stack exchange，提问作者Zgpeace