[skip-ci] Update vector styling docs for 7.6 UI changes and new features (#55087)
* Quantitative data driven styling * quantitative styling * clean up * clean up * review feedback
BIN
docs/maps/images/extended_stats_config.png
Normal file
After Width: | Height: | Size: 74 KiB |
BIN
docs/maps/images/gear_icon.png
Normal file
After Width: | Height: | Size: 4.3 KiB |
Before Width: | Height: | Size: 665 B |
BIN
docs/maps/images/quantitative_data_driven_styling.png
Normal file
After Width: | Height: | Size: 548 KiB |
Before Width: | Height: | Size: 3.8 MiB After Width: | Height: | Size: 522 KiB |
Before Width: | Height: | Size: 3.5 MiB After Width: | Height: | Size: 990 KiB |
Before Width: | Height: | Size: 3.5 MiB After Width: | Height: | Size: 1,014 KiB |
|
@ -5,6 +5,7 @@
|
|||
When styling a vector layer, you can customize your data by property, such as size and color.
|
||||
For each property, you can specify whether to use a constant or data driven value for the style.
|
||||
|
||||
|
||||
[float]
|
||||
[[maps-vector-style-static]]
|
||||
==== Static styling
|
||||
|
@ -17,24 +18,13 @@ The *kibana_sample_data_logs* layer uses static styling for all properties.
|
|||
[role="screenshot"]
|
||||
image::maps/images/vector_style_static.png[]
|
||||
|
||||
|
||||
[float]
|
||||
[[maps-vector-style-data-driven]]
|
||||
==== Data driven styling
|
||||
|
||||
Use data driven styling to symbolize features from a range of numeric property values.
|
||||
To enable data driven styling, click image:maps/images/gs_link_icon.png[] next to the property.
|
||||
This button is only available when vector features contain numeric properties.
|
||||
|
||||
When the property value is undefined for a feature:
|
||||
|
||||
* *Fill color* and *Border color* are set to transparent and are not visible.
|
||||
* *Border width* and *Symbol size* are set to the minimum size.
|
||||
* *Symbol orientation* is set to 0.
|
||||
|
||||
When the minimum and maximum are the same and there is no range:
|
||||
|
||||
* *Fill color* and *Border color* are set to last color in the color ramp.
|
||||
* *Border width* and *Symbol size* are set to the maximum size.
|
||||
Use data driven styling to symbolize features by property values.
|
||||
To enable data driven styling for a style property, change the selected value from *Fixed* or *Solid* to *By value*.
|
||||
|
||||
The image below shows an example of data driven styling using the <<add-sample-data, Kibana sample web logs>> data set.
|
||||
The *kibana_sample_data_logs* layer uses data driven styling for fill color and symbol size style properties.
|
||||
|
@ -49,6 +39,55 @@ Smaller circles symbolize documents with smaller payloads, and larger circles sy
|
|||
image::maps/images/vector_style_dynamic.png[]
|
||||
|
||||
|
||||
[float]
|
||||
[[maps-vector-style-quantitative-data-driven]]
|
||||
==== Quantitative data driven styling
|
||||
|
||||
Quantitative data driven styling symbolizes features from a range of numeric property values.
|
||||
|
||||
To ensure symbols are consistent as you pan, zoom, and filter the map, quantitative data driven styling uses {ref}/search-aggregations-metrics-extendedstats-aggregation.html[extended_stats aggregation] to retrieve statistical metadata.
|
||||
|
||||
Click the gear icon image:maps/images/gear_icon.png[] to configure extended_stats. Set *Sigma* to a smaller value to minimize outliers by moving the range minimum and maximum closer to the average. Clear the *Calculate range from indices* checkbox to turn off the extended_stats aggregation request.
|
||||
|
||||
NOTE: When the *Calculate range from indices* checkbox is cleared, symbols might be inconsistent as users pan, zoom, and filter the map. Without extended_stats, the range is calulated with data from the local layer. The range is recalulcated when layer data changes.
|
||||
|
||||
[role="screenshot"]
|
||||
image::maps/images/extended_stats_config.png[]
|
||||
|
||||
When the property value is undefined for a feature:
|
||||
|
||||
* *Fill color* and *Border color* are set to transparent and are not visible.
|
||||
* *Border width* and *Symbol size* are set to the minimum size.
|
||||
* *Symbol orientation* is set to 0.
|
||||
|
||||
When the symbol range minimum and maximum are the same and there is no range:
|
||||
|
||||
* *Fill color* and *Border color* are set to last color in the color ramp.
|
||||
* *Border width* and *Symbol size* are set to the maximum size.
|
||||
|
||||
|
||||
[float]
|
||||
[[maps-vector-style-qualitative-data-driven]]
|
||||
==== Qualitative data driven styling
|
||||
|
||||
Qualitative data driven styling symbolizes non-numeric properties, such as strings and IP addresses, by category.
|
||||
|
||||
Qualitative data driven styling is available for the following styling properties:
|
||||
|
||||
* *Fill color*
|
||||
* *Border color*
|
||||
* *Label color*
|
||||
* *Label border color*
|
||||
|
||||
Qualitative data driven styling uses a {ref}/search-aggregations-bucket-terms-aggregation.html[terms aggregation] to retrieve the top nine categories for the property. Feature values within the top categories are assigned a unique color. Feature values outside of the top categories are grouped into the *Other* category. A feature is assigned the *Other* category when the property value is undefined.
|
||||
|
||||
The image below shows an example of quantitative data driven styling using the <<add-sample-data, Kibana sample web logs>> data set.
|
||||
The `machine.os.keyword` property determines the color of each symbol based on category.
|
||||
|
||||
[role="screenshot"]
|
||||
image::maps/images/quantitative_data_driven_styling.png[]
|
||||
|
||||
|
||||
[float]
|
||||
[[maps-vector-style-class]]
|
||||
==== Class styling
|
||||
|
|