Fog | Mapbox Style Spec | Mapbox Docs (original) (raw)

Search Style Specification

On this page

• color
• high-color
• horizon-blend
• range
• space-color
• star-intensity
• vertical-range

Additional Developer Resources

A style's fog property is a global styling effect that can be used to create an atmospheric gradient, stars, and haze. These properties can increase realism or match a designer's aesthetic. Fog provides a visual cue to improves depth perception and can boost performance by reducing the number of tiles loaded in the distance.

Fog is supported only in globe and mercator projections.

color​

The color of the atmosphere region immediately below the horizon and within the range and above the horizon and within horizon-blend. Using opacity is recommended only for smoothly transitioning fog on/off as anything less than 100% opacity results in more tiles loaded and drawn.

high-color​

The color of the atmosphere region above the horizon, high-color extends further above the horizon than the color property and its spread can be controlled with horizon-blend. The opacity can be set to 0 to remove the high atmosphere color contribution.

horizon-blend​

Optional

number between 0 and 1 inclusive.

Defaults to ["interpolate",["linear"],["zoom"],4,0.2,7,0.1].

Supports

smooth-rampinterpolate

expressions.

opacityTransitionable.

Horizon blend applies a smooth fade from the color of the atmosphere to the color of space. A value of zero leaves a sharp transition from atmosphere to space. Increasing the value blends the color of atmosphere into increasingly high angles of the sky.

range​

The start and end distance range in which fog fades from fully transparent to fully opaque. The distance to the point at the center of the map is defined as zero, so that negative range values are closer to the camera, and positive values are farther away.

space-color​

Optional

color

.

Defaults to ["interpolate",["linear"],["zoom"],4,"#010b19",7,"#367ab9"].

Supports

smooth-rampinterpolate

expressions.

opacityTransitionable.

The color of the region above the horizon and after the end of the horizon-blend contribution. The opacity can be set to 0 to have a transparent background.

star-intensity​

Optional

number between 0 and 1 inclusive.

Defaults to ["interpolate",["linear"],["zoom"],5,0.35,6,0].

Supports

smooth-rampinterpolate

expressions.

opacityTransitionable.

A value controlling the star intensity where 0 will show no stars and 1 will show stars at their maximum intensity.

vertical-range​

An array of two number values, specifying the vertical range, measured in meters, over which the fog should gradually fade out. When both parameters are set to zero, the fog will be rendered without any vertical constraints.

Additional Developer Resources