[skip-ci] Update vector styling docs for 7.6 UI changes and new features (#55087) (#55202)

* Quantitative data driven styling

* quantitative styling

* clean up

* clean up

* review feedback

docs/maps/vector-style.asciidoc

@@ -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