Update User Guide - Visual Style Editor (#10028)

* new_image * add_10011_9572 * Apply suggestions from code review Co-authored-by: Tobia Di Pisa <[email protected]> * Update docs/user-guide/layer-settings.md Co-authored-by: Tobia Di Pisa <[email protected]> * Update docs/user-guide/layer-settings.md Here the user can add custom parameters that will be visible in the *Visual Style Editor*, above the *Color Palette* option. The *Custom Parameters* require an array of fields to be configured according to the available viewparams defined in the SQL View. Co-authored-by: Tobia Di Pisa <[email protected]> * Update docs/user-guide/layer-settings.md Co-authored-by: Tobia Di Pisa <[email protected]> * Update docs/user-guide/layer-settings.md Co-authored-by: Tobia Di Pisa <[email protected]> * Update docs/user-guide/layer-settings.md Co-authored-by: Tobia Di Pisa <[email protected]> * Update docs/user-guide/layer-settings.md Co-authored-by: Tobia Di Pisa <[email protected]> * Update docs/user-guide/layer-settings.md Co-authored-by: Tobia Di Pisa <[email protected]> * review-10028 * Update docs/user-guide/layer-settings.md Co-authored-by: Tobia Di Pisa <[email protected]> --------- Co-authored-by: Tobia Di Pisa <[email protected]>
geosolutions-it · Mar 18, 2024 · 6371e72 · 6371e72
1 parent 2daead9
commit 6371e72
Show file tree

Hide file tree

Showing 26 changed files with 34 additions and 2 deletions.
diff --git a/docs/user-guide/img/button/configute_lite_button.jpg b/docs/user-guide/img/button/configute_lite_button.jpg
diff --git a/docs/user-guide/img/layer-settings/3dtiles_style.jpg b/docs/user-guide/img/layer-settings/3dtiles_style.jpg
diff --git a/docs/user-guide/img/layer-settings/bring-to-front.jpg b/docs/user-guide/img/layer-settings/bring-to-front.jpg
diff --git a/docs/user-guide/img/layer-settings/classification_styl_panel.jpg b/docs/user-guide/img/layer-settings/classification_styl_panel.jpg
diff --git a/docs/user-guide/img/layer-settings/classification_style_ex.jpg b/docs/user-guide/img/layer-settings/classification_style_ex.jpg
diff --git a/docs/user-guide/img/layer-settings/classify_icon_style_panel.jpg b/docs/user-guide/img/layer-settings/classify_icon_style_panel.jpg
diff --git a/docs/user-guide/img/layer-settings/classify_mark_ex.jpg b/docs/user-guide/img/layer-settings/classify_mark_ex.jpg
diff --git a/docs/user-guide/img/layer-settings/classify_mark_panel.jpg b/docs/user-guide/img/layer-settings/classify_mark_panel.jpg
diff --git a/docs/user-guide/img/layer-settings/configure_popup.jpg b/docs/user-guide/img/layer-settings/configure_popup.jpg
diff --git a/docs/user-guide/img/layer-settings/ex_3dtiles_style.mp4 b/docs/user-guide/img/layer-settings/ex_3dtiles_style.mp4
diff --git a/docs/user-guide/img/layer-settings/ex_fill_style.mp4 b/docs/user-guide/img/layer-settings/ex_fill_style.mp4
diff --git a/docs/user-guide/img/layer-settings/ex_line_style.jpg b/docs/user-guide/img/layer-settings/ex_line_style.jpg
diff --git a/docs/user-guide/img/layer-settings/ex_text_style.mp4 b/docs/user-guide/img/layer-settings/ex_text_style.mp4
diff --git a/docs/user-guide/img/layer-settings/extrusion.jpg b/docs/user-guide/img/layer-settings/extrusion.jpg
diff --git a/docs/user-guide/img/layer-settings/filter_3dtiles_style.jpg b/docs/user-guide/img/layer-settings/filter_3dtiles_style.jpg
diff --git a/docs/user-guide/img/layer-settings/height-reference.jpg b/docs/user-guide/img/layer-settings/height-reference.jpg
diff --git a/docs/user-guide/img/layer-settings/icon_panel.jpg b/docs/user-guide/img/layer-settings/icon_panel.jpg
diff --git a/docs/user-guide/img/layer-settings/leader-line.jpg b/docs/user-guide/img/layer-settings/leader-line.jpg
diff --git a/docs/user-guide/img/layer-settings/line_panel.jpg b/docs/user-guide/img/layer-settings/line_panel.jpg
diff --git a/docs/user-guide/img/layer-settings/mark_panel.jpg b/docs/user-guide/img/layer-settings/mark_panel.jpg
diff --git a/docs/user-guide/img/layer-settings/mark_style_ex.jpg b/docs/user-guide/img/layer-settings/mark_style_ex.jpg
diff --git a/docs/user-guide/img/layer-settings/properties_style.jpg b/docs/user-guide/img/layer-settings/properties_style.jpg
diff --git a/docs/user-guide/img/layer-settings/property-value-example.mp4 b/docs/user-guide/img/layer-settings/property-value-example.mp4
diff --git a/docs/user-guide/img/layer-settings/text_panel.jpg b/docs/user-guide/img/layer-settings/text_panel.jpg
diff --git a/docs/user-guide/img/layer-settings/thematic-layer.mp4 b/docs/user-guide/img/layer-settings/thematic-layer.mp4
diff --git a/docs/user-guide/layer-settings.md b/docs/user-guide/layer-settings.md
@@ -306,7 +306,7 @@ The line rule is used to style linear features of the layer: clicking on the <im
 
 The editor can change the `Stroke color`, the `Stroke width`, the `Line style` (*continuous*, *dashed*, etc), the `Line cap` (*Butt*, *Round*, *Square*) and the `Line join` (*Bevel*, *Round*, *Miter*). An example can be the following one:
 
-<video class="ms-docimage" controls><source src="../img/layer-settings/ex_line_style.mp4"></video>
+<img src="../img/layer-settings/ex_line_style.jpg" class="ms-docimage"  style="max-width:500px;">
 
 #### Fill
 
@@ -350,6 +350,18 @@ It this case the editor is allowed to choose a `Color ramp` and the order (with
 
 <img src="../img/layer-settings/classification_style_ex.jpg" class="ms-docimage">
 
+!!!note
+    The *Classification style* method is available for **WMS**,  **WFS** and **Vector** layers. In case of **WMS** layers the *Classification style* can work only against GeoServer where the [SLD Service module](https://docs.geoserver.org/main/en/user/extensions/sldservice/index.html) need to be installed. In case of **WFS** and **Vector** layers, the same classification capabilities are entirely managed client.
+
+!!!note
+
+    From the *Classification style* options, it is also possible to manage **Custom Parameter** thought the <img src="../img/button/configute_lite_button.jpg" class="ms-docbutton"/> button. That's really useful to style [SQL Views](https://docs.geoserver.org/latest/en/user/data/database/sqlview.html) defined in GeoServer by using one of the available _viewparams_
+    <img src="../img/layer-settings/configure_popup.jpg" class="ms-docimage" style="max-width:400px;">
+
+    Here the user can add custom parameters that will be visible in the *Visual Style Editor*, above the *Color Palette* option. The *Custom Parameters* requires an array of fields to be configured according to the available viewparams defined in the SQL View. 
+
+    <video class="ms-docimage" controls><source src="../img/layer-settings/thematic-layer.mp4"></video>
+
 #### Pattern mark style
 
 With the *Pattern mark style* it is possible to represent *Line* or *Fill*  style rules with a mark by clicking on the <img src="../img/button/options_button.jpg" class="ms-docbutton"/> button and choosing the **Pattern mark style** options from the dropdown menu.
@@ -370,6 +382,22 @@ The style editor can configure the *Icon* as explained [here](#icon) along with
 
 <img src="../img/layer-settings/classify_icon_ex.jpg" class="ms-docimage">
 
+#### Style with property value
+
+[MapStore](https://mapstore.geosolutionsgroup.com/mapstore/#/) allows you to use a property of the layer feature as value for a symbolizer property. The *Property value* function is available for *Marker*, *Icon*, *Line*, *Fill*, *Text* and *3D model* by clicking on the <img src="../img/button/options_button.jpg" class="ms-docbutton"/> button of each symbolizer property supporting it.
+
+<img src="../img/layer-settings/properties_style.jpg" class="ms-docimage"  style="max-width:500px;">
+
+By default, **Constant value** is selected. If the user chooses **Property value**, a drop-down menu appears so that the desired layer attribute can be selected to use its values for the styling property.
+
+<video class="ms-docimage" controls><source src="../img/layer-settings/property-value-example.mp4"></video>
+
+!!!warning
+    As a *Property value* only attributes of type `string` or `number` are currently supported.
+
+!!!note
+    The *Style with property* method is available only for **WFS** and **Vector** layers.
+
 ### Styling on the 3D navigation
 
 Thanks to the new improvements made to the *Visual Style Editor* editor, when [3D Navigation](navigation-toolbar.md#3d-navigation) is enabled, the editor has the ability to customize the style of **3D Tiles** and **vector layers**.
@@ -418,7 +446,7 @@ From the *Visual Style Editor*, by clicking on <img src="../img/button/3D-model-
 
 Furthermore, for **WFS layers**, [MapStore](https://mapstore.geosolutionsgroup.com/mapstore/#/) adds some additional styling options in the *Visual Style Editor* such as:
 
-* **Bring to front** (available for Icon, Mark and 3D model symbolizers) to bring in front and so to make visible (if set to *true*) all features covered by 3D Tile layers and the Terrain layer (for this last case when the *depth test against terrain* option is enabled in Global Settings).
+* **Bring to front** (available for Icon, Mark and 3D model symbolizers) to bring in front and so to make visible (if enabled) all features covered by 3D Tile layers and the Terrain layer (for this last case when the *depth test against terrain* option is enabled in Global Settings).
 
 <img src="../img/layer-settings/bring-to-front.jpg" class="ms-docimage">
 
@@ -438,6 +466,10 @@ Furthermore, for **WFS layers**, [MapStore](https://mapstore.geosolutionsgroup.c
 
 <img src="../img/layer-settings/polygon-type.jpg" class="ms-docimage">
 
+* **Extrusion Height** (available for Line and Fill symbolizers) to configure the height value of the feature to be extruded. It is also possible to enable/disable the **Extrusion relative to geometry** (from the highest point of the feature geometry) and, only for the *Line* symbolizers, the user can customize the **Extrusion color** and the **Extrusion type**, choosing between `Wall`, `Circle` and `Square` options, for the extruded features.
+
+<img src="../img/layer-settings/extrusion.jpg" class="ms-docimage">
+
 ## Feature Info Form
 
 Through the last section of the layer settings panel, it is possible to decide the information format that appears querying a layer with the [Identify Tool](navigation-toolbar.md#identify-tool):