I want to plot real-time earthquakes in world map by the data provided by USGS api and I want to switch between different layers (like - past hour, past day, past week, past month). Mapbox vector tilesets support this layer-wise arrangement but this only works on uploaded data in Mapbox tileset.
app.js
mapboxgl.accessToken = 'MY_ACCESS_TOKEN';
const map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/vormir/ckzo5g2rg002l15r0jsz86gsz',
zoom: 1
})
map.on('load', () => {
map.addSource('earthquakes-month', {
type: 'vector',
url: 'mapbox://vormir.ct3sxzef',
generateId: true
})
map.addLayer({
id: 'earthquakes-month',
type: 'circle',
source: 'earthquakes-month',
layout: {
'visibility': 'visible'
},
paint: {
'circle-radius': 5,
'circle-opacity': 0.9,
'circle-color': '#fc691d'
},
'source-layer': 'all_month-810n6l'
})
map.addSource('earthquakes-week', {
type: 'vector',
url: 'mapbox://vormir.6p6wjj7v',
generateId: true
})
map.addLayer({
id: 'earthquakes-week',
type: 'circle',
source: 'earthquakes-week',
layout: {
'visibility': 'visible'
},
paint: {
'circle-radius': 5,
'circle-opacity': 0.9,
'circle-color': '#6deb9c'
},
'source-layer': 'all_week-7i42kp'
})
})
How do I plot USGS api response as a Mapbox vector tileset? Any help would be greatly appreciated.