Mapbox GL JS : Changing polygon border width

Question

I have a simple polygon on a map and I would just like to adjust the border color width. (geoJSON is external) I was unable to find this in the API manual.

This is a link to my example (and source).

Currently my code for styling the polygon is:

'paint': {
'fill-color': 'rgba(60, 120, 40, 0.4)',
'fill-outline-color': 'rgba(20, 100, 25, 1)'
}

What should I add to give the border more width? Are there other style options for simple polygons that I am missing? (Since I can't find the documentation on this.)

I am posting an image below of my issue - basically the border is well defined in the left side of the image, but if the user changes the view angle it becomes hard to see because the width is too small.

Answer 1

Due to technical reasons for the fill style, you can not specify a border width greater than 1. Use the additional layer with the line style:

  map.addLayer({
    'id': 'states-layer-outline',
    'type': 'line',
    'source': {
      'type': 'geojson',
      'data': 'test.js'
    },
    'paint': {
      'line-color': 'rgba(255, 0, 0, 1)',
      'line-width': 4
    }
  });  

[ https://jsfiddle.net/tny37kbu/ ]