Snow

Search Style Specification

A style's snow property is a global styling effect that can be used to add animated snow to the map. This property can be used to create a winter scene or match a designer's aesthetic. Snow provides a visual cue to improve the appearance of a map and can be used to create a festive or more true-to-life atmosphere.

EXAMPLE

Add a snow effect to a map

See what a style using the snow property looks like in a web browser with Mapbox GL JS.

PLAYGROUND

Rain and Snow Playground

The rain and snow playground allows you to test these style values in browser, offering UI to adjust the particle density, intensity, color, speed, etc.

"snow": {
  "density": 0.85,
  "intensity": 1.0,
  "center-thinning": 0.1,
  "direction": [0, 50],
  "opacity": 1.0,
  "color": "#ffffff",
  "flake-size": 0.71,
  "vignette": 0.3,
  "vignette-color": "#ffffff"
}

center-thinning

EXPERIMENTAL

Optional number between 0 and 1 inclusive. Defaults to 0.4. Supports smooth-rampinterpolateexpressions. opacityTransitionable.

Thinning factor of snow particles from center. 0 - no thinning. 1 - maximal central area thinning.

SDK Support	Mapbox GL JS	Android SDK	iOS SDK
basic functionality	>= 3.9.0	>= 11.9.0	>= 11.9.0

color

EXPERIMENTAL

Optional color . Defaults to "#ffffff". Supports smooth-rampinterpolateexpressions. opacityTransitionable.

Snow particles color.

SDK Support	Mapbox GL JS	Android SDK	iOS SDK
basic functionality	>= 3.9.0	>= 11.9.0	>= 11.9.0

density

EXPERIMENTAL

Optional number between 0 and 1 inclusive. Defaults to ["interpolate",["linear"],["zoom"],11,0,13,0.85]. Supports smooth-rampinterpolateexpressions. opacityTransitionable.

Snow particles density. Controls the overall particles number.

SDK Support	Mapbox GL JS	Android SDK	iOS SDK
basic functionality	>= 3.9.0	>= 11.9.0	>= 11.9.0

direction

EXPERIMENTAL

Optional array of numbers between 0 and 360 inclusive. Defaults to [0,50]. Supports smooth-rampinterpolateexpressions. opacityTransitionable.

Main snow particles direction. Azimuth and polar angles

[
  0,
  45
]

SDK Support	Mapbox GL JS	Android SDK	iOS SDK
basic functionality	>= 3.9.0	>= 11.9.0	>= 11.9.0

flake-size

EXPERIMENTAL

Optional number between 0 and 5 inclusive. Defaults to 0.71. Supports smooth-rampinterpolateexpressions. opacityTransitionable.

Snow flake particle size. Correlates with individual particle screen size

SDK Support	Mapbox GL JS	Android SDK	iOS SDK
basic functionality	>= 3.9.0	>= 11.9.0	>= 11.9.0

intensity

EXPERIMENTAL

Optional number between 0 and 1 inclusive. Defaults to 1. Supports smooth-rampinterpolateexpressions. opacityTransitionable.

Snow particles movement factor. Controls the overall particles movement speed.

SDK Support	Mapbox GL JS	Android SDK	iOS SDK
basic functionality	>= 3.9.0	>= 11.9.0	>= 11.9.0

opacity

EXPERIMENTAL

Optional number between 0 and 1 inclusive. Defaults to 1. Supports smooth-rampinterpolateexpressions. opacityTransitionable.

Snow particles opacity.

SDK Support	Mapbox GL JS	Android SDK	iOS SDK
basic functionality	>= 3.9.0	>= 11.9.0	>= 11.9.0

vignette

EXPERIMENTAL

Optional number between 0 and 1 inclusive. Defaults to ["interpolate",["linear"],["zoom"],11,0,13,0.3]. Supports smooth-rampinterpolateexpressions. opacityTransitionable.

Snow vignette screen-space effect. Adds snow tint to screen corners

SDK Support	Mapbox GL JS	Android SDK	iOS SDK
basic functionality	>= 3.9.0	>= 11.9.0	>= 11.9.0

vignette-color

EXPERIMENTAL

Optional color . Defaults to "#ffffff". Supports smooth-rampinterpolateexpressions. opacityTransitionable.

Snow vignette screen-space corners tint color.

SDK Support	Mapbox GL JS	Android SDK	iOS SDK
basic functionality	>= 3.9.0	>= 11.9.0	>= 11.9.0

このpageは役に立ちましたか？