jungle-gif

50,000 maploads free every month. Get started now!

Layers

Layer is defined as the representation of data. It controls the map's visualization,without layers data will not be visible.

Layers contains all the layers avialable in the style JSON. The type property defines the type of layer and must have one of the following:

  • background

  • fill

  • line

  • symbol

  • raster

  • circle

  • fill-extrusion

  • heatmap

  • hillshade

*Note : Except for the type background all layers need a need a source as they get data from a source.

id

Required string

It is a unique identifier of the layer name.

paint

Optional object

Paint includes properties of background,fill,line,symbol,raster,fill-extrusion,circle,heatmap,hillshade.

source

Optional string

It defines the source to be used in the layer.It is mandatory for all layers except background.

source-layer

Optional string

It is used in the vector tile source.It is restricted to all other sources.

Layout properties

They define how data of the layer is passed to the GPU and they are enforced early in the rendering process.

Paint properties

Background

background-color

Optional paint

It defines the background color and its default value is "#000000".

background-opacity

Optional paint

It ranges between 0 and 1 and its default value is 1.

visibility

Optional layout

Its value is either "visible" or "none". It is responsible for whether the layer should be visible or not. Its default value is "visible".

Fill

fill-antialias

Optional paint

Whether or not the fill should be antialiased. Defaults to true.

fill-color

Optional paint

It defines the color of the filled part of the layer. and its default value is "#000000". The color value can be in rgba format.

fill-opacity

Optional paint

It ranges between 0 and 1 and its default value is 1. It defines the opacity of the filled layer.

Line

line-blur

Optional paint

Its value is 0 or greater than 0 and measured in pixels.

line-cap

Optional layout

It is a layout property and have the following values:

  • "butt" : A cap with a squared-off end which is drawn to the exact endpoint of the line.

  • "round" : A cap with a rounded end which is drawn beyond the endpoint of the line at a radius of one-half of the line's width and centered on the endpoint of the line.

  • "square" : A cap with a squared-off end which is drawn beyond the endpoint of the line at a distance of one-half of the line's width.

line-color

Optional paint

It defines the line color and its default value is "#000000".

line-dasharray

Optional paint

It consists of array of numbers 0 or greater than 0 and measured in widths.It defines the length of the dashes and gaps which ultimately form the dashed pattern.We can convert the length into pixels by multiplying the length with current width.Line pattern disable the line-dasharray.

line-gap-width

Optional paint

Its value can be 0 or greater than 0 and measured in pixels. It draws a line away from the actual path denoting the width of the inner gap.

line-join

Optional paint

It is a layout property and have the following values:

  • "bevel" : A join with a squared-off end which is drawn beyond the endpoint of the line at a distance of one-half of the line's width.

  • "round" : A join with a rounded end which is drawn beyond the endpoint of the line at a radius of one-half of the line's width and centered on the endpoint of the line.

  • "miter" : A join with a sharp, angled corner which is drawn with the outer sides beyond the endpoint of the path until they meet.

line-opacity

Optional paint

It ranges between 0 and 1 and its default value is 1.

line-width

Optional paint

Its value can be 0 or greater than 0 and measured in pixels. It defines the thickness of the stroke.

Circle
circle-blur

Optional paint

Its value is 0 or greater than 0 and measured in pixels.Value 1 will make the centerpoint at its full opacity.

circle-color

Optional paint

It defines the circle color and its default value is "#000000".

circle-opacity

Optional paint

It ranges between 0 and 1 and its default value is 1.

circle-radius

Optional paint

It defines the radius of the circle and its value is 0 or greater than 0 .Default is 5.

circle-stroke-color

Optional paint

It defines the stroke color of the circle and its default value is "#000000".

circle-stroke-color

Optional paint

It defines the stroke color of the circle and its default value is "#000000".

circle-stroke-opacity

Optional paint

It ranges between 0 and 1 and its default value is 1.Default value is 1.

circle-stroke-width

Optional paint

It is the width of the circle stroke and is value is 0 or greater than 0(measured in pixels).Default value is 0.

Let's find a way together

Get in touch to know about our Pricing Plans

Contact Us