Javascript 属性“圆颜色”始终绘制黑色圆
我试图在mapbox gl地图上显示多个圆。圆圈的颜色取决于Javascript 属性“圆颜色”始终绘制黑色圆,javascript,reactjs,mapbox,geojson,Javascript,Reactjs,Mapbox,Geojson,我试图在mapbox gl地图上显示多个圆。圆圈的颜色取决于aqi属性的值。我已经根据该值设置了颜色的插值。问题是我总是有黑眼圈 圆形颜色属性： 'circle-color': [ 'interpolate', ['linear'], ['get', 'aqi'], 0, '#eee695', 50, '#a5fc03', 100, '#dbfc03', 200, '#fc1c03'
aqi'circle-color': [
'interpolate',
['linear'],
['get', 'aqi'],
0,
'#eee695',
50,
'#a5fc03',
100,
'#dbfc03',
200,
'#fc1c03'
],
map.on('load', () => {
Axios.get('https://api.waqi.info/map/bounds/?latlng=41.03143,20.52421,42.20194,22.89056&token='+AQI_KEY).then(res=>{
const data = [];
res.data.data.map(station=>{
if(station.aqi!=='-'){
data.push(JSON.stringify({ "type": "Feature", "properties": {"aqi": station.aqi},
"geometry":
{
"type": "Point", "coordinates": [ station.lon, station.lat ]
}
}))
}
})
map.addSource('AQI', {
'type': 'geojson',
'data':
{
"type": "FeatureCollection",
"crs": { "type": "name", "properties": { "aqi": "aqi" } },
"features": data.map(JSON.parse)
}
});
map.addLayer(
{
'id': 'AQI-heat',
'type': 'circle',
'source': 'AQI',
'paint': {
'circle-radius': {
'type': 'exponential',
'stops': [[0, 70], [500, 70]]
},
'circle-opacity': {
'type': 'exponential',
'stops': [[-99, 0.0], [-50, 1.0]]
},
'circle-color': [
'interpolate',
['linear'],
['get', 'aqi'],
0,
'#eee695',
50,
'#a5fc03',
100,
'#dbfc03',
200,
'#fc1c03'
],
'circle-blur': 1
}
}
);
})
})
}