Javascript Mapbox GL js,通过变量图标有效地表示geojson源

Javascript Mapbox GL js,通过变量图标有效地表示geojson源,javascript,icons,mapbox,layer,mapbox-gl-js,Javascript,Icons,Mapbox,Layer,Mapbox Gl Js,我有一个由geojson点列表组成的mapbox源,该源的每个元素都有一个指向图标URL的关键图标: var featureCollection = { "type": "FeatureCollection", "features": [ { "geometry":{ "type": "Point", "coordinates": [1,1] },

我有一个由geojson点列表组成的mapbox源,该源的每个元素都有一个指向图标URL的关键图标:

var featureCollection = {
    "type": "FeatureCollection",
    "features": [
        {
            "geometry":{
                "type": "Point",
                "coordinates": [1,1]
            },
            "properties": {
                "id": 1,
                "name": "name1",
                "address": "address1",
                "icon": "icon1"
            }
        },
        {
            "geometry":{
                "type": "Point",
                "coordinates": [2,2]
            },
            "properties": {
                "id": 2,
                "name": "name2",
                "address": "address2",
                "icon": "icon2"
            }
        },
        {
            "geometry":{
                "type": "Point",
                "coordinates": [3,3]
            },
            "properties": {
                "id": 3,
                "name": "name3",
                "address": "address3",
                "icon": "icon3"
            }
        },
        {
            "geometry":{
                "type": "Point",
                "coordinates": [4,4]
            },
            "properties": {
                "id": 4,
                "name": "name4",
                "address": "address4",
                "icon": "icon1"
            }
        }
    ]
}

map.addSource("shops", {
    type: "geojson",
    data: featureCollection,
    cluster: true,
    clusterMaxZoom: 14,
    clusterRadius: 50
});
我想通过图标变量来描绘我的特征,一种方法是添加尽可能多的层,因为我有不同的图标:

map.addLayer({
    id: currentLayer,
    type: "symbol",
    source: "featureCollection",
    filter: ["!has", "point_count"],
    "layout": {
        "icon-image": currentIcon,
        "icon-size":1.5
    }
});

问题是我有200多个不同的图标(在800个观察中),我真的怀疑创建200个不同的图层是绘制我的观察的最有效的方法。特别是当我在用户点击一个图层时触发一个函数时,所以我还必须多次定义这样的函数,因为我有不同的图标

您可以而且应该只创建一个层<代码>图标图像支持数据驱动样式,因此您可以使用
“图标图像”:“{icon}”

当然,这假设您的样式中有图标,它们的名称为
icon1
icon2',
icon3
,基于GeoJSON中的
icon`properties的值

如果需要操纵值,也可以使用