Mapbox GL JS 根据表达式更改填充颜色的属性值

Question

我有一个 chloropleth map 有一个 geojson 数据源支持它。 该数据集包含每个国家/地区两个不同年份的数据，填充颜色基于 JSON 中的一个属性。这是我目前的 addLayer 代码，效果很好。

map.addLayer({
                id: 'emissions',
                type: 'fill',
                source: {
                    type: 'geojson',
                    data: './data.json'
                },
                paint: {
                    'fill-color': {
                        property: 'total_2014',
                        type: 'exponential',
                        base: 0.99999,
                        stops: [
                            [3, "hsl(114, 66%, 53%)"],
                            [2806634, "hsl(0, 64%, 51%)"]
                        ]
                    },
                    'fill-opacity': 1
                }
            });

我希望能够以编程方式切换填充颜色所基于的 json 属性，并且表达式似乎是显而易见的方法，但是以下代码失败并出现错误layers.emissions.paint.fill-color.property : 需要字符串，找到数组。

...
paint: {
                    'fill-color': {
                        property: ['get', propName], // propName var is e.g. 'total_2014'
                        type: 'exponential',
                        base: 0.99999,
                        stops: [
                            [3, "hsl(114, 66%, 53%)"],
                            [2806634, "hsl(0, 64%, 51%)"]
                        ]
                    },
                    'fill-opacity': 1
                }
...

有没有办法实现我的目标？ 我对使用 Mapbox GL JS 很陌生，如果这是一个基本问题，我深表歉意。

Answer 1

以防万一其他人遇到此要求，我找到了一种解决方法，方法是直接更新地图的样式属性。 这不是一个确切的答案，因为该方法不使用表达式，但 mapbox 区分源和应用更改的性能非常快并且满足我的要求。

function loadDataForYear(year) {
    const style = map.getStyle();
    style.layers.find(({ id }) => id === "emissions").paint['fill-color']['property'] = 'total_' + year;
    map.setStyle(style);
}