CODEWITHSUNDEEP
mapbox
А.Терентьев
А.Терентьев

Reputation: 119

How to change visibility of layer in custom style with Mapbox JS GL?

I am a beginner in mapbox JS GL. I am looking for a way to give the user the opportunity to change visibility of layer in mapbox on button click.
In MapBox studio I add to Basic style visible layer "regions". I tried to do so :

<script> ...
var mapp = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/terentev/ck2so0c4h1q5x1cqow0aj9nh8',
center: [34.047, 63.779],
zoom: 5.41
});
mapp.setLayoutProperty('regions','visibility','none');

But the layer does not disappear.

And when I try get layers from style: 

var v = mapp.getStyle().layers;

I can't. How to do it right?
Thanks in advance!

This is layer 'regions', added to Basic style : layer 'regions' in mapbox studion I tried like this:

var v = mapp.getLayoutProperty('regions', 'visibility');
 alert('visibility '+ v );
 mapp.setLayoutProperty('country-label','visibility','visible');
 v = mapp.getLayoutProperty('regions', 'visibility');
 alert('visibility '+ v );

On first alert I get "visibility undefined" but there is no result on second alert at all

Upvotes: 3

Views: 1882

Answers (1)

Lucas Dolsan
Lucas Dolsan

Reputation: 185

Try this:

var mapp = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/terentev/ck2so0c4h1q5x1cqow0aj9nh8',
center: [34.047, 63.779],
zoom: 5.41
});

mapp.on('load', () => {
     mapp.setLayoutProperty('regions','visibility','none');
})

It just looks like you're invoking setLayoutProperty before the map has properly loaded

Upvotes: 2

Related Questions