mapbox-gl：图层过滤显示

在mapbox-gl中加载图层时，要控制显示和隐藏其中的某些元素，需要使用mapbox-gl的图层过滤接口。
每种类型图层的layout中有visibility属性，但是这个在api文档中，只支持基本函数，达不到控制图层中特定元素显示和隐藏的功能，只能控制当前图层全部元素的显示和隐藏。
map.setLayoutProperty(‘图层id’, ‘visibility’,‘枚举属性’);

mapbox-gl图层过滤有单独的api说明setFilter：
https://docs.mapbox.com/mapbox-gl-js/api/map/#map#setfilter
根据图层中的数据属性，控制图层my-layer中名称为name的元素显示：
map.setFilter(‘my-layer’, [’==’, [‘get’, ‘name’], ‘name’]);
如要控制多个元素的显示和隐藏，可以使用多条件控制语句，示例中是显示名称不是name1、name2的其他元素：

map.setFilter('my-layer',	[ "all",  ["!=", ["get", "name"], "name1"], ["!=", ["get", "name"], "name2"] ]);

mapbox-gl的表达式语句参照官方说明文档：
https://docs.mapbox.com/mapbox-gl-js/style-spec/expressions/
图层过滤还能控制数据源中的空间类型，在mapbox-gl中加载的一个geosjon数据源中包含多种几个空间类型，如point、linestring和polygon，使用过滤语句，可以在加载图层时，设置加载某一类型的数据，写法如下：

map.addLayer({
     id: 'measure-points',
       type: 'circle',
        source: 'geojson',
        paint: {
        'circle-radius': 5,
        'circle-color': '#000'
         },
       //加载点数据源
       filter: ['in', '$type', 'Point']
     });

mapbox-gl提供的图层方式，还是能够很方便的控制图层元素的操作，更多使用的方式参见官方的API文档。

参考文档：
https://docs.mapbox.com/mapbox-gl-js/example/measure/
https://docs.mapbox.com/mapbox-gl-js/style-spec/expressions/
https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/

更多文章请关注公众号查看！