In a mapbox gl js layer of type 'fill': Can we control the stroke thickness?

Question

According to https://www.mapbox.com/mapbox-gl-js/style-spec/ a layer with type='fill' draws "a filled polygon with an optional stroked border".

type: 'fill',
paint: {
  'fill-color': 'orange',
  'fill-opacity': 0.5,
  'fill-outline-color': 'red'
}

The stroke around the polygon is drawn, but very thin, so it is hardly noticable.

Question: Is there a way to draw a stronger, thicker, stroke line (stroke) around the polygon?

I also found https://github.com/mapbox/mapbox-gl-js/issues/4087 which argues, that the settings are confusing as they are now. I agree with that.

pathmapper pathmapper · Accepted Answer · 2018-05-16T13:54:03

According to this comment the stroke is currently limited to 1px width (you can't change the width): https://github.com/mapbox/mapbox-gl-js/issues/4088#issuecomment-285801635

You could use an additional line layer (using the same source) on top of the polygon fill layer. This way you would be able to draw a thicker stroke around the polygon using line-width (for the line layer).

In a mapbox gl js layer of type 'fill': Can we control the stroke thickness?

1 Answers