Added support for setStyleLayerProperty

[msaqlain]

Added setStyleLayerProperty support that allows setting the value of a property for a specific layer referencing the specified layerId

Checklist

• I've read CONTRIBUTING.md
• I updated the doc/other generated code with running yarn generate in the root folder
• I have tested the new feature on /example app.
  • In V11 mode/ios
  • In New Architecture mode/ios
  • In V11 mode/android
  • In New Architecture mode/android
• I added/updated a sample - if a new feature was implemented (/example)

[msaqlain]

@mfazekas Created a new PR with the latest version. closing an old one #3870.

Added an example too. Thanks

[mfazekas]

@msaqlain thanks much, can you also add some motivation?!

How is this different from our existing solution:

         <FillLayer id="building" existing style={{ visibility }} />

https://rnmapbox.github.io/docs/examples/Map/ShowAndHideLayer

[msaqlain]

Yes sure @mfazekas

When we are only loading map using styleURL that contains all the Layers & SourceLayers we dont have references to all the FillLayer, LineLayer or other shapes.

To toggle SourceLayers (composite, satellite) we have this method setSourceVisibility

mapRef.current?.setSourceVisibility(
      shouldBeVisible,
      'composite',
      mode
);

Similarly if you want to toggle a specific layer we dont have any method available. To enable this my in my PR i am using setStyleLayerProperty

mapRef?.current?.setStyleLayerProperty(
      layerId,
      'visibility',
      'visible'
);

[mfazekas]

Similarly if you want to toggle a specific layer we dont have any method available. To enable this my in my PR i am using setStyleLayerProperty

mapRef?.current?.setStyleLayerProperty(
      layerId,
      'visibility',
      'visible'
);

I think we do have this:

const [visibility, setVisbility] = useState('visible')
...
<FillLayer id="building" existing style={{ visibility }} />

This will change a specific layer of(building) visibility. Note the existing flag, that will not create new layer but will lookup up the layer by id.

[msaqlain]

@mfazekas If we use this approach as you mentioned, then in my scenario, I have to render 300 layers using FillLayer, which I need to enable and disable based on my internal grouping.

So to achieve this without explicitly mentioning FillLayer i can load map using styleURL only and then using map ref i can enable disable layers.

[msaqlain]

@mfazekas Any update on this?

[mfazekas]

@msaqlain we'd need CI to pass