> For the complete documentation index, see [llms.txt](https://docs.jmapcloud.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.jmapcloud.io/en/jmap-cloud-portal/user-guide-for-jmap-cloud-portal/configuring-project-data/configuring-a-layer/styles.md). # Styles A layer's style defines how features are visually represented on the map. This representation can be uniform for all features or vary based on an attribute's values or the visualization scale. Styles are defined through a set of rules, enabling precise and flexible representation of layer data. Each layer can have multiple styles. For example, a layer can have one style for zoom levels above 10 and another for zoom levels at or below that threshold. It can also have a style that colors polygons representing city districts according to their crime rate. You can enable or disable configured styles to determine whether they should appear by default in JMap NG applications. The **Styles** section, accessible by clicking

, groups the tools needed to configure a layer's styles. Each layer has a default style of type **Single symbol**, which you can modify.

#	Description
1	Click the + icon to add a style. Three style types are available: Single symbol, Unique values, Classification. Details are provided in the following sections. The last style you add appears at the top of the section. The layer has a default style of type Single symbol, which you can modify.
2	Each style has: a name; and an interface containing the style parameters, which can be collapsed and expanded using the arrows.
3	The parameters that define the style vary depending on the style type and the type of feature being represented (point, line, polygon, text, raster data).

## Name and Visibility Parameters The style has a default name that you can edit by clicking

. This icon

allows you to enable or disable the display of the style on the Studio map. When enabled, this style is displayed by default in JMap NG. The visibility icon

allows you to enable or disable the initial visibility settings of the style in the project. Click

to delete the style. ## Single Symbol Style This style type applies the same symbology to all features, with possible variation by scale. It is the only style applicable to raster data. ### **Scales and Zoom Levels** Select the zoom level range within which the style will appear in JMap NG applications. Zoom levels range from 0 to 23, where 0 corresponds to a global view (the entire planet) and 23 to a very detailed view (e.g., part of a building). **To define a zoom level range using Scales:** 1. Hover over the values to display the **+** icons. 2. Click a **+** to add an intermediate point (e.g., 0.0 → 11.5 → 23.0). 3. Adjust the intermediate point value by dragging the handle or modifying the value in the corresponding field. 4. To add more points, repeat the operation. 5. To remove a range, click

next to the point. **To define a zoom level range:** drag the handles on the bar or enter the values in the fields. ### **Opacity** Raster data sources only. Allows you to define the opacity level of the image for each scale interval you have defined. ### **Symbol** This section allows you to configure the symbols representing features, for each scale interval if needed. The available options vary depending on the geometry type (point, line, polygon) and are detailed in the [Vector Feature Symbology](#vector-feature-symbology) section. ## Unique Values Style This style type represents features with different symbology for each unique value of an attribute. A dropdown menu allows you to select the attribute to use. It can be text, date, or numeric, with a maximum of 500 distinct values. {% hint style="info" %} The attribute must be enabled in the [Properties](/en/jmap-cloud-portal/user-guide-for-jmap-cloud-portal/configuring-project-data/configuring-a-layer/properties.md) section to be available. {% endhint %} ### **Zoom Levels** Select the zoom level range within which the style will appear in JMap NG applications. You can drag the handles on the bar or enter the values in the fields. ### **Conditions** Expand this section to view and configure the different conditions (unique values). * Click

to choose an automatic color palette (diverging, qualitative, monochrome, etc.). **Palettes are only available for 12 unique values or fewer.** * Click the arrow of a condition to configure its symbology. * Click

to edit the name displayed in the legend. * Click

to remove a condition without affecting the others. ## Classification Style This style type represents features grouped into classes based on value ranges of the selected attribute. The attribute must be of numeric type (double or integer). ### **Attribute** A dropdown menu allows you to select the attribute to use. Only numeric attributes are available. {% hint style="info" %} The attribute must be enabled in the [Properties](/en/jmap-cloud-portal/user-guide-for-jmap-cloud-portal/configuring-project-data/configuring-a-layer/properties.md) section to be available. {% endhint %} ### **Number of Classes** Select the number of classes for the style. The value is limited by the number of unique values in the selected attribute. ### **Classification Method** Select the method used to assign features to classes. The available methods for calculating numeric class boundaries are: * **Equal intervals**: classes are of equal size, taking into account the minimum and maximum values of the attribute (e.g., 0–10, 11–20, 21–30). Some classes may have few features while others have many. * **Quantiles**: classes contain an equal number of features. * **Natural breaks (Jenks)**: classes are defined based on discontinuities in attribute values, resulting in natural groupings. This method produces classes that are more homogeneous internally and more different from other classes. * **Standard deviation**: classes are defined based on standard deviations of the data (plus or minus one or two standard deviations). * **Custom**: you define the classes. * You can modify the boundaries of each class. Adjacent class boundaries adjust automatically to ensure class continuity. * The first and last classes can have open ends — that is, no minimum boundary (e.g., <0) or no maximum boundary (e.g., >1000). To do this, uncheck the box adjacent to the minimum or maximum boundary of the first or last class. ### **Classes** The classes configured based on the number of classes and the classification method are displayed in this section. * Click the palette icon to choose an automatic color palette (diverging, qualitative, monochrome, etc.). You cannot modify the color or pattern of individual classes. * Click

to round the interval boundaries for class configuration. * Click

to edit the class name. By default, 5 equal-interval classes are displayed with unrounded values. Class names reflect the interval values. ## Vector Feature Symbology The components of the **Symbol** section vary depending on the layer's geometry type. ### Points Point symbols can be composed of multiple stacked icons. * Click **+** to add an icon. * Click

to remove one. Each icon opens a tab with its parameters.

Parameter	Description
Icon	The dropdown menu allows you to select the vector icon.
Color	Select the icon color. Multiple methods are available: color field, color bar, RGB and HEX codes.
Opacity	Specify the opacity level of the icon color.
Size	Specify the icon size. A value of 1 corresponds to the icon's original size.
Rotation (°)	Specify the rotation (in degrees) to apply to the icon.
X and Y offset	Adjust the symbol's origin point by offsetting the symbol along X and Y by the specified values. The origin point corresponds to the precise coordinate of the point feature.

### Lines Lines can be enhanced with arrows indicating a direction. This is useful for showing the direction of a flow (water or road traffic, for example). Line symbols can include multiple stacked line styles. #### **Arrows** All line feature styles allow you to add arrows drawn at the center of the line symbol. Each line has a single arrow. Lines that cross two tiles may have two arrows. * Select the arrow type to add: * **None** * **Fixed direction**: all arrows have the same direction. You must specify the direction: * **Forward**: arrows point toward the end of the line. * **Backward**: arrows point toward the beginning of the line. * **Variable direction**: the arrow direction is determined by an attribute value. * Select the attribute. * Select the attribute value that indicates the forward direction. * Select the attribute value that indicates the backward direction. * Check **Show arrows** to enable their display. * Configure the arrow appearance: color, thickness, opacity, size, and dashed pattern. #### **Line styles** To configure line appearance: * Click **+** to add a line style. * Click

to remove one. Each style opens a tab with its parameters.

Parameter	Description
Color	Select the line color. Multiple methods are available: color field, color bar, RGB and HEX codes.
Opacity	Specify the line opacity level.
Line style	Click the icon to specify the line style, which consists of: line end cap; line join; and dashes. Click + to specify whether the line is dashed and to define the dash size and spacing between dashes. You can add multiple dash sizes and spacings, which will be drawn one after another.
Thickness	Specify the line thickness.

### Polygons

Parameter	Description
Fill	Select the fill color. Multiple methods are available: color field, color bar, RGB and HEX codes.
Opacity	Specify the fill color opacity level.
Border	Select the border color. Multiple methods are available: color field, color bar, RGB and HEX codes.
Border opacity	Specify the border color opacity level.
Thickness	Specify the border thickness.
Dashes	Click + to make the border dashed and specify the dash size and spacing between dashes.

### Text Annotations

Parameter	Description
Font	Select the text font.
Bold	Select this option to use bold text.
Italic	Select this option to use italic text.
Color	Select the text color. Multiple methods are available: color field, color bar, RGB and HEX codes.
Outline	Click the icon to enable the outline and select its color. Multiple methods are available: color field, color bar, RGB and HEX codes.
Opacity	Specify the text opacity level.