MGLFillStyleLayer border flicker in upper part of MGLMapView

[SandipBuchade]

I have created MGLFillStyleLayer with the MGLVectorTileSource. The layer has a transparent fill color and border color (fillOutlineColor). It is looking as expected but its flickering on the upper part of MGLMapView.

Steps to reproduce

1. Create MGLFillStyleLayer with MGLVectorTileSource
2. Set transparent fill color and any border color(fillOutlineColor) to the layer
3. Add a layer to map style
4. Pan map in such a way that features in the layer appears in upper part of the map view

Demonstration Video:
IMG_1028.TRIM.mov.zip

Expected behavior

MGLFillStyleLayer should not flicker in upper part of the map view

Actual behavior

MGLFillStyleLayer flickering in upper part of map view

Configuration

Mapbox SDK versions: 4.4
iOS/macOS versions: iOS 11.4
Device/simulator models: iPhone 6
Xcode version: 9.4.1

[ansis]

Thanks for reporting!

The best way to work around this is to create a line layer instead of a fill layer! Line layers can be created for polygon geometries, not just line geometries.

It looks like the flickering is caused by the aliasing that happens when a 1px line is rendered.

fill-outline is known to be pretty buggy. We've talked about removing it or expanding it to allow different widths but that hasn't been done because both approaches have their challenges. Related issues: mapbox/mapbox-gl-js#2080, mapbox/mapbox-gl-js#4088

I'll close this issue in favor of those open issues.