使用 Mapbox 对线条使用颜色渐变答案

【问题标题】：Use a color gradient for a line with Mapbox使用 Mapbox 对线条使用颜色渐变
【发布时间】：2017-08-08 16:36:45
【问题描述】：

如何使用 Mapbox GL JS 更改 line-color 以使用颜色渐变而不是单一颜色进行渲染（从头到尾）？

    map.addLayer({
        'id': 'walking-line',
        'type': 'line',
        'source': 'walking',
        'layout': {
            'line-join': 'round',
            'line-cap': 'round'
        },
        'paint': {
            'line-color': '#088',
            'line-width': 5
        }
    });

这可能吗？我不希望更改 geojson 文件。

【问题讨论】：

标签： javascript colors gradient mapbox mapbox-gl

【解决方案1】：

Try this

map.addLayer({
            'id': 'walking-line',
            'type': 'line',
            'source': 'walking',
            'layout': {
                'line-join': 'round',
                'line-cap': 'round'
            },
            'paint': {
                'line-color': 'red',
                'line-width': 5,
    'line-gradient': [
                    'interpolate',
                    ['linear'],
                    ['line-progress'],
                    0, "blue",
                    0.1, "royalblue",
                    0.3, "cyan",
                    0.5, "lime",
                    0.7, "yellow",
                    1, "red"
                ]
            }
        });

【讨论】：

【解决方案2】：

（尚）不支持此功能。见：https://github.com/mapbox/mapbox-gl-js/issues/4095

【讨论】：