diff --git a/blazor/maps/markers.md b/blazor/maps/markers.md index 9496c10893..a8db88585a 100644 --- a/blazor/maps/markers.md +++ b/blazor/maps/markers.md @@ -696,6 +696,17 @@ Marker clustering can be enabled for each marker group in the map by using the [ N> When the `MapsMarkerClusterSettings` tag is enabled for a specific marker group, the `MapsMarkerClusterSettings` tag within the layers becomes ineffective. +**Detailed Use Case scenario:** + +* **Context**: In the below example, have three marker groups—France, India, and the USA. Each country contains many locations spread across different states. Displaying every location marker at the world level makes the map cluttered and hard to read. + +* **What clustering does**: +At the world zoom level, markers that are geographically close are clustered into a single symbol per region (e.g., France, India, the USA). The cluster icon can display the number of locations it represents. As the zoom level increases, a country-level cluster splits into smaller clusters based on proximity, and continued zooming reveals individual markers. For example, France splits into clusters around Paris and Normandy, and further zooming shows individual points such as the Eiffel Tower, the Louvre, and Notre‑Dame. The same behavior applies to India (e.g., Rajasthan, Uttar Pradesh) and the USA (e.g., Arizona, Nevada, Tennessee). +* **Manual expansion**: +If [AllowClusterExpand](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsMarkerClusterSettings.html#Syncfusion_Blazor_Maps_MapsMarkerClusterSettings_AllowClusterExpand) property is set to **true**, a user can click a cluster to expand it immediately and view its child markers without additional zooming. This is useful on touch devices or when you want quick access to the underlying points. +* **Per‑group customization**: +Each marker group (France/India/USA) can have its own `MapsMarkerClusterSettings`—different cluster icons, colors, sizes, and label styles—so clusters are visually distinct by group. + ```cshtml @using Syncfusion.Blazor.Maps @@ -816,4 +827,4 @@ Tooltip is used to display more information about a marker on mouse over or touc ## See also * [Add different types of markers](how-to/add-different-types-of-markers) -* [Use ObservableCollection for Marker Updates](https://support.syncfusion.com/kb/article/21355/how-to-use-observablecollection-for-marker-updates-in-blazor-maps) \ No newline at end of file +* [Use ObservableCollection for Marker Updates](https://support.syncfusion.com/kb/article/21355/how-to-use-observablecollection-for-marker-updates-in-blazor-maps) diff --git a/blazor/maps/user-interactions.md b/blazor/maps/user-interactions.md index 030917aa4d..26183cd2a9 100644 --- a/blazor/maps/user-interactions.md +++ b/blazor/maps/user-interactions.md @@ -11,7 +11,16 @@ documentation: ug ## Zooming -The zooming feature is used to zoom in and out of Maps to show in-depth information. It is controlled by the [ZoomFactor](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomSettings.html#Syncfusion_Blazor_Maps_MapsZoomSettings_ZoomFactor) property of the [MapsZoomSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomSettings.html) class. The [ZoomFactor](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomSettings.html#Syncfusion_Blazor_Maps_MapsZoomSettings_ZoomFactor) is increased or decreased dynamically based on zoom in and out interaction. +The zooming feature is used to zoom in and out of Maps to show in-depth information. It is controlled by the [ZoomFactor](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomSettings.html#Syncfusion_Blazor_Maps_MapsZoomSettings_ZoomFactor) property of the [MapsZoomSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomSettings.html) class. The [ZoomFactor](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomSettings.html#Syncfusion_Blazor_Maps_MapsZoomSettings_ZoomFactor) is increased or decreased dynamically based on zoom in and out interaction. [ZoomFactor](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomSettings.html#Syncfusion_Blazor_Maps_MapsZoomSettings_ZoomFactor) is linear. It represents a magnification multiplier relative to the initial “fit to viewport” view. Increasing the value linearly magnifies the map; decreasing it zooms out. Fractional values are allowed. + +**How the map renders at the default:** + +By default, [ZoomFactor](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomSettings.html#Syncfusion_Blazor_Maps_MapsZoomSettings_ZoomFactor) is 1. The map automatically fits the layer’s bounds into the available map area. You see the whole world or the whole shape layer centered and sized to the component. + +**What happens when you change ZoomFactor:** + +* **Zoom in**: Increasing ZoomFactor enlarges the content around the current center. Example: going from 1 to 2 approximately doubles the scale. +* **Zoom out**: Decreasing ZoomFactor reduces the scale, showing a larger area. Enable zooming