Rain and Snow Playground
Mapbox maps bring your visuals to life with dynamic rain and snow effects, featuring highly customizable particle animations that add striking weather realism to your maps. Explore the playground to fine-tune snow and rain parameters and effortlessly generate code snippets for integration into your web or mobile mapping applications.
Rain and Snow Playground
Precipitation Type
Mapbox styles support both rain and snow effects. Choose one to experiment with settings. You will see code snippets on the right that can be used to implement the effect in your web or mobile app.
Light Preset
Choose a light preset to see how the precipitation effect looks in different lighting conditions
Rain Parameters
number of particles
particle speed
thins particles near map center
direction of movement
vertical angle of movement
size normal to direction
size along direction
screen-space distortion
add haze to corners
Frontend Code
Pick a platform to access the code for applying these precipitation settings to a map. The code should be executed after the map has finished loading.
map.setRain({
density: 1,
intensity: 1,
color: '#919191',
opacity: 0.19,
'center-thinning': 0,
direction: [0, 50],
'droplet-size': [1, 10],
'distortion-strength': 0.5,
vignette: 0.5,
vignetteColor: '#6e6e6e'
})
このplaygroundは役に立ちましたか？