如何在Mapbox GL中多次添加不同颜色的fill-extrusion数据

我在Mapbox GL地图上尝试多次添加不同颜色的fill-extrusion类型数据，遇到了显示异常的问题，具体情况如下：

第一种尝试：每次添加独立图层 #

最初采用每次调用方法添加一个图层的方式，代码如下：

Vue.prototype.drawPolygonTest = function (map, data, color = '')
{
    color = color || Vue.prototype.getRandomColor();
    console.log('color:', color)
    const layerId = Vue.prototype.getRandomLayer();
    const paint = {
        'fill-extrusion-color': color,
        'fill-extrusion-height': ['get', 'Height'],
        'fill-extrusion-opacity': 0.9
    }
    const layer = Vue.prototype.getSLayer(layerId, 'fill-extrusion', data, paint)
    map.addLayer(layer);
};

第一次设置颜色为#99D9A9，第二次为#922245，但地图上所有建筑都显示为第一个颜色#99D9A9。调试发现：

• 执行map.addLayer(layer);前，图层对象包含完整的paint属性
• 执行后查看map.getStyle().layers，仅第一个图层保留paint属性，后续图层的paint属性丢失

用到的封装函数：

Vue.prototype.getRandomLayer = function () {
    return `markerlayer-${Date.now()}-${Math.random().toString(36).substr(2, 3)}`;
};

Vue.prototype.getRandomColor = function () {
    let letters = '0123456789ABCDEF';
    let color = '#';
    for (let i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
};

Vue.prototype.getSLayer = function (layerId, type, data, paint, layout = {})
{
    return {'id': layerId, 'type': type, 'source': Vue.prototype.getSSource(data), 'paint': paint, 'layout': layout}
};

我也曾尝试直接给map.getStyle().layers中的图层手动添加paint属性，但没有效果。

第二种尝试：合并源数据并修改属性 #

之后尝试修改源数据，给每个要素添加颜色属性，再合并到已有源中，代码如下：

Vue.prototype.drawPolygonTest2 = function (map, data, color = '')
{
    color = color || Vue.prototype.getRandomColor();
    data.features.forEach(feature =>
    {
        feature.properties.fillColor = color;
    });

    const layers = map.getStyle().layers;
    let targetSourceId;
    for (const layer of layers)
    {
        if (layer.type === 'fill-extrusion')
        {
            targetSourceId = layer.source;
            break;
        }
    }
    if (targetSourceId)
    {
        const source = map.getSource(targetSourceId)
        source.setData(source._data.features.concat(data.features))
    }
    else
    {
        const layerId = Vue.prototype.getRandomLayer();
        const paint = {
            'fill-extrusion-color': color,
            'fill-extrusion-height': ['get', 'Height'],
            'fill-extrusion-opacity': 0.9
        }
        const layer = Vue.prototype.getSLayer(layerId, 'fill-extrusion', data, paint)
        map.addLayer(layer);
    }
};

这种方法依然无效，所有建筑还是显示同一个颜色，无法实现不同批次的建筑显示不同颜色。

内容的提问来源于stack exchange，提问作者enen