interpolate line-color from property value

[WizoneDE]

Hi together,

I currently stuck by using the interpolate option in an exampe lineString geometry and don't see the missing spot in my code :(

Based on this example:
https://docs.mapbox.com/mapbox-gl-js/example/data-driven-lines/

I switched the property for color to a cardio value and wanted to change to color based on <=> of the value.

Example:
0 to 49 = green
50 to 99 = yellow
....

But id doesn't work, the color is still default black without any error in the chrome inspector :(

``
map.on('load', function() {
map.addSource('lines', {
'type': 'geojson',
'data': {
'type': 'FeatureCollection',
'features': [
{
'type': 'Feature',
'properties': {
'cardio': '121'
},
'geometry': {
'type': 'LineString',
'coordinates': [
[-122.4833858013153, 37.829607404976734],
[-122.4830961227417, 37.82932776098012],
]
}
},

			{
				'type': 'Feature',
				'properties': {
					'cardio': '45'
				},
				'geometry': {
					'type': 'LineString',
					'coordinates': [
						[-122.4830961227417, 37.82932776098012],
						[-122.4830746650696, 37.82932776098012],
					]
				}
			},
			
			{
				'type': 'Feature',
				'properties': {
					'cardio': '12'
				},
				'geometry': {
					'type': 'LineString',
					'coordinates': [
						[-122.4830746650696, 37.82932776098012],
						[-122.48218417167662, 37.82889558180985],
					]
				}
			},
			
			{
				'type': 'Feature',
				'properties': {
					'cardio': '65'
				},
				'geometry': {
					'type': 'LineString',
					'coordinates': [
						[-122.48218417167662, 37.82889558180985],
						[-122.48218417167662, 37.82890193740421],
					]
				}
			},
			
			{
				'type': 'Feature',
				'properties': {
					'cardio': '112'
				},
				'geometry': {
					'type': 'LineString',
					'coordinates': [
						[-122.48221099376678, 37.82868372835086],
						[-122.4822163581848, 37.82868372835086],
					]
				}
			}
		]
	}
});


map.addLayer({
	'id': 'lines',
	'type': 'line',
	'source': 'lines',
	'paint': {
		'line-width': 3,
		'line-color': [
			'interpolate', ['linear'], ['get', 'cardio'],
			0,
			'green',
			50,
			'yellow',
			100,
			'orange',
			200,
			'red'
		]
	}
});

``

[arindam1993]

Looks like the value of cardio is a string in your geojson and not a number. Thats probably whats causing the problem

[arindam1993]

Closing since it seems like an issue on your end @WizoneDE .

Feel free to reopen if you still think its a bug.

[WizoneDE]

yes, thanks :)
was focused so much to the interpolate that I didn't saw it :(