diff --git a/chart-sdk/uwp/Barcode/Barcode-Customization.md b/chart-sdk/uwp/Barcode/Barcode-Customization.md
index 96b126640..11e274058 100644
--- a/chart-sdk/uwp/Barcode/Barcode-Customization.md
+++ b/chart-sdk/uwp/Barcode/Barcode-Customization.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Barcode Customization in UWP Barcode control | Syncfusion
-description: Learn here all about Barcode Customization support in Syncfusion UWP Barcode (SfBarcode) control and more.
+title: Customization in UWP Barcode | Syncfusion®
+description: Customization in the WPF Barcode allows you to modify appearance, colors, sizing, labels, and styling to meet application requirements.
platform: chart-sdk
control: SfBarcode
documentation: ug
---
-# Barcode Customization in UWP Barcode (SfBarcode)
+# Customization in UWP Barcode
The color of the barcode can be customized by modifying the DarkBarBrush and LightBarBrush properties of the barcode control.
diff --git a/chart-sdk/uwp/Barcode/Getting-Started.md b/chart-sdk/uwp/Barcode/Getting-Started.md
index 264626f32..ea5a1b900 100644
--- a/chart-sdk/uwp/Barcode/Getting-Started.md
+++ b/chart-sdk/uwp/Barcode/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting Started with UWP Barcode control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP Barcode (SfBarcode) control, its elements and more details.
+title: Getting Started with UWP Barcode control | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Barcode control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfBarcode
documentation: ug
---
-# Getting Started with UWP Barcode (SfBarcode)
+# Getting Started with UWP Barcode
## Add barcode control to an application
diff --git a/chart-sdk/uwp/Barcode/Overview.md b/chart-sdk/uwp/Barcode/Overview.md
index 34c87de78..5e1341c15 100644
--- a/chart-sdk/uwp/Barcode/Overview.md
+++ b/chart-sdk/uwp/Barcode/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About UWP Barcode control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Barcode (SfBarcode) control, its elements and more details.
+title: About Syncfusion® UWP Barcode Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Barcode control, its features, capabilities, and more details.
platform: chart-sdk
control: SfBarcode
documentation: ug
---
-# UWP Barcode (SfBarcode) Overview
+# About Syncfusion® UWP Barcode Control
The Barcode control helps render barcodes in UWP desktop applications. The control can be integrated into any desktop application and makes it easy to encode text using the supported symbol types. The basic structure of a barcode consists of a leading and trailing quiet zone, a start pattern, one or more data characters, optionally one or two check characters, and a stop pattern.
diff --git a/chart-sdk/uwp/Barcode/Supported-Barcode-types.md b/chart-sdk/uwp/Barcode/Supported-Barcode-types.md
index 27f3caf0b..b88272c5c 100644
--- a/chart-sdk/uwp/Barcode/Supported-Barcode-types.md
+++ b/chart-sdk/uwp/Barcode/Supported-Barcode-types.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Supported Barcode types in UWP Barcode control | Syncfusion
-description: Learn here all about supported Barcode types in Syncfusion UWP Barcode (SfBarcode) control and more.
+title: Symbology Types in UWP Barcode | Syncfusion®
+description: Symbology Types in the UWP Barcode include various 1D and 2D symbologies for encoding and displaying data in barcode formats.
platform: chart-sdk
control: SfBarcode
documentation: ug
---
-# Supported Barcode types in UWP Barcode (SfBarcode)
+# Symbology Types in UWP Barcode
The following table contains the supported types and associated valid characters.
diff --git a/chart-sdk/uwp/Barcode/Symbology-Settings.md b/chart-sdk/uwp/Barcode/Symbology-Settings.md
index c841b09a4..56c3a81cd 100644
--- a/chart-sdk/uwp/Barcode/Symbology-Settings.md
+++ b/chart-sdk/uwp/Barcode/Symbology-Settings.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Symbology Settings in UWP Barcode control | Syncfusion
-description: Learn here all about Symbology Settings support in Syncfusion UWP Barcode (SfBarcode) control and more.
+title: Symbology Settings in UWP Barcode | Syncfusion®
+description: Symbology settings in the UWP Barcode allow you to configure barcode-specific encoding options and customize barcode generation.
platform: chart-sdk
control: SfBarcode
documentation: ug
---
-# Symbology Settings in UWP Barcode (SfBarcode)
+# Symbology Settings in UWP Barcode
Each Barcode symbol can be associated with optional settings that may affect that specific bar code. The code sample below shows the settings of a Code39 Barcode.
diff --git a/chart-sdk/uwp/HeatMap/ColorMapping.md b/chart-sdk/uwp/HeatMap/ColorMapping.md
index 579300262..63adb0baa 100644
--- a/chart-sdk/uwp/HeatMap/ColorMapping.md
+++ b/chart-sdk/uwp/HeatMap/ColorMapping.md
@@ -1,13 +1,13 @@
---
layout: post
-title: ColorMapping in UWP HeatMap (SfHeatMap) control | Syncfusion®
-description: How to configure colors codes for Syncfusion® Essential Studio® uwp HeatMap (SfHeatMap) control, its elements and more.
+title: Color Mapping in UWP HeatMap | Syncfusion®
+description: Color mapping in the UWP HeatMap configures color ranges for data values, enabling effective visualization and interpretation of data patterns.
platform: chart-sdk
control: SfHeatMap
documentation: ug
---
-# Color Mapping in UWP HeatMap (SfHeatMap) control
+# Color Mapping in UWP HeatMap
Color mapping is used to represent values with colors instead of displaying the actual numerical values. For example, when a HeatMap displays data ranging from 0 to 100. [ColorMapping](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.HeatMap.ColorMapping.html) defines colors for the minimum and maximum values, and intermediate values are represented with corresponding colors.
diff --git a/chart-sdk/uwp/HeatMap/Getting-Started.md b/chart-sdk/uwp/HeatMap/Getting-Started.md
index 2fe7f4e47..242ca434b 100644
--- a/chart-sdk/uwp/HeatMap/Getting-Started.md
+++ b/chart-sdk/uwp/HeatMap/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting started with Syncfusion® Essential® SfHeatMap for UWP.
-description: This section explain about how to integrate UWP HeatMap (SfHeatMap) into an application and enable its basic features with example.
+title: Getting Started with UWP HeatMap | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP HeatMap control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfHeatMap
documentation: ug
---
-# Getting Started with UWP HeatMap (SfHeatMap)
+# Getting Started with UWP HeatMap
## Creating heatmap for windows store app
diff --git a/chart-sdk/uwp/HeatMap/ItemsMapping.md b/chart-sdk/uwp/HeatMap/ItemsMapping.md
index 2ec6133ee..b081d8d3d 100644
--- a/chart-sdk/uwp/HeatMap/ItemsMapping.md
+++ b/chart-sdk/uwp/HeatMap/ItemsMapping.md
@@ -1,13 +1,13 @@
---
layout: post
-title: ItemsMapping in UWP HeatMap (SfHeatMap) control | Syncfusion®
-description: Learn here about ItemsMapping in Syncfusion® Essential Studio® UWP HeatMap (SfHeatMap) control, its elements and more.
+title: Items Mapping in UWP HeatMap | Syncfusion®
+description: Items mapping in the UWP HeatMap enables data fields to be mapped to rows, columns, and values for effective heat map visualization.
platform: chart-sdk
control: SfHeatMap
documentation: ug
---
-# Items Mapping in UWP HeatMap (SfHeatMap) control
+# Items Mapping in UWP HeatMap
External data can be mapped to a `HeatMap` using the [ItemsMapping](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.HeatMap.SfHeatMap.html#Syncfusion_UI_Xaml_HeatMap_SfHeatMap_ItemsMapping) property, which supports two types of data sources:
diff --git a/chart-sdk/uwp/HeatMap/Legend.md b/chart-sdk/uwp/HeatMap/Legend.md
index 75cce663d..0bb56eceb 100644
--- a/chart-sdk/uwp/HeatMap/Legend.md
+++ b/chart-sdk/uwp/HeatMap/Legend.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Legend in UWP HeatMap (SfHeatMap) control | Syncfusion®
-description: How to create and configure legend for Syncfusion® Essential Studio® UWP HeatMap (SfHeatMap) control, its elements and more.
+title: Legend in UWP HeatMap | Syncfusion®
+description: Legend in the UWP HeatMap identifies data value ranges through color indicators, helping users interpret heat map data effectively.
platform: chart-sdk
control: SfHeatMap
documentation: ug
---
-# Legend in UWP HeatMap (SfHeatMap) control
+# Legend in UWP HeatMap
Legend is a control used to summarize the color ranges in a HeatMap, providing a visual guide for mapping values to their corresponding colors.
diff --git a/chart-sdk/uwp/HeatMap/Overview.md b/chart-sdk/uwp/HeatMap/Overview.md
index f7c9fbc6e..ffd6e293a 100644
--- a/chart-sdk/uwp/HeatMap/Overview.md
+++ b/chart-sdk/uwp/HeatMap/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Overview of UWP HeatMap (SfHeatMap) Control | Syncfusion®
-description: Learn here all about overview of Syncfusion® Essential Studio® UWP HeatMap (SfHeatMap) control, its elements, and more.
+title: About Syncfusion® UWP HeatMap Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP HeatMap control, its features, capabilities, and more details.
platform: chart-sdk
control: SfHeatMap
documentation: ug
---
-# Overview of UWP HeatMap (SfHeatMap)
+# About Syncfusion® UWP HeatMap Control
[Essential® HeatMap UWP](https://www.syncfusion.com/uwp-ui-controls/heatmap) visualizes tabular data by representing values with gradient colors instead of numeric text. Lower and higher values are displayed using different colors with varying gradients.
diff --git a/chart-sdk/uwp/Map/Annotations.md b/chart-sdk/uwp/Map/Annotations.md
index c095aff7b..11d70d1fc 100644
--- a/chart-sdk/uwp/Map/Annotations.md
+++ b/chart-sdk/uwp/Map/Annotations.md
@@ -1,101 +1,96 @@
---
layout: post
-title: Annotations in UWP Map control | Syncfusion
-description: Learn here all about Annotations support in Syncfusion Essential UWP Map (SfMaps) control, its elements, and more.
+title: Annotations in UWP Maps | Syncfusion®
+description: Annotations in the UWP Maps allow you to add custom text, shapes, and UI elements to provide additional map information.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Annotations in UWP Map (SfMaps)
+# Annotations in UWP Maps
-`Annotations` are notes used to leave some message on the map. In SfMap, annotations are denoted by the `MapAnnotations`. MapAnnotation has two major parts:
+`Annotations` are notes used to leave some message on the map. In the [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html), annotations are denoted by the [`MapAnnotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html). `MapAnnotations` has two major parts:
-* AnnotationLabel
-* AnnotationSymbol
+* [`AnnotationLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html#Syncfusion_UI_Xaml_Maps_MapAnnotations_AnnotationLabel) : A text that shows some information in text format.
-`AnnotationLabel` is a “Text” that shows some information in the text format.
-
-`AnnotationSymbol` is a “VisualObject” that shows a note symbolically.
+* [`AnnotationSymbol`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html#Syncfusion_UI_Xaml_Maps_MapAnnotations_AnnotationSymbol) : A visual object that shows a note symbolically.
## Customize AnnotationLabel
-AnnotationLabel’s appearance is customized by the following properties:
+The appearance of `AnnotationLabel` is customized by the following properties:
-* `AnnotationLabelForeground`: Gets or sets the foreground color of the annotation label.
-* `AnnotationLabelFontStyle`: Gets or sets the font style of the annotation label.
-* `AnnotationLabelBackground`: Gets or sets the background color of the annotation label.
-* `AnnotationLabelFontFamily`: Gets or sets the font family for the annotation label.
-* `AnnotationLabelFontSize`: Gets or sets the annotation label font size.
+* [`AnnotationLabelForeground`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html#Syncfusion_UI_Xaml_Maps_MapAnnotations_AnnotationLabelForeground): Gets or sets the foreground color of the annotation label.
+* [`AnnotationLabelFontStyle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html#Syncfusion_UI_Xaml_Maps_MapAnnotations_AnnotationLabelFontStyle): Gets or sets the font style of the annotation label.
+* [`AnnotationLabelBackground`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html#Syncfusion_UI_Xaml_Maps_MapAnnotations_AnnotationLabelBackground): Gets or sets the background color of the annotation label.
+* [`AnnotationLabelFontFamily`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html#Syncfusion_UI_Xaml_Maps_MapAnnotations_AnnotationLabelFontFamily): Gets or sets the font family for the annotation label.
+* [`AnnotationLabelFontSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html#Syncfusion_UI_Xaml_Maps_MapAnnotations_AnnotationLabelFontSize): Gets or sets the annotation label font size.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
-
+
## Positioning a MapAnnotation
-`MapAnnotation` can be positioned anywhere on the map based on latitude and longitude. MapAnnotation has two properties called `Latitude` and `Longitude` of string type used to set latitude and longitude co-ordinates of the MapAnnotation.
+`MapAnnotation` can be positioned anywhere on the map based on latitude and longitude. `MapAnnotations` has two properties called [`Latitude`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html#Syncfusion_UI_Xaml_Maps_MapAnnotations_Latitude) and [`Longitude`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapAnnotations.html#Syncfusion_UI_Xaml_Maps_MapAnnotations_Longitude) of double type, used to set the latitude and longitude coordinates of the `MapAnnotations`.
### Customizing the Annotation Template
-The default appearance of the annotation can be customized by using the `AnnotationTemplate` property. The annotation template property is available in the ShapeFileLayer.
+The default appearance of the annotation can be customized by using the [`AnnotationTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_AnnotationTemplate) property. The `AnnotationTemplate` property is available in the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html).
#### About the AnnotationTemplate Property
-AnnotationTemplate is a `DataTemplate` type, used to customize or override the default template of MapAnnotations.
+`AnnotationTemplate` is a `DataTemplate` type, used to customize or override the default template of `MapAnnotations`.
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
-
+
diff --git a/chart-sdk/uwp/Map/Basic-KML-Format.md b/chart-sdk/uwp/Map/Basic-KML-Format.md
index 721db907a..c557f9914 100644
--- a/chart-sdk/uwp/Map/Basic-KML-Format.md
+++ b/chart-sdk/uwp/Map/Basic-KML-Format.md
@@ -1,17 +1,17 @@
---
layout: post
-title: Basic KML Format in UWP Map control | Syncfusion
-description: Learn here all about Basic KML Format support in Syncfusion UWP Map (SfMaps) control and more.
+title: KML Format in UWP Maps | Syncfusion®
+description: KML format in the UWP Maps enables geographic data from KML files to be loaded and visualized for location-based mapping applications.
platform: chart-sdk
control: SfMap
documentation: ug
---
-# Basic KML Format in UWP Map (SfMaps)
+# KML Format in UWP Maps
KML is a file format used for rendering geographical data. It uses a tag-based structure with nested elements and attributes. KML is based on the XML standard, and all tags of a KML file are case-sensitive.
-Currently, the SfMaps control supports the following KML elements:
+Currently, the [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) control supports the following KML elements:
* Place mark
* Point
diff --git a/chart-sdk/uwp/Map/Bubbles.md b/chart-sdk/uwp/Map/Bubbles.md
index d4d8fb767..13562e0ff 100644
--- a/chart-sdk/uwp/Map/Bubbles.md
+++ b/chart-sdk/uwp/Map/Bubbles.md
@@ -1,19 +1,19 @@
---
layout: post
-title: Bubbles in UWP Map control | Syncfusion
-description: Learn here all about Bubbles support in Syncfusion UWP Map (SfMaps) control and more.
+title: Bubbles in UWP Maps | Syncfusion®
+description: Bubbles in the UWP Maps visualize location-based data using proportional markers, enabling comparison of values across geographic regions.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Bubbles in UWP Map (SfMaps)
+# Bubble Markers in UWP Maps
-`Bubbles` in the Maps control represent the under-bound data values of the map. Bubbles are scattered throughout map shapes that contain bound values.
+`Bubbles` in the Maps control represent the underlying data values of the map. Bubbles are scattered throughout the map shapes that contain bound values.
-Bubbles are included when data binding is set as mentioned above and the `BubbleMarkerSetting` is set.
+Bubbles are included when data binding is set as mentioned above and the [`BubbleMarkerSetting`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_BubbleMarkerSetting) is set.
-The following properties are available in the BubbleMarkerSetting:
+The following properties are available in the [`BubbleMarkerSetting`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html):
@@ -52,32 +52,31 @@ Gets or sets the tree map colors.
## Adding Bubbles to a Map
-To add bubbles to a map, `BubbleMarkerSetting` has to be added to the `ShapeFileLayer`. Set the `AutoFillColor` as true and set the `Fill` property. Create the `Model` and `ViewModel` as illustrated in the [Data Binding](/winrt/Maps/Data-Binding "Data Binding") topic and add the following code. Also set the `MaxSize`, `MinSize`, and `ValuePath` properties as illustrated in the following code example.
+To add bubbles to a map, [`BubbleMarkerSetting`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html) has to be added to the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html). Set the [`AutoFillColor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html#Syncfusion_UI_Xaml_Maps_BubbleMarkerSetting_AutoFillColor) as true and set the [`Fill`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html#Syncfusion_UI_Xaml_Maps_BubbleMarkerSetting_Fill) property. Create the `Model` and `ViewModel` as illustrated in the [Data Binding](/winrt/Maps/Data-Binding "Data Binding") topic and add the following code. Also set the [`MaxSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html#Syncfusion_UI_Xaml_Maps_BubbleMarkerSetting_MaxSize), [`MinSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html#Syncfusion_UI_Xaml_Maps_BubbleMarkerSetting_MinSize), and [`ValuePath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html#Syncfusion_UI_Xaml_Maps_BubbleMarkerSetting_ValuePath) properties as illustrated in the following code example.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
-{% endhighlight %}
+{% endhighlight %}
-
+
## Customizing Bubble Symbol
-Bubble symbol can be modified using built-in symbols like circle, rectangle, diamond, triangle, trapezoid, star, pentagon, and pushpin available in the `BubbleType` enum property. Also, bubbles can be customized by setting the CustomTemplate of the BubbleMarkerSetting.
+The bubble symbol can be modified using built-in symbols like circle, rectangle, diamond, triangle, trapezoid, star, pentagon, and pushpin available in the [`BubbleType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleType.html) enum property. Also, bubbles can be customized by setting the [`CustomTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html#Syncfusion_UI_Xaml_Maps_BubbleMarkerSetting_CustomTemplate) of the `BubbleMarkerSetting`.
-Gets or sets the template to customize the bubble.> BubbleType should be set as “Custom” to show a customized bubble shape.
+Gets or sets the template to customize the bubble. `BubbleType` should be set as `Custom` to show a customized bubble shape.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
-
+
## Range Color Mapping
-`RangeColorMapping` is one of the features used to differentiate the bubble fill, based on its under-bound value and color ranges. It contains the following properties:
+[`RangeColorMapping`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.RangeColorMapping.html) is one of the features used to differentiate the bubble fill, based on its underlying value and color ranges. It contains the following properties:
-The fill color of a particular bubble fill can be determined by its under-bound value and the color range. For example, consider the following color ranges:
+The fill color of a particular bubble can be determined by its underlying value and the color range. For example, consider the following color ranges:
{% highlight html %}
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-{% endhighlight %}
+{% endhighlight %}
-When the under-bound object value is 22789702, then the fill color of the corresponding bubble is set to “#7FEB737C”. As mentioned earlier, the under-bound value of the bubble is set through the “ValuePath” in the BubbleMarkerSetting.
+When the underlying object value is 22789702, then the fill color of the corresponding bubble is set to `#7FEB737C`. As mentioned earlier, the underlying value of the bubble is set through the [`ValuePath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html#Syncfusion_UI_Xaml_Maps_BubbleMarkerSetting_ValuePath) in the `BubbleMarkerSetting`.
-When the under-bound value is under any of the given sorted range or above the sorted range, then the fill is set as “Black.”
+When the underlying value is under any of the given sorted range or above the sorted range, then the fill is set as `Black`.
-`AutoFillColor` must be set as `false` to enable range color mapping.
+[`AutoFillColor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html#Syncfusion_UI_Xaml_Maps_BubbleMarkerSetting_AutoFillColor) must be set as `false` to enable range color mapping.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+{% endhighlight %}
+
+
diff --git a/chart-sdk/uwp/Map/Commands-for-Zooming-and-Panning.md b/chart-sdk/uwp/Map/Commands-for-Zooming-and-Panning.md
index a17bd91c0..638ce5637 100644
--- a/chart-sdk/uwp/Map/Commands-for-Zooming-and-Panning.md
+++ b/chart-sdk/uwp/Map/Commands-for-Zooming-and-Panning.md
@@ -1,109 +1,103 @@
---
layout: post
-title: Commands for Zooming and Panning in UWP Map control | Syncfusion
-description: Learn here all about Commands for Zooming and Panning support in Syncfusion UWP Map (SfMaps) control and more.
+title: Commands in UWP Maps | Syncfusion®
+description: Commands in the UWP Maps enable interaction handling and action execution through command bindings, supporting flexible application workflows.
platform: chart-sdk
control: Maps
documentation: ug
---
-# Commands for Zooming and Panning in UWP Map (SfMaps)
+# Commands in UWP Maps
-The Map control contains the following commands:
+The [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) control contains the following commands:
-* ZoomIn Command
-* ZoomOut Command
-* Pan Command
-* ZoomReset Command
-* PanReset Command
+* [ZoomIn Command](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ZoomInCommand)
+* [ZoomOut Command](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ZoomOutCommand)
+* [Pan Command](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_PanCommand)
+* [ZoomReset Command](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ResetCommand)
+* [PanReset Command](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_PanResetCommand)
## ZoomIn Command
-`ZoomIn` command zooms in the map.
+The [`ZoomInCommand`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ZoomInCommand) zooms in the map.
{% highlight xml %}
-
-
-
-
-
-
-
-
+
+
+
+
+
-{% endhighlight %}
+
+
+{% endhighlight %}
## ZoomOut Command
-`ZoomOut` command zooms out the map.
+The [`ZoomOutCommand`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ZoomOutCommand) zooms out the map.
{% highlight xml %}
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
{% endhighlight %}
## Pan Command
-`Pan` Command is used to navigate on the Map control. The direction of the navigation is the Command parameter for the Pan Command.
+The [`PanCommand`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_PanCommand) is used to navigate on the Map control. The direction of the navigation is the command parameter for the `PanCommand`.
{% highlight xml %}
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
-{% endhighlight %}
+{% endhighlight %}
## ZoomReset Command
-The `ZoomReset` command resets the ZoomLevel value of the Map control.
+The [`ResetCommand`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ResetCommand) resets the [`ZoomLevel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ZoomLevel) value of the Map control.
{% highlight xml %}
-
-
-
-
-
-
+
+
+
+
+
-
+
-{% endhighlight %}
+{% endhighlight %}
## PanReset Command
-The `PanReset` command resets the map at its initial position; it resets the pan values.
+The [`PanResetCommand`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_PanResetCommand) resets the map to its initial position; it resets the pan values.
{% highlight xml %}
-
-
-
-
-
-
+
+
+
+
+
-
+
-{% endhighlight %}
+{% endhighlight %}
diff --git a/chart-sdk/uwp/Map/Custom-Data-Binding.md b/chart-sdk/uwp/Map/Custom-Data-Binding.md
index 2bbac3ac8..cdef28cef 100644
--- a/chart-sdk/uwp/Map/Custom-Data-Binding.md
+++ b/chart-sdk/uwp/Map/Custom-Data-Binding.md
@@ -1,268 +1,256 @@
---
layout: post
-title: Custom Data Binding in UWP Map control | Syncfusion
-description: Learn here all about Custom Data Binding support in Syncfusion UWP Map (SfMaps) control and more.
+title: Custom Data Binding in UWP Maps | Syncfusion®
+description: Custom data binding in the UWP Maps enables map elements to be connected with custom data sources for dynamic visualization and interaction.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Custom Data Binding in UWP Map (SfMaps)
+# Custom Data Binding in UWP Maps
-A map can be bound with custom objects. For custom data binding, a .dbf file is not required. In Data Binding, an object is bound to a shape. In custom data binding, an object is bound to a point based on latitude and longitude values. CustomDataSource is the API exposed in the custom data source. It is an IEnumerable type API. Each item in the CustomDataSource should have latitude and longitude properties with each mentioned name. Users should adhere to the following rules for custom data binding:
+A map can be bound with custom objects. For custom data binding, a `.dbf` file is not required. In data binding, an object is bound to a shape. In custom data binding, an object is bound to a point based on latitude and longitude values. [`CustomDataSource`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_CustomDataSource) is the API exposed in the custom data source. It is an `IEnumerable` type API. Each item in the `CustomDataSource` should have latitude and longitude properties with each mentioned name. Users should adhere to the following rules for custom data binding:
-## Rule for Specifying the Latitude:
+## Rule for Specifying the Latitude
-Latitude should specify its decimal value along with the first letter of direction. Since latitude is related to the North and South directions on a map, the values should end with N or S. For example: 10.12245N or 23.4566S.
+Latitude should specify its decimal value along with the first letter of the direction. Since latitude is related to the North and South directions on a map, the values should end with `N` or `S`. For example: `10.12245N` or `23.4566S`.
-## Rule for Specifying the Longitude:
+## Rule for Specifying the Longitude
-The rule for longitude is similar to that of the latitude, apart from the directional value. Since longitude is related to the East and West directions on a map, the values should end with E or W. For example:34.345E or 56.345W.
+The rule for longitude is similar to that of the latitude, apart from the directional value. Since longitude is related to the East and West directions on a map, the values should end with `E` or `W`. For example: `34.345E` or `56.345W`.
-To show the custom data on the map, the CustomDataSourceTemplate must be specified. CustomDataSourceTemplate is a DataTemplate type API used to expose the template for custom data.
+To show the custom data on the map, the [`CustomDataSourceTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_CustomDataSourceTemplate) must be specified. `CustomDataSourceTemplate` is a `DataTemplate` type API used to expose the template for custom data.
{% tabs %}
{% highlight c# %}
- public class Weather
- {
- public int CurrentTemperature { get; set; }
- public int AverageHighTemperature { get; set; }
- public int AverageLowTemperature { get; set; }
- public string Country { get; set; }
- public string Continent { get; set; }
- public string City { get; set; }
- public string WeatherDescription { get; set; }
- public int Humidity { get; set; }
- public string Longitude { get; set; }
- public string Latitude { get; set; }
- }
+public class Weather
+{
+ public int CurrentTemperature { get; set; }
+ public int AverageHighTemperature { get; set; }
+ public int AverageLowTemperature { get; set; }
+ public string Country { get; set; }
+ public string Continent { get; set; }
+ public string City { get; set; }
+ public string WeatherDescription { get; set; }
+ public int Humidity { get; set; }
+ public string Longitude { get; set; }
+ public string Latitude { get; set; }
+}
-{% endhighlight %}
+{% endhighlight %}
{% highlight c# %}
- public class ViewModel
+public class ViewModel
+{
+ public List Models
{
- public List Models
- {
- get;
- set;
- }
+ get;
+ set;
+ }
- public ViewModel()
- {
- this.Models = new List();
- this.Models = ViewModel.GetWeatherData();
- }
- public static List GetWeatherData()
- {
- List weatherCollection = new List();
- weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude="41.8500N", Longitude="87.6500W" });
- weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude="76.0740E"});
- weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude="35.6833N", Longitude="139.7667E" });
- weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude="55.7517N", Longitude="37.6178E" });
- weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude="33.9767S", Longitude="18.4244E" });
- weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
- weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
- weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude="23.5000S", Longitude="46.6167W" });
- weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
- weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
- return weatherCollection;
- }
+ public ViewModel()
+ {
+ this.Models = new List();
+ this.Models = ViewModel.GetWeatherData();
}
+ public static List GetWeatherData()
+ {
+ List weatherCollection = new List();
+ weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
+ weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
+ weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
+ weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
+ weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
+ weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
+ weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
+ weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
+ weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
+ weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
+ return weatherCollection;
+ }
+}
+
{% endhighlight %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-{% endhighlight %}
+{% endhighlight %}
{% endtabs %}
-
+
## Role of DBF file in Data Binding
-The .dbf file, which is included in the main shape file, is required to work with data binding. The .dbf file contains the information about the shapes in the main shape file. Each record in the .dbf file is associated with the each shape in the main file. Shapes in the main file and records in the .dbf file are organized in the same sequence. Therefore, the Nth shape in the main file is associated with Nth record in the .dbf file. A record of the .dbf file can contain the name of the shape or population data or some other statistical data of a geographic shape.
+The `.dbf` file, which is included in the main shape file, is required to work with data binding. The `.dbf` file contains the information about the shapes in the main shape file. Each record in the `.dbf` file is associated with the each shape in the main file. Shapes in the main file and records in the `.dbf` file are organized in the same sequence. Therefore, the Nth shape in the main file is associated with the Nth record in the `.dbf` file. A record of the `.dbf` file can contain the name of the shape or population data or some other statistical data of a geographic shape.
## Properties that expose Data Binding
The following properties expose data binding in the Maps control:
-* ItemsSource
-* ShapeIDPath
-* ShapeIDTableField
+* [ItemsSource](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ItemsSource)
+* [ShapeIDPath](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDPath)
+* [ShapeIDTableField](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDTableField)
## ItemsSource
-This is the basic property that exposes data binding for Maps. ItemsSource is the property that accepts the collection type values. For example, the ItemsSource property accepts the ObservableCollections, Lists, and LinqResult values.
+This is the basic property that exposes data binding for Maps. [`ItemsSource`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ItemsSource) is the property that accepts the collection type values. For example, the `ItemsSource` property accepts the `ObservableCollections`, `Lists`, and `LinqResult` values.
-##ShapeIDPath
+## ShapeIDPath
-ShapeIDPath is the string type property used to refer to the ID of a shape from the ItemsSource. The ItemsSource property must have a property with name of the ShapeIDPath. The ShapeIDPath and the ShapeIDTableField properties are related to each other (refer to ShapeIDTableField for more details).
+[`ShapeIDPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDPath) is a string type property used to refer to the ID of a shape from the `ItemsSource`. The `ItemsSource` property must have a property with the name of the `ShapeIDPath`. The `ShapeIDPath` and the [`ShapeIDTableField`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDTableField) properties are related to each other (refer to [ShapeIDTableField](#shapeidtablefield) for more details).
## ShapeIDTableField
-The ShapeIDTableField property is similar to the ShapeIDPath. SIt is a string type property which refers the column name in the dbf file to identify the shape. If values of the ShapeIDPath property in the ItemsSource and the value of ShapeIDTableField in the .dbf file match, then the associated object from the ItemsSource will be bound to the corresponding shape.
+The [`ShapeIDTableField`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDTableField) property is similar to the `ShapeIDPath`. It is a string type property which refers to the column name in the `.dbf` file to identify the shape. If values of the `ShapeIDPath` property in the `ItemsSource` and the value of `ShapeIDTableField` in the `.dbf` file match, then the associated object from the `ItemsSource` will be bound to the corresponding shape.
Refer to the sample below on how business objects can be bound to a map. The following code has been implemented as an MVVM pattern.
{% tabs %}
-{% highlight c#%}
+{% highlight c# %}
- public class Model : INotifyPropertyChanged
+public class Model : INotifyPropertyChanged
+{
+ public string Country { get; set; }
+ private double population { get; set; }
+ public double Population
{
- public string Country { get; set; }
- private double population { get; set; }
- public double Population
+ get
+ {
+ return population;
+ }
+ set
{
- get
- {
- return population;
- }
- set
- {
- population = value;
- OnPropertyChanged(new PropertyChangedEventArgs("Population"));
- }
+ population = value;
+ OnPropertyChanged(new PropertyChangedEventArgs("Population"));
}
- public string PopulationFormat { get; set; }
- public event PropertyChangedEventHandler PropertyChanged;
- public void OnPropertyChanged(PropertyChangedEventArgs e)
+ }
+ public string PopulationFormat { get; set; }
+ public event PropertyChangedEventHandler PropertyChanged;
+ public void OnPropertyChanged(PropertyChangedEventArgs e)
+ {
+ this.PopulationFormat = (String.Format("{0:0,0}", this.Population).Trim('$'));
+ if (PropertyChanged != null)
{
- this.PopulationFormat = (String.Format("{0:0,0}", this.Population).Trim('$'));
- if (PropertyChanged != null)
- {
- PropertyChanged(this, e);
- }
+ PropertyChanged(this, e);
}
}
+}
{% endhighlight %}
-{% highlight c#%}
+{% highlight c# %}
public class ViewModel : DependencyObject
{
- public ObservableCollection Countries { get; set; }
+ public ObservableCollection Countries { get; set; }
public ViewModel()
{
- this. Countries = this.GetCountriesAndPopulation();
+ this.Countries = this.GetCountriesAndPopulation();
}
- private ObservableCollection GetCountriesAndPopulation()
+ private ObservableCollection GetCountriesAndPopulation()
{
ObservableCollection countries = new ObservableCollection();
countries.Add(new Model() { Country = "China", Population = 1347350000 });
-
countries.Add(new Model() { Country = "United States", Population = 314623000 });
-
countries.Add(new Model() { Country = "Australia", Population = 22789701 });
-
countries.Add(new Model() { Country = "Russia", Population = 143228300 });
-
countries.Add(new Model() { Country = "Egypt", Population = 82724000 });
-
countries.Add(new Model() { Country = "South Africa", Population = 50586757 });
return countries;
-
}
-
}
-}
-
-
{% endhighlight %}
-{% highlight xml%}
-
+{% highlight xml %}
+
-
+
-
+
-
{% endhighlight %}
{% endtabs %}
diff --git a/chart-sdk/uwp/Map/Data-Binding.md b/chart-sdk/uwp/Map/Data-Binding.md
index 61bfc10f8..8fd3986d3 100644
--- a/chart-sdk/uwp/Map/Data-Binding.md
+++ b/chart-sdk/uwp/Map/Data-Binding.md
@@ -1,150 +1,149 @@
---
layout: post
-title: Data Binding in UWP Map control | Syncfusion
-description: Learn here all about Data Binding support in Syncfusion Essential UWP Map (SfMaps) control, its elements, and more.
+title: Data Binding in UWP Map | Syncfusion®
+description: Data binding in the UWP Maps connects geographic data sources to map elements, enabling dynamic visualization and interactive data representation.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Data Binding in UWP Map (SfMaps)
+# Data Binding in UWP Maps
-The following properties expose data binding in the Maps control:
+The following properties expose data binding in the [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) control:
-* `ItemsSource`
-* `ShapeIDPath`
-* `ShapeIDTableField`
+* [`ItemsSource`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ItemsSource)
+* [`ShapeIDPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDPath)
+* [`ShapeIDTableField`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDTableField)
## Items Source
-This is the basic property that exposes data binding for Maps. `ItemsSource` is the property that accepts the collection type values. For example, the ItemsSource property accepts the `ObservableCollections`, `Lists`, and `Linq` result values.
+This is the basic property that exposes data binding for Maps. [`ItemsSource`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ItemsSource) is the property that accepts the collection type values. For example, the `ItemsSource` property accepts the `ObservableCollections`, `Lists`, and `Linq` result values.
### ShapeID Path
-`ShapeIDPath` is the string type property used to refer to the ID of a shape from the ItemsSource. The ItemsSource property must have a property with name of the ShapeIDPath. The ShapeIDPath and the ShapeIDTableField properties are related to each other (refer to [ShapeIDTableField](#ShapeIDTableField) for more details).
+[`ShapeIDPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDPath) is a string type property used to refer to the ID of a shape from the `ItemsSource`. The `ItemsSource` property must have a property with the name of the `ShapeIDPath`. The `ShapeIDPath` and [`ShapeIDTableField`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDTableField) properties are related to each other (refer to [ShapeIDTableField](#shapeid-tablefield) for more details).
### ShapeID TableField
-`ShapeIDTableField` property is similar to the ShapeIDPath. It is a string type property that refers to the column name in the dbf file to identify the shape. When values of the ShapeIDPath property in the ItemsSource and the value of ShapeIDTableField in the .dbf file match, then the associated object from the ItemsSource is bound to the corresponding shape.
+The [`ShapeIDTableField`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDTableField) property is similar to the `ShapeIDPath`. It is a string type property that refers to the column name in the `.dbf` file to identify the shape. When the values of the `ShapeIDPath` property in the `ItemsSource` and the value of `ShapeIDTableField` in the `.dbf` file match, then the associated object from the `ItemsSource` is bound to the corresponding shape.
### ShapeValuePath
-`ShapeValuePath` is a string type property used to define the object bound to the shapes of the map. The ShapeValuePath must be the name of any property that is defined in the ItemsSource items. The ShapeIDPath, ShapeIDTableField, and ShapeValue paths are dependent upon one another. Without specifying the `ShapeIDPath` and `ShapeIDTableField`, `ShapeValuePath` has no effect. When `ShapeIDPath` and `ShapeIDTableField` are properly set as mentioned in the [Data Binding](#Data-Binding) section, the `ShapeValuePath` has an impact on the map.
+[`ShapeValuePath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeValuePath) is a string type property used to define the object bound to the shapes of the map. The `ShapeValuePath` must be the name of any property that is defined in the `ItemsSource` items. The `ShapeIDPath`, `ShapeIDTableField`, and `ShapeValuePath` are dependent upon one another. Without specifying the `ShapeIDPath` and `ShapeIDTableField`, `ShapeValuePath` has no effect. When `ShapeIDPath` and `ShapeIDTableField` are properly set as mentioned in the [Data Binding](#data-binding-in-uwp-map-sfmaps) section, the `ShapeValuePath` has an impact on the map.
## Role of DBF file in Data Binding
-The `.dbf` file that is included in the main shape file, is required to work with data binding. The .dbf file contains the information about the shapes in the main shape file. Each record in the .dbf file is associated with the each shape in the main file. Shapes in the main file and records in the .dbf file are organized in the same sequence. Therefore, the Nth shape in the main file is associated with Nth record in the .dbf file. A record of the .dbf file can contain the name of the shape or population data or some other statistical data of a geographic shape.
+The `.dbf` file that is included in the main shape file is required to work with data binding. The `.dbf` file contains the information about the shapes in the main shape file. Each record in the `.dbf` file is associated with the each shape in the main file. Shapes in the main file and records in the `.dbf` file are organized in the same sequence. Therefore, the Nth shape in the main file is associated with the Nth record in the `.dbf` file. A record of the `.dbf` file can contain the name of the shape or population data or some other statistical data of a geographic shape.
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
-## Customize Map Appearance
+## Customize Map Appearance
-You can customize the shape’s color by using `ShapeFill`, `ShapeStroke` and `ShapeStrokeThickness` properties in `ShapeSettings`.
+You can customize the shape's color by using [`ShapeFill`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeFill), [`ShapeStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeStroke), and [`ShapeStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeStrokeThickness) properties in the [`ShapeSettings`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeSettings).
-{%tabs%}
-{% highlight C# %}
+{% tabs %}
+{% highlight c# %}
- public class Country : INotifyPropertyChanged
+public class Country : INotifyPropertyChanged
+{
+ public string NAME { get; set; }
+ private Visibility visibility = Visibility.Visible;
+ public Visibility ItemsVisibility
+ {
+ get { return visibility; }
+ set { visibility = value; }
+ }
+ private double weather { get; set; }
+ public double Weather
+ {
+ get
+ {
+ return weather;
+ }
+ set
+ {
+ weather = value;
+ }
+ }
+ private double population { get; set; }
+ public double Population
+ {
+ get
+ {
+ return population;
+ }
+ set
+ {
+ population = value;
+ OnPropertyChanged(new PropertyChangedEventArgs("Population"));
+ }
+ }
+ public string PopulationFormat { get; set; }
+ public event PropertyChangedEventHandler PropertyChanged;
+ public void OnPropertyChanged(PropertyChangedEventArgs e)
{
- public string NAME { get; set; }
- private Visibility visibility = Visibility.Visible;
- public Visibility ItemsVisibility
- {
- get { return visibility; }
- set {visibility = value; }
- }
- private double weather { get; set; }
- public double Weather
- {
- get
- {
- return weather;
- }
- set
- {
- weather = value;
- }
- }
- private double population { get; set; }
- public double Population
- {
- get
- {
- return population;
- }
- set
- {
- population = value;
- OnPropertyChanged(new PropertyChangedEventArgs("Population"));
- }
- }
- public string PopulationFormat { get; set; }
- public event PropertyChangedEventHandler PropertyChanged;
- public void OnPropertyChanged(PropertyChangedEventArgs e)
- {
- this.PopulationFormat = (String.Format("{0:0,0}", this.Population).Trim('$'));
- if (PropertyChanged != null)
- {
- PropertyChanged(this, e);
- }
- }
- }
- public class MapViewModel
- {
- public ObservableCollection Countries { get; set; }
- public MapViewModel()
- {
- Countries = new ObservableCollection();
- Countries = GetCountriesAndPopulation();
- }
- private ObservableCollection GetCountriesAndPopulation()
- {
- ObservableCollection countries = new ObservableCollection();
- countries.Add(new Country() { NAME = "China", Population = 1347350000 });
- countries.Add(new Country() { NAME = "United States", Population = 314623000 });
- countries.Add(new Country() { NAME = "Australia", Population = 22789701 });
- countries.Add(new Country() { NAME = "Russia", Population = 143228300 });
- countries.Add(new Country() { NAME = "Egypt", Population = 82724000 });
- countries.Add(new Country() { NAME = "South Africa", Population = 50586757 });
- return countries;
- }
- }
+ this.PopulationFormat = (String.Format("{0:0,0}", this.Population).Trim('$'));
+ if (PropertyChanged != null)
+ {
+ PropertyChanged(this, e);
+ }
+ }
+}
+
+public class MapViewModel
+{
+ public ObservableCollection Countries { get; set; }
+ public MapViewModel()
+ {
+ Countries = new ObservableCollection();
+ Countries = GetCountriesAndPopulation();
+ }
+ private ObservableCollection GetCountriesAndPopulation()
+ {
+ ObservableCollection countries = new ObservableCollection();
+ countries.Add(new Country() { NAME = "China", Population = 1347350000 });
+ countries.Add(new Country() { NAME = "United States", Population = 314623000 });
+ countries.Add(new Country() { NAME = "Australia", Population = 22789701 });
+ countries.Add(new Country() { NAME = "Russia", Population = 143228300 });
+ countries.Add(new Country() { NAME = "Egypt", Population = 82724000 });
+ countries.Add(new Country() { NAME = "South Africa", Population = 50586757 });
+ return countries;
+ }
+}
+
{% endhighlight %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
-{%endtabs%}
+{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Map/Displaying-Items-on-a-Map.md b/chart-sdk/uwp/Map/Displaying-Items-on-a-Map.md
index 6b2129b10..de3239bfe 100644
--- a/chart-sdk/uwp/Map/Displaying-Items-on-a-Map.md
+++ b/chart-sdk/uwp/Map/Displaying-Items-on-a-Map.md
@@ -1,50 +1,49 @@
---
layout: post
-title: Displaying Items on a Map in UWP Map control | Syncfusion
-description: Learn here all about Displaying Items on a Map support in Syncfusion UWP Map (SfMaps) control and more.
+title: Displaying Items on a Map in UWP Maps | Syncfusion®
+description: Displaying items on a map in the UWP Maps enables visualization of geographic data using shapes, markers, bubbles, and other map elements.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Displaying Items on a Map in UWP Map (SfMaps)
+# Displaying Items on a Map in UWP Maps
-Along with bubbles, the ItemsSource data can be visualized with other elements. The `ItemsTemplate` property is used to define the template for the items that are displayed on the map. By default, the map elements show the values of the object that is defined in the `ShapeValuePath` of the ShapeFileLayer’s `ShapeSetting`.
+Along with bubbles, the `ItemsSource` data can be visualized with other elements. The [`ItemsTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ItemsTemplate) property is used to define the template for the items that are displayed on the map. By default, the map elements show the values of the object that is defined in the [`ShapeValuePath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeValuePath) of the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html)'s [`ShapeSettings`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeSettings).
## About the ShapeValuePath property
-ShapeValuePath is a string type property used to define the object bound to the shapes of the map. The ShapeValuePath must be the name of any property that is defined in the ItemsSource items. The ShapeIDPath, ShapeIDTableField, and ShapeValue paths are dependent upon one another. Without specifying the `ShapeIDPath` and `ShapeIDTableField`, `ShapeValuePath` has no effect. When ShapeIDPath and ShapeIDTableField are properly set as mentioned in the Data Binding section, the ShapeValuePath will have an impact on the map.
+[`ShapeValuePath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeValuePath) is a string type property used to define the object bound to the shapes of the map. The `ShapeValuePath` must be the name of any property that is defined in the `ItemsSource` items. The [`ShapeIDPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDPath), [`ShapeIDTableField`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeIDTableField), and `ShapeValuePath` are dependent upon one another. Without specifying the `ShapeIDPath` and `ShapeIDTableField`, `ShapeValuePath` has no effect. When `ShapeIDPath` and `ShapeIDTableField` are properly set as mentioned in the Data Binding section, the `ShapeValuePath` will have an impact on the map.
## ItemsTemplate
-`ItemsTemplate` is a type of DataTemplate, which is used to override the default template for map items. “Data” is the property that holds the object for a map item.
+[`ItemsTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ItemsTemplate) is a type of `DataTemplate`, which is used to override the default template for map items. `Data` is the property that holds the object for a map item.
-Implement the Model and ViewModel, as mentioned in the [Data Binding](/winrt/Maps/Data-Binding "Data Binding") topic, and include the following code in the XAML page:
+Implement the `Model` and `ViewModel`, as mentioned in the [Data Binding](/winrt/Maps/Data-Binding "Data Binding") topic, and include the following code in the XAML page:
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+{% endhighlight %}
+
+
diff --git a/chart-sdk/uwp/Map/Getting-Started.md b/chart-sdk/uwp/Map/Getting-Started.md
index b37434e03..af707aabe 100644
--- a/chart-sdk/uwp/Map/Getting-Started.md
+++ b/chart-sdk/uwp/Map/Getting-Started.md
@@ -1,17 +1,17 @@
---
layout: post
-title: Getting Started with UWP Map control | Syncfusion
-description: Learn here about getting started with Syncfusion Essential Studio UWP Map (SfMaps) control, its elements and more.
+title: Getting Started with UWP Maps | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Maps control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Getting Started with UWP Map (SfMaps)
+# Getting Started with UWP Maps
## Creating Maps for a Windows Store App
-`SfMaps` is available in the following assembly and namespace:
+[`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) is available in the following assembly and namespace:
`Assembly`: Syncfusion.SfMaps.UWP
@@ -21,23 +21,23 @@ documentation: ug
### Adding assembly reference
1. Open the Add Reference window from your project.
-2. Choose Windows > Extensions > SyncfusionControls for UWP XAML.
+2. Choose Windows > Extensions > Syncfusion Controls for UWP XAML.
-
+
### Add SfMaps from Toolbox
Drag and drop the SfMaps control from the Toolbox to your application.
-
+
-Now the SyncfusionControls for UWP XAML reference is added to the application references and the xmlns namespace code is generated in MainWindow.xaml as below.
+Now the Syncfusion Controls for UWP XAML reference is added to the application references and the `xmlns` namespace code is generated in MainWindow.xaml as below.
-
+
{% highlight xml %}
-
-
-
-
+
+
+
+
-
-
{% endhighlight %}
Refer to the following code to add the map:
@@ -60,37 +59,35 @@ Refer to the following code to add the map:
{% tabs %}
{% highlight xml %}
-
-
+
-
+
-
-
+
-
-
+
+
{% endhighlight %}
{% highlight c# %}
- SfMap syncMap = new SfMap();
- syncMap.EnablePan = true;
- ShapeFileLayer layer = new ShapeFileLayer();
- layer.Uri = "ms-appx:///Assets/world1.shp";
- syncMap.Layers.Add(layer);
- MainGrid.Children.Add(syncMap);
+SfMap syncMap = new SfMap();
+syncMap.EnablePan = true;
+ShapeFileLayer layer = new ShapeFileLayer();
+layer.Uri = "ms-appx:///Assets/world1.shp";
+syncMap.Layers.Add(layer);
+MainGrid.Children.Add(syncMap);
{% endhighlight %}
{% endtabs %}
@@ -99,10 +96,10 @@ Refer to the following code to add the map:
The Maps control includes the following key features:
-* Reading and Loading Shape File
+* Reading and Loading Shape File
* Data Binding
* Bubbles
-* Displaying Item by Data Binding
+* Displaying Items by Data Binding
* Zooming and Panning
* Annotations
* Shape Color Customization
@@ -113,7 +110,7 @@ The Maps control includes the following key features:
## Reading and Loading the Shapes
-The Maps control supports reading and loading shape files. A shape file is a set of files which are stored in a non-topological geometry and the attribute information for the spatial features and records in a data set. Spatial features and records are stored as shapes that consist of set vector coordinates. A computer program can read the content of the shape files and parse them as vector elements. The Maps control also reads and parses the spatial information of a shape file into the graphical elements.
+The Maps control supports reading and loading shape files. A shape file is a set of files which are stored in a non-topological geometry and the attribute information for the spatial features and records in a data set. Spatial features and records are stored as shapes that consist of a set of vector coordinates. A computer program can read the content of the shape files and parse them as vector elements. The Maps control also reads and parses the spatial information of a shape file into the graphical elements.
As mentioned earlier, a shape file can be a set of files or a single file. Generally, the shape file contains the following files:
@@ -123,31 +120,31 @@ As mentioned earlier, a shape file can be a set of files or a single file. Gener
-All files must adhere to the 8.3 naming conventions. The Main file, Index file, and dBase file must have the same prefix, i.e., they must have the same file name. This naming convention allows the user or developer to identify specific geographical information.
+All files must adhere to the 8.3 naming conventions. The main file, index file, and dBase file must have the same prefix, i.e., they must have the same file name. This naming convention allows the user or developer to identify specific geographical information.
-The main file (.shp) contains a fixed-length file header followed by the variable-length records. Each variable-length record is made up of a fixed-length record header followed by the variable-length record contents.
+The main file (.shp) contains a fixed-length file header followed by the variable-length records. Each variable-length record is made up of a fixed-length record header followed by the variable-length record contents.
The index file (.shx) contains a 100-byte header followed by 8-byte, fixed-length records.
-The dBase file (.dbf) contains any desired feature attributes or attributes keys to which other tables can be joined. Its format is a standard .dbf file used by many table-based applications in Windows™ and DOS. Any set of fields can be present in the table.
+The dBase file (.dbf) contains any desired feature attributes or attribute keys to which other tables can be joined. Its format is a standard `.dbf` file used by many table-based applications in Windows™ and DOS. Any set of fields can be present in the table.
For more information about the 8.3 naming convention, shape files and their descriptions, visit the following link:
[http://www.esri.com/library/whitepapers/pdfs/shapefile.pdf](http://www.esri.com/library/whitepapers/pdfs/shapefile.pdf)
-Maps read the main file and create the map shapes. The associated .dbf file contents are then incorporated with the shapes created from the main files.
+Maps read the main file and create the map shapes. The associated `.dbf` file contents are then incorporated with the shapes created from the main files.
## Attach the Shape file with Maps
-To read the shape file using Maps, the shape file’s main file and .dbf file need to be added as an embedded resource in the application project. Then, the main file’s path has to be given in the Uri file of the shape file layer.
+To read the shape file using Maps, the shape file's main file and `.dbf` file need to be added as an embedded resource in the application project. Then, the main file's path has to be given in the [`Uri`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Uri) property of the shape file layer.
### About the Uri property
-Uri is the string type property that retrieves the location of the shape file that is added as an embedded resource.
+[`Uri`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Uri) is a string type property that retrieves the location of the shape file that is added as an embedded resource.
### Structure of Uri property
-The Uri property contains the following information:
+The `Uri` property contains the following information:
* Namespace
* Subfolder names
@@ -156,18 +153,13 @@ The Uri property contains the following information:
{% highlight xml %}
+
-
-
-
-
-{% endhighlight %}
-
-In the above code sample, MapApp is the namespace, ShapeFile is the subfolder name, and world.shp is the name of the shape file.
-
+{% endhighlight %}
+In the above code sample, MapApp is the namespace, ShapeFile is the subfolder name, and world.shp is the name of the shape file.
-
+
## Load Shapefile as Content File Instead of Embedded Resource
@@ -175,45 +167,43 @@ This feature enables the control to read a shapefile from an HTTP path, as a con
### From HTTP Path
-By giving the URL path of the file to the URI property, a shapefile will be read. Here, the file will not be downloaded. It only reads the content from the web.
+By giving the URL path of the file to the [`Uri`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Uri) property, a shapefile will be read. Here, the file will not be downloaded. It only reads the content from the web.
{% highlight xml %}
-
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
-### File as a Content File
+### File as a Content File
-Reading a file as a content file leaves the resource as a loose file, and upon compilation this resource information is not embedded in the assembly. Instead, it adds a custom attribute to the assembly which records the existence and relative location of the file. It is also possible to access the resource file without adding it to the project. However, with this approach, management of the resource file becomes difficult. This approach is useful if a resource file is generated dynamically using some runtime information. In such a case, the resource file will not be available at compile time and so cannot be added to project.
+Reading a file as a content file leaves the resource as a loose file, and upon compilation this resource information is not embedded in the assembly. Instead, it adds a custom attribute to the assembly which records the existence and relative location of the file. It is also possible to access the resource file without adding it to the project. However, with this approach, management of the resource file becomes difficult. This approach is useful if a resource file is generated dynamically using some runtime information. In such a case, the resource file will not be available at compile time and so cannot be added to the project.
{% highlight xml %}
-
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
-### Load as a Stream
+### Load as a Stream
-Shapefiles and DBF files can be loaded as a stream. The main reason for this method is to reduce the size of the file. LoadToStream is an overloaded method that is available in the ShapeFileLayer class.
+Shapefiles and DBF files can be loaded as a stream. The main reason for this method is to reduce the size of the file. [`LoadFromStream`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LoadFromStream_System_IO_Stream_) is an overloaded method that is available in the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html) class.
To load the shapefile alone:
{% highlight c# %}
- (map.Layers[0] as ShapeFileLayer).LoadFromStream(stream);
+(map.Layers[0] as ShapeFileLayer).LoadFromStream(stream);
{% endhighlight %}
@@ -221,9 +211,9 @@ To load a shapefile and DBF file:
{% highlight c# %}
- (map.Layers[0] as ShapeFileLayer).LoadFromStream(stream,dbf);
+ (map.Layers[0] as ShapeFileLayer).LoadFromStream(stream, dbf);
{% endhighlight %}
-You can find the complete getting started sample from this [link.](https://github.com/SyncfusionExamples/SfMaps_GettingStarted_UWP)
+You can find the complete getting started sample from this [link](https://github.com/SyncfusionExamples/SfMaps_GettingStarted_UWP).
diff --git a/chart-sdk/uwp/Map/How-To.md b/chart-sdk/uwp/Map/How-To.md
deleted file mode 100644
index 0074e23ad..000000000
--- a/chart-sdk/uwp/Map/How-To.md
+++ /dev/null
@@ -1,32 +0,0 @@
----
-layout: post
-title: Customizations in Syncfusion SfMaps
-description: Customizations in SfMaps
-platform: chart-sdk
-control: SfMaps
-documentation: ug
----
-
-# How to
-
-## Transform latitude and longitude value to pixel value and vice-versa
-
-SfMaps offers two utility methods to transform the pixel values to longitude and latitude values and vice-versa. This method is used for both ShapeFileLayer and ImageryLayer.
-
-* `LatitudeLongitudeToPoint(double latitude, double longitude)` - Converts the latitude and longitude values to screen point. Here, pass the parameters as latitude and longitude values, from that values we can get screen points x and y.
-* `GetLatLonFromPoint(Point point)` - Converts the screen point to longitude and latitude values. Here, pass the parameters as screen points x and y, from that points we can get longitude(Point.X) and latitude(Point.Y) values.
-
-{% tabs %}
-
-{% highlight c# %}
-
-Point pixelPoint = layer.LatitudeLongitudeToPoint(21.00, 78.00);
-Point longitudeLatitude = layer.GetLatLonFromPoint(pixelPoint);
-mapAnnotations.Latitude = longitudeLatitude.Y;
-mapAnnotations.Longitude = longitudeLatitude.X;
-
-{% endhighlight %}
-
-{% endtabs %}
-
-
\ No newline at end of file
diff --git a/chart-sdk/uwp/Map/How-to/Customizations-in-Syncfusion-SfMaps.md b/chart-sdk/uwp/Map/How-to/Customizations-in-Syncfusion-SfMaps.md
new file mode 100644
index 000000000..1fdd432d3
--- /dev/null
+++ b/chart-sdk/uwp/Map/How-to/Customizations-in-Syncfusion-SfMaps.md
@@ -0,0 +1,30 @@
+---
+layout: post
+title: How to convert coordinates in UWP Maps | Syncfusion®
+description: Learn how to convert geographic coordinates to pixel positions and pixel points to latitude and longitude values in UWP Maps.
+platform: chart-sdk
+control: SfMaps
+documentation: ug
+---
+
+# How to convert coordinates in UWP Maps
+
+## Transform latitude and longitude value to pixel value and vice-versa
+
+[`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) offers two utility methods to transform the pixel values to longitude and latitude values and vice-versa. These methods are used for both [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html) and [`ImageryLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html).
+
+* `LatitudeLongitudeToPoint(double latitude, double longitude)` - Converts the latitude and longitude values to a screen point. Here, pass the parameters as latitude and longitude values, from which you can get the screen points x and y.
+* [`GetLatLonFromPoint(Point point)`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapLayer.html#Syncfusion_UI_Xaml_Maps_MapLayer_GetLatLonFromPoint_Windows_Foundation_Point_) - Converts the screen point to longitude and latitude values. Here, pass the parameters as screen points x and y, from which you can get the longitude (`Point.X`) and latitude (`Point.Y`) values.
+
+{% tabs %}
+{% highlight c# %}
+
+Point pixelPoint = layer.GeopointToViewPoint(21.00, 78.00);
+Point longitudeLatitude = layer.GetLatLonFromPoint(pixelPoint);
+mapAnnotations.Latitude = longitudeLatitude.Y;
+mapAnnotations.Longitude = longitudeLatitude.X;
+
+{% endhighlight %}
+{% endtabs %}
+
+
\ No newline at end of file
diff --git a/chart-sdk/uwp/Map/How-to/KML-Shapes-Rendered-in-ShapeFileLayer.md b/chart-sdk/uwp/Map/How-to/KML-Shapes-Rendered-in-ShapeFileLayer.md
new file mode 100644
index 000000000..3adce169c
--- /dev/null
+++ b/chart-sdk/uwp/Map/How-to/KML-Shapes-Rendered-in-ShapeFileLayer.md
@@ -0,0 +1,33 @@
+---
+layout: post
+title: How to render KML in shape file layer for UWP Maps | Syncfusion®
+description: Learn how to render KML shapes in a ShapeFileLayer and configure KML files as embedded resources in UWP Maps.
+platform: chart-sdk
+control: SfMap
+documentation: ug
+---
+
+# How to render KML shapes in shape file layer for UWP Maps
+
+A `KML` file can be rendered with the help of the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html) in [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html). The KML file should be added as an embedded resource to the application project. The [`Uri`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Uri) of the KML file must be given in the following order:
+
+* Namespace of the project
+* Folder names
+* KmlFileName.kml
+
+
+
+{% highlight xml %}
+
+
+
+
+
+
+
+{% endhighlight %}
+
+
+
+
+
diff --git a/chart-sdk/uwp/Map/How-to/KML-Shapes-Rendered-in-SubShapeFileLayer.md b/chart-sdk/uwp/Map/How-to/KML-Shapes-Rendered-in-SubShapeFileLayer.md
new file mode 100644
index 000000000..5f6475f06
--- /dev/null
+++ b/chart-sdk/uwp/Map/How-to/KML-Shapes-Rendered-in-SubShapeFileLayer.md
@@ -0,0 +1,28 @@
+---
+layout: post
+title: How to render KML in sub shape file layer for UWP Maps | Syncfusion®
+description: Learn how to render KML shapes in a SubShapeFileLayer and configure KML files as embedded resources in UWP Maps.
+platform: chart-sdk
+control: SfMaps
+documentation: ug
+---
+
+# How to render KML shapes in sub shape file layer for UWP Maps
+
+A `KML` file can be rendered with the help of the [`SubShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SubShapeFileLayer.html) also in [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html). The KML file should be added as an embedded resource to the application project. For more information on the [`Uri`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Uri) for KML, refer to [KML rendering in ShapeFileLayer](/uwp/SfMap/KML-Shapes-Rendered-in-ShapeFileLayer).
+
+{% highlight xml %}
+
+
+
+
+
+
+
+
+
+
+
+{% endhighlight %}
+
+
diff --git a/chart-sdk/uwp/Map/KML-Shapes-Rendered-in-ShapeFileLayer.md b/chart-sdk/uwp/Map/KML-Shapes-Rendered-in-ShapeFileLayer.md
deleted file mode 100644
index ba1d96d23..000000000
--- a/chart-sdk/uwp/Map/KML-Shapes-Rendered-in-ShapeFileLayer.md
+++ /dev/null
@@ -1,34 +0,0 @@
----
-layout: post
-title: KML Shapes Rendered in ShapeFileLayer for SfMap control
-description: How to Render KML shapes in ShapeFileLayer?
-platform: chart-sdk
-control: SfMap
-documentation: ug
----
-
-# KML Shapes Rendered in ShapeFileLayer
-
-A `KML` file can be rendered with the help of the ShapeFileLayer in SfMap. The KML file should be added as an Embedded Resource to the application project. The URI of the KML file must be given in the following order:
-
-* Namespace of project
-* Folder names
-* KmlFileName.kml
-
-
-
-{% highlight xml %}
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-
-
-
-
diff --git a/chart-sdk/uwp/Map/KML-Shapes-Rendered-in-SubShapeFileLayer.md b/chart-sdk/uwp/Map/KML-Shapes-Rendered-in-SubShapeFileLayer.md
deleted file mode 100644
index d8f57ebe9..000000000
--- a/chart-sdk/uwp/Map/KML-Shapes-Rendered-in-SubShapeFileLayer.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-layout: post
-title: KML Shapes Rendered in SubShapeFileLayer for SfMaps control
-description: How to render KML files in SubShapeFileLayer?
-platform: chart-sdk
-control: SfMaps
-documentation: ug
----
-
-# KML Shapes Rendered in SubShapeFileLayer
-
-A `KML` file can be rendered with the help of SubShapeFileLayer also in SfMap. The KML file should be added as an `Embedded Resource` to the application project. For more information on the Uri for KML refer [KML rendering in ShapeFileLayer](/wpf/SfMap/KML-Shapes-Rendered-in-ShapeFileLayer)
-
-{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-
diff --git a/chart-sdk/uwp/Map/Legend.md b/chart-sdk/uwp/Map/Legend.md
index f7bf0b7b0..5d8c1b1c3 100644
--- a/chart-sdk/uwp/Map/Legend.md
+++ b/chart-sdk/uwp/Map/Legend.md
@@ -1,23 +1,23 @@
---
layout: post
-title: Legend in UWP Map control | Syncfusion
-description: Learn here all about Legend support in Syncfusion UWP Map (SfMaps) control and more.
+title: Legend in UWP Maps | Syncfusion®
+description: Legend in the UWP Maps identifies map elements, categories, and data ranges, helping users understand and interpret geographic data clearly.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Legend in UWP Map (SfMaps)
+# Legend Customization in UWP Maps
-A legend is a key to symbolism used on a map, usually containing swatches of symbols with descriptions. It provides valuable information for interpreting what the map is showing you, and can be represented in various colors and shapes based on the data.
+A legend is a key to the symbolism used on a map, usually containing swatches of symbols with descriptions. It provides valuable information for interpreting what the map is displaying, and can be represented in various colors and shapes based on the data.
-## Visibility of Legend
+## Visibility of Legend
-`Legends` are visible only by setting the `LegendVisibility` property of the `Visibility` type as Visible in the ShapeFileLayer.
+Legends are visible only by setting the [`LegendVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LegendVisibility) property of the `Visibility` type as `Visible` in the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html).
-## Positioning of Legend
+## Positioning of Legend
-Map legends can be positioned by setting the `LegendPosition` property in ShapeFileLayer. Also, the legend can be positioned based on the margin values for the x axis and the y axis with the help of the LegendPositionX and LegendPositionY properties available in ShapeFileLayer. For positioning the legend based on margins corresponding to a map, LegendPosition must be set with value of `Default`.
+Map legends can be positioned by setting the [`LegendPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LegendPosition) property in the `ShapeFileLayer`. Also, the legend can be positioned based on the margin values for the x-axis and the y-axis with the help of the [`LegendPositionX`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LegendPositionX) and [`LegendPositionY`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LegendPositionY) properties available in the `ShapeFileLayer`. For positioning the legend based on the margins corresponding to a map, `LegendPosition` must be set to `Default`.
-## Header for Legends
+## Header for Legends
-A header for the legend can be added by setting the `LegendHeader` property of the string type.
+A header for the legend can be added by setting the [`LegendHeader`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LegendHeader) property of the string type.
-## Categories of Legend
+## Categories of Legend
-`Legends` are categorized as two types:
+Legends are categorized into two types:
* Legends for shape layers.
* Legends for bubbles.
-These can be set using the LegendType property of the type LegendType.
+These can be set using the [`LegendType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LegendType) property of the [`LegendType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.LegendType.html) type.
-## Legends for Shapes
+## Legends for Shapes
-Layer shape type legends can be different shapes for the legend. The shapes can be set using the LegendIcon, of the LegendIcon type.
+Layer shape type legends can have different shapes for the legend. The shapes can be set using the [`LegendIcon`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LegendIcon) property of the [`LegendIcons`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.LegendIcons.html) type.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+{% endhighlight %}
+
+
-## Legends for Bubbles
-
-`Bubble` type legends are always bubbles with varying sizes. The size of the bubbles is obtained from the `SizeRatio` from the BubbleMarkerSetting.
+## Legends for Bubbles
+`Bubble` type legends are always bubbles with varying sizes. The size of the bubbles is obtained from the [`SizeRatio`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html#Syncfusion_UI_Xaml_Maps_BubbleMarkerSetting_SizeRatio) property of the [`BubbleMarkerSetting`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.BubbleMarkerSetting.html).
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-
-
-
-## Arranging the Legends
-
-Legends are arranged in matrix format. The number of columns in the arranging matrix can be set by setting the `LegendColumnSplit` property of the `int` type.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+{% endhighlight %}
+
+
+
+
+## Arranging the Legends
+
+Legends are arranged in a matrix format. The number of columns in the arranging matrix can be set by setting the [`LegendColumnSplit`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LegendColumnSplit) property of the `int` type.
diff --git a/chart-sdk/uwp/Map/Map-Points.md b/chart-sdk/uwp/Map/Map-Points.md
index f52bc5d71..1e09627b8 100644
--- a/chart-sdk/uwp/Map/Map-Points.md
+++ b/chart-sdk/uwp/Map/Map-Points.md
@@ -1,122 +1,97 @@
---
layout: post
-title: Map Points in SfMaps control
-description: How to display map points on a map?
+title: Point customization in UWP Maps | Syncfusion®
+description: Point customization in the UWP Maps display location-based data using markers, enabling visualization and interaction with geographic coordinates.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Map Points
+# Point customization in UWP Maps
-Points are one of the record type in `ShapeFileLayer`. `Points` are used to specify the specific point in the map. For example, Points are used to specify the capital of countries. Points in the shape file given as latitude and longitude coordinates in the shapes file. Those points should be converted as map points.
+Points are one of the record types in the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html). [`MapPoint`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapPoint.html) is used to specify a specific point on the map. For example, points are used to specify the capital of countries. Points in the shape file are given as latitude and longitude coordinates in the shapes file. Those points should be converted as map points.
## Customizing the MapPoint
-The default appearance of the `MapPoint` can be customized by using the MapPointTemplate property. The `MapPointTemplate` property is available in the ShapeFileLayer.
+The default appearance of the `MapPoint` can be customized by using the [`MapPointTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapPointTemplate) property. The `MapPointTemplate` property is available in the `ShapeFileLayer`.
## About MapPointTemplate Property
-`MapPointTemplate` is a DataTemplate type, used to customize or override the default template of `MapPoints`.
+[`MapPointTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapPointTemplate) is a `DataTemplate` type, used to customize or override the default template of `MapPoints`.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
## MapPointPopup
-`MapPointPopup` is a popup, displayed when the point is moved on MapPoint. It shows additional information from the object bounded with the MapPoint. You can get the object from dbf file.
+`MapPointPopup` is a popup displayed when the pointer is moved over a `MapPoint`. It shows additional information from the object bound with the `MapPoint`. You can get the object from the `.dbf` file.
### MapPointPopupTemplate
-`MapPointPopupTemplate` is a DataTemplate used to expose the template for the MapPoint.
+[`MapPointPopupTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapPointPopupTemplate) is a `DataTemplate` used to expose the template for the `MapPoint`.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
-
+
diff --git a/chart-sdk/uwp/Map/Map-Providers.md b/chart-sdk/uwp/Map/Map-Providers.md
index 7b54695a5..76735c23d 100644
--- a/chart-sdk/uwp/Map/Map-Providers.md
+++ b/chart-sdk/uwp/Map/Map-Providers.md
@@ -1,34 +1,34 @@
---
layout: post
-title: Map Providers in UWP Map control | Syncfusion
-description: Learn here all about Map Providers support in Syncfusion UWP Map (SfMaps) control and more.
+title: Providers in UWP Maps | Syncfusion®
+description: Providers in the UWP Maps supply map tile sources and geographic data, enabling visualization of locations and spatial information.
platform: chart-sdk
control: SfMap
documentation: ug
---
-# Map Providers in UWP Map (SfMaps)
+# Providers in UWP Maps
-SfMap control supports map providers such as `OpenStreetMap` and `Bing Map` that can be added to any layers in maps.
+The [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) control supports map providers such as `OpenStreetMap` and `Bing Map` that can be added to any layer in maps.
## Open Street Map
-`OpenStreetMap` is a map of the entire world. The OpenStreetMap allows you to view, edit and use geographical data in a collaborative way from any place on the Earth.
+`OpenStreetMap` is a map of the entire world. The OpenStreetMap allows you to view, edit, and use geographical data in a collaborative way from any place on the Earth.
### Enable OSM
-You can enable this feature by setting the `LayerType` property value as `OSM`.
+You can enable this feature by setting the [`LayerType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html#Syncfusion_UI_Xaml_Maps_ImageryLayer_LayerType) property value as `OSM`.
{% highlight xml %}
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
-
+
@@ -36,31 +36,31 @@ You can enable this feature by setting the `LayerType` property value as `OSM`
`Bing Map` is a key feature in accessing the external geospatial imagery services for deep-zoom satellite view.
-### Enable Bing Map
+### Enable Bing Map
-You can enable this feature by defining the LayerType as `Bing`.
+You can enable this feature by defining the [`LayerType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html#Syncfusion_UI_Xaml_Maps_ImageryLayer_LayerType) as `Bing`.
### Bing Map Key
-The bing Map key is provided as input to this key property. The Bing Map key can be obtained from
+The Bing Map key is provided as input to the [`BingMapKey`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html#Syncfusion_UI_Xaml_Maps_ImageryLayer_BingMapKey) property. The Bing Map key can be obtained from
-[http://www.microsoft.com/maps/create-a-bing-maps-key.aspx](http://www.microsoft.com/maps/create-a-bing-maps-key.aspx).
+[Bing Maps Dev Center](https://azure.microsoft.com/en-us/products/azure-maps/).
### Aerial View
{% highlight xml %}
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
-
+
### Road View
@@ -68,15 +68,15 @@ The bing Map key is provided as input to this key property. The Bing Map key c
{% highlight xml %}
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
-
+
@@ -85,84 +85,82 @@ The bing Map key is provided as input to this key property. The Bing Map key c
{% highlight xml %}
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
-
+
## Calculate zoom level based on map Geo-bounds or distance
This feature is used to calculate the initial zoom level automatically in two ways.
-* Distance in radius(Meter/KiloMeter/Mile)
-* Geo-bounds(Northeast, Southwest)
+* Distance in radius (Meter/KiloMeter/Mile)
+* Geo-bounds (Northeast, Southwest)
-### Distance in radius
+### Distance in radius
-Calculate the initial zoom level automatically based on the `Radius` and `DistanceType` properties of imagery layer class.
+Calculate the initial zoom level automatically based on the [`Radius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html#Syncfusion_UI_Xaml_Maps_ImageryLayer_Radius) and [`DistanceType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html#Syncfusion_UI_Xaml_Maps_ImageryLayer_DistanceType) properties of the [`ImageryLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html) class.
-N> `DistanceType` property default value is KiloMeter.
+N> The `DistanceType` property default value is `KiloMeter`.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
{% endhighlight %}
{% highlight c# %}
- SfMap maps = new SfMap();
- ImageryLayer layer = new ImageryLayer();
- layer.Center = new Point(38.909804, -77.043442);
- layer.Radius = 5;
- layer.DistanceType = DistanceType.KiloMeter;
- layer.Markers = obj.Models;
- layer.MarkerTemplate = this.Resources["markerTemplate"] as DataTemplate;
- maps.Layers.Add(layer);
-
- public class Model
- {
- public string Longitude { get; set; }
- public string Latitude { get; set; }
- }
-
- public class ViewModel
- {
- public ObservableCollection Models { get; set; }
- public ViewModel()
- {
- this.Models = new ObservableCollection();
- this.Models.Add(new Model() { Latitude = "38.909804", Longitude = "-77.043442" });
- }
- }
+SfMap maps = new SfMap();
+ImageryLayer layer = new ImageryLayer();
+layer.Center = new Point(38.909804, -77.043442);
+layer.Radius = 5;
+layer.DistanceType = DistanceType.KiloMeter;
+layer.Markers = obj.Models;
+layer.MarkerTemplate = this.Resources["markerTemplate"] as DataTemplate;
+maps.Layers.Add(layer);
+
+public class Model
+{
+ public string Longitude { get; set; }
+ public string Latitude { get; set; }
+}
+
+public class ViewModel
+{
+ public ObservableCollection Models { get; set; }
+ public ViewModel()
+ {
+ this.Models = new ObservableCollection();
+ this.Models.Add(new Model() { Latitude = "38.909804", Longitude = "-77.043442" });
+ }
+}
{% endhighlight %}
@@ -170,87 +168,87 @@ N> `DistanceType` property default value is KiloMeter.
### Geo-bounds
-Calculate the initial zoom level automatically based on the LatLngBounds(Northeast, Southwest) of imagery layer class.
+Calculate the initial zoom level automatically based on the [`LatLngBounds`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html#Syncfusion_UI_Xaml_Maps_ImageryLayer_LatLngBounds) (Northeast, Southwest) of the [`ImageryLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html) class.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfMap maps = new SfMap();
- ImageryLayer layer = new ImageryLayer();
- LatLngBounds bounds = new LatLngBounds();
- bounds.Northeast = new Point(38.909804, -77.043442);
- bounds.Southwest = new Point(38.909804, -77.043442);
- layer.LatLngBounds = bounds;
- layer.Markers = obj.Models;
- layer.MarkerTemplate = this.Resources["markerTemplate"] as DataTemplate;
- maps.Layers.Add(layer);
-
- public class Model
- {
- public string Longitude { get; set; }
- public string Latitude { get; set; }
- }
-
- public class ViewModel
- {
- public ObservableCollection Models { get; set; }
- public ViewModel()
- {
- this.Models = new ObservableCollection();
- this.Models.Add(new Model() { Latitude = "38.909804", Longitude = "-77.043442" });
- }
- }
+SfMap maps = new SfMap();
+ImageryLayer layer = new ImageryLayer();
+LatLngBounds bounds = new LatLngBounds();
+bounds.Northeast = new Point(38.909804, -77.043442);
+bounds.Southwest = new Point(38.909804, -77.043442);
+layer.LatLngBounds = bounds;
+layer.Markers = obj.Models;
+layer.MarkerTemplate = this.Resources["markerTemplate"] as DataTemplate;
+maps.Layers.Add(layer);
+
+public class Model
+{
+ public string Longitude { get; set; }
+ public string Latitude { get; set; }
+}
+
+public class ViewModel
+{
+ public ObservableCollection Models { get; set; }
+ public ViewModel()
+ {
+ this.Models = new ObservableCollection();
+ this.Models.Add(new Model() { Latitude = "38.909804", Longitude = "-77.043442" });
+ }
+}
{% endhighlight %}
{% endtabs %}
-N> When setting LatLngBounds and DistanceRadius at the same time, the priority is `DistanceRadius` and calculate zoom level based radius value.
+N> When setting [`LatLngBounds`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html#Syncfusion_UI_Xaml_Maps_ImageryLayer_LatLngBounds) and [`Radius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html#Syncfusion_UI_Xaml_Maps_ImageryLayer_Radius) at the same time, the priority is `Radius` and the zoom level is calculated based on the radius value.
-
+
## Get the map tile layer bounds
-You can get imagery layer pixel bounds by using `MapBounds` property while zooming, panning, and changing Geo-Coordinate value in imagery layer.
+You can get the imagery layer pixel bounds by using the [`MapBounds`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ImageryLayer.html#Syncfusion_UI_Xaml_Maps_ImageryLayer_MapBounds) property while zooming, panning, and changing the Geo-Coordinate value in the imagery layer.
{% tabs %}
{% highlight xaml %}
-
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
@@ -290,12 +288,12 @@ The [`MarkerSelected`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Map
## Reset the old custom view marker
-If you add any view for marker using `CustomView` property from [`MarkerSelected`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapLayer.html#Syncfusion_UI_Xaml_Maps_MapLayer_MarkerSelected) event, then the corresponding view will be applied to the selected marker. Custom view will be added continuously for all the selected marker, but do not have option to reset the old one. Now, you can achieve this using the [`ResetOldSelectedView`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapLayer.html#Syncfusion_UI_Xaml_Maps_MapLayer_ResetOldSelectedView) property. If the Boolean set as true, then it will be removed the old view of marker and load the initially rendered marker.
+If you add any view for a marker using the `CustomView` property from the [`MarkerSelected`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapLayer.html#Syncfusion_UI_Xaml_Maps_MapLayer_MarkerSelected) event, then the corresponding view will be applied to the selected marker. The custom view will be added continuously for all the selected markers, but there is no option to reset the old one. Now, you can achieve this using the [`ResetOldSelectedView`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapLayer.html#Syncfusion_UI_Xaml_Maps_MapLayer_ResetOldSelectedView) property. If the value is set to `true`, then it will remove the old view of the marker and load the initially rendered marker.
{% tabs %}
{% highlight xaml %}
-
+
@@ -306,15 +304,15 @@ If you add any view for marker using `CustomView` property from [`MarkerSelected
+
-
-
+
-
+
{% endhighlight %}
{% highlight c# %}
@@ -358,5 +356,5 @@ If you add any view for marker using `CustomView` property from [`MarkerSelected
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Map/Map-Selection.md b/chart-sdk/uwp/Map/Map-Selection.md
index f01167629..d97928971 100644
--- a/chart-sdk/uwp/Map/Map-Selection.md
+++ b/chart-sdk/uwp/Map/Map-Selection.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Map Selection in UWP Map control | Syncfusion
-description: Learn here all about Map Selection support in Syncfusion UWP Map (SfMaps) control and more.
+title: Selection in UWP Maps | Syncfusion®
+description: Selection in the UWP Maps enables users to highlight and interact with map elements for focused analysis and data exploration.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Map Selection in UWP Map (SfMaps)
+# Selection in UWP Maps
Each shape in the map can be selected and unselected when interacted with shapes. There are two ways to select the map shapes:
@@ -24,16 +24,16 @@ Single selection allows only one map shape to be selected at a time. You can sel
{% highlight html %}
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
@@ -45,17 +45,18 @@ Multiple shapes in the map can be selected when `EnableMultiSelection` of ShapeF
{% highlight html %}
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
diff --git a/chart-sdk/uwp/Map/Map-Shape-Labels.md b/chart-sdk/uwp/Map/Map-Shape-Labels.md
index 7fd716e9a..70896fb42 100644
--- a/chart-sdk/uwp/Map/Map-Shape-Labels.md
+++ b/chart-sdk/uwp/Map/Map-Shape-Labels.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Map Shape Labels in UWP Map control | Syncfusion
-description: Learn here all about Map Shape Labels support in Syncfusion UWP Map (SfMaps) control and more.
+title: Shape Labels in UWP Maps | Syncfusion®
+description: Shape labels in the UWP Maps display text for geographic regions, helping users identify and interpret location-based data clearly.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Map Shape Labels in UWP Map (SfMaps)
+# Shape Labels in UWP Maps
-`Labels` for map shapes can be displayed by using the `LabelPath` of `ShapeFileLayer`. The value of `LabelPath` must be a field name specified in the `.dbf` file corresponding to the shapefile.
+`Labels` for map shapes can be displayed by using the [`LabelPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LabelPath) property of the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html). The value of `LabelPath` must be a field name specified in the `.dbf` file corresponding to the shape file.
Gets or sets the field name in the database (.dbf) file.
{% highlight html %}
+
+
+
+
+
-
-
-
-
-
-
+{% endhighlight %}
-{% endhighlight %}
-
-The labels can also be customized by modifying the `ItemsTemplate` of ShapeFileLayer. The labels can be accessed by using DBFData as follows:
+The labels can also be customized by modifying the [`ItemsTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ItemsTemplate) of the `ShapeFileLayer`. The labels can be accessed by using `DBFData` as follows:
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+{% endhighlight %}
+
+
diff --git a/chart-sdk/uwp/Map/MapPopup.md b/chart-sdk/uwp/Map/MapPopup.md
index e5ba6c982..6bc6da179 100644
--- a/chart-sdk/uwp/Map/MapPopup.md
+++ b/chart-sdk/uwp/Map/MapPopup.md
@@ -1,73 +1,70 @@
---
layout: post
-title: MapPopup in UWP Map control | Syncfusion
-description: Learn here all about MapPopup support in Syncfusion UWP Map (SfMaps) control and more.
+title: Interactive Popup in UWP Maps | Syncfusion®
+description: Interactive popup in the UWP Maps displays additional information for map elements, enabling users to view detailed location-based data.
platform: chart-sdk
control: SfMaps
documentation: ug
---
+# Interactive Popup in UWP Maps
-# MapPopup in UWP Map (SfMaps)
+`MapPopup` is a hanging window displayed when the shape is tapped. It shows additional information from the object bound with the shape. By default, it takes the property of the bound object that is referred in the [`ShapeValuePath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeValuePath) and displays its content when the corresponding shape is tapped.
-`MapPopup` is a hanging window, displayed when the shape is tapped. It shows additional information from the object bounded with the shape. By default, it takes the property of the bounded object that is referred in the `ShapeValuePath` and displays its content when the corresponding shape is tapped.
+`MapPopup` is displayed only when [`MapPopupVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapPopupVisibility) is set to `Visible` in the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html).
-MapPopup is displayed only when `MapPopupVisibility` set to true in the shape file layer.
-
-It also customizes the MapPopup template. `MapPopupCustomTemplate` is a DataTemplate type API that is used to expose the custom template for the MapPopup.
+It also customizes the `MapPopup` template. [`PopupCustomTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_PopupCustomTemplate) is a `DataTemplate` type API that is used to expose the custom template for the `MapPopup`.
{% highlight html %}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
+{% endhighlight %}
-
+
diff --git a/chart-sdk/uwp/Map/Multilayer-Support.md b/chart-sdk/uwp/Map/Multilayer-Support.md
index 533a92b66..a1d797e3e 100644
--- a/chart-sdk/uwp/Map/Multilayer-Support.md
+++ b/chart-sdk/uwp/Map/Multilayer-Support.md
@@ -1,253 +1,233 @@
---
layout: post
-title: Multilayer Support in UWP Map control | Syncfusion
-description: Learn here all about Multilayer Support support in Syncfusion UWP Map (SfMaps) control and more.
+title: Multilayer Support in UWP Maps | Syncfusion®
+description: Multilayer support in the UWP Maps enables multiple map layers to be displayed together for enhanced geographic visualization and analysis.
platform: chart-sdk
control: Maps
documentation: ug
---
-# Multilayer Support in UWP Map (SfMaps)
+# Multilayer Support in UWP Maps
-`Multilayer` support allows you to load multiple shapefiles in a single container, enabling maps to display more detail.
+`Multilayer` support allows you to load multiple shape files in a single container, enabling maps to display more detail.
## Loading Multiple Shapefiles in a Single Container
-This feature enables the map to load multiple types of shapefiles in a single container. Basically, shape files contain point shapes in a single container.
+This feature enables the map to load multiple types of shape files in a single container. Basically, shape files contain point shapes in a single container.
-Situations arise where, any combination of available shapefiles needs to be loaded in a single container. In such situations this feature enables the map to load multiple shape layers in a single container.
+Situations arise where any combination of available shape files needs to be loaded in a single container. In such situations, this feature enables the map to load multiple shape layers in a single container.
## Adding Multiple Layers in the Map
-`ShapeFileLayer` is the core layer for the map. Multiple layers can be added in the ShapeFileLayer itself. They have to be added in SubShapeFileLayers within the ShapeFileLayer.
+[`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html) is the core layer for the map. Multiple layers can be added in the `ShapeFileLayer` itself. They have to be added in the [`SubShapeFileLayers`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_SubShapeFileLayers) within the `ShapeFileLayer`.
## SubShapeFileLayers
-`SubShapeFileLayers` is the collection of `SubShapeFileLayer`. SubShapeFileLayer is also a type of shapefile layer. The following code adds multiple layers in the ShapeFileLayer.
+[`SubShapeFileLayers`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_SubShapeFileLayers) is a collection of [`SubShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SubShapeFileLayer.html). `SubShapeFileLayer` is also a type of shape file layer. The following code adds multiple layers in the `ShapeFileLayer`.
-{%tabs%}
+{% tabs %}
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
+
+
-
+
-
+
-
-
+
+
-
-
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-{% highlight C# %}
-
- public class Country : INotifyPropertyChanged
- {
- public string NAME { get; set; }
- private Visibility visibility = Visibility.Visible;
- public Visibility ItemsVisibility
- {
- get { return visibility; }
- set { visibility = value; }
- }
- private double weather { get; set; }
- public double Weather
- {
- get
- {
- return weather;
- }
- set
- {
- weather = value;
- }
- }
- private double population { get; set; }
- public double Population
- {
- get
- {
- return population;
- }
- set
- {
- population = value;
- OnPropertyChanged(new PropertyChangedEventArgs("Population"));
- }
- }
- public string PopulationFormat { get; set; }
- public event PropertyChangedEventHandler PropertyChanged;
- public void OnPropertyChanged(PropertyChangedEventArgs e)
- {
- this.PopulationFormat = (String.Format("{0:0,0}", this.Population).Trim('$'));
- if (PropertyChanged != null)
- {
- PropertyChanged(this, e);
- }
- }
- }
- public class MapViewModel
- {
- public ObservableCollection Multilayer { get; set; }
- public ObservableCollection AfricaList { get; set; }
- public ObservableCollection OceaniaList { get; set; }
- public MapViewModel()
- {
- this.OceaniaList.Add(new Country() { NAME = "New South Wales", Weather = 26 });
- this.OceaniaList.Add(new Country() { NAME = "Queensland", Weather = 30 });
- this.OceaniaList.Add(new Country() { NAME = "Tasmania", Weather = 21 });
- this.OceaniaList.Add(new Country() { NAME = "Western Australia", Weather = 32 });
- this.AfricaList = new ObservableCollection();
- this.AfricaList.Add(new Country() { NAME = "Algeria", Weather = 47 });
- this.AfricaList.Add(new Country() { NAME = "Congo (Brazzaville)", Weather = 45 });
- this.AfricaList.Add(new Country() { NAME = "Ethiopia", Weather = 50 });
- this.AfricaList.Add(new Country() { NAME = "South Africa", Weather = 30 });
- this.Multilayer = new ObservableCollection();
- this.Multilayer.Add(new Country() { NAME = "Asia", Weather = 40 });
- this.Multilayer.Add(new Country() { NAME = "South America", Weather = 45 });
- this.Multilayer.Add(new Country() { NAME = "North America", Weather = 52 });
- this.Multilayer.Add(new Country() { NAME = "Antarctica", ItemsVisibility = Visibility.Collapsed });
- this.Multilayer.Add(new Country() { NAME = "Oceania", ItemsVisibility = Visibility.Collapsed });
- this.Multilayer.Add(new Country() { NAME = "Europe", ItemsVisibility = Visibility.Collapsed });
- this.Multilayer.Add(new Country() { NAME = "Africa", ItemsVisibility = Visibility.Collapsed });
- }
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+{% endhighlight %}
+{% highlight c# %}
+
+public class Country : INotifyPropertyChanged
+{
+ public string NAME { get; set; }
+ private Visibility visibility = Visibility.Visible;
+ public Visibility ItemsVisibility
+ {
+ get { return visibility; }
+ set { visibility = value; }
+ }
+ private double weather { get; set; }
+ public double Weather
+ {
+ get
+ {
+ return weather;
+ }
+ set
+ {
+ weather = value;
+ }
+ }
+ private double population { get; set; }
+ public double Population
+ {
+ get
+ {
+ return population;
+ }
+ set
+ {
+ population = value;
+ OnPropertyChanged(new PropertyChangedEventArgs("Population"));
+ }
+ }
+ public string PopulationFormat { get; set; }
+ public event PropertyChangedEventHandler PropertyChanged;
+ public void OnPropertyChanged(PropertyChangedEventArgs e)
+ {
+ this.PopulationFormat = (String.Format("{0:0,0}", this.Population).Trim('$'));
+ if (PropertyChanged != null)
+ {
+ PropertyChanged(this, e);
+ }
}
+}
+
+public class MapViewModel
+{
+ public ObservableCollection Multilayer { get; set; }
+ public ObservableCollection AfricaList { get; set; }
+ public ObservableCollection OceaniaList { get; set; }
+ public MapViewModel()
+ {
+ this.OceaniaList.Add(new Country() { NAME = "New South Wales", Weather = 26 });
+ this.OceaniaList.Add(new Country() { NAME = "Queensland", Weather = 30 });
+ this.OceaniaList.Add(new Country() { NAME = "Tasmania", Weather = 21 });
+ this.OceaniaList.Add(new Country() { NAME = "Western Australia", Weather = 32 });
+ this.AfricaList = new ObservableCollection();
+ this.AfricaList.Add(new Country() { NAME = "Algeria", Weather = 47 });
+ this.AfricaList.Add(new Country() { NAME = "Congo (Brazzaville)", Weather = 45 });
+ this.AfricaList.Add(new Country() { NAME = "Ethiopia", Weather = 50 });
+ this.AfricaList.Add(new Country() { NAME = "South Africa", Weather = 30 });
+ this.Multilayer = new ObservableCollection();
+ this.Multilayer.Add(new Country() { NAME = "Asia", Weather = 40 });
+ this.Multilayer.Add(new Country() { NAME = "South America", Weather = 45 });
+ this.Multilayer.Add(new Country() { NAME = "North America", Weather = 52 });
+ this.Multilayer.Add(new Country() { NAME = "Antarctica", ItemsVisibility = Visibility.Collapsed });
+ this.Multilayer.Add(new Country() { NAME = "Oceania", ItemsVisibility = Visibility.Collapsed });
+ this.Multilayer.Add(new Country() { NAME = "Europe", ItemsVisibility = Visibility.Collapsed });
+ this.Multilayer.Add(new Country() { NAME = "Africa", ItemsVisibility = Visibility.Collapsed });
+ }
+}
+
{% endhighlight %}
-
-{%endtabs%}
+{% endtabs %}
-
+
## Layout type
-The LayoutType defines how to project the map. This can be categorized into the following types:
-
- * Default
- * Tile
+The [`LayoutType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_LayoutType) defines how to project the map. This can be categorized into the following types:
+
+* Default
+* Tile
### Default
-In the default layout, the maps will be rendered based on the given points of shape file without any further manipulation of maps scale.
+In the default layout, the maps will be rendered based on the given points of the shape file without any further manipulation of the map scale.
{% highlight xaml %}
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
+ShapeFileLayer layer = new ShapeFileLayer();
+layer.Uri = "Maps.Assets.world1.shp";
+layer.LayoutType = LayoutType.Default;
- ShapeFileLayer layer = new ShapeFileLayer();
- layer.Uri = "Maps.Assets.world1.shp";
- layer.LayoutType = LayoutType.Default;
-
- ShapeSetting setting = new ShapeSetting();
- setting.ShapeFill = new SolidColorBrush(Colors.Gray);
- setting.ShapeStroke= new SolidColorBrush(Colors.Black);
- setting.ShapeStrokeThickness = 0.5;
+ShapeSetting setting = new ShapeSetting();
+setting.ShapeFill = new SolidColorBrush(Colors.Gray);
+setting.ShapeStroke = new SolidColorBrush(Colors.Black);
+setting.ShapeStrokeThickness = 0.5;
- layer.ShapeSettings = setting;
- map.Layers.Add(layer);
+layer.ShapeSettings = setting;
+map.Layers.Add(layer);
{% endhighlight %}
-
+
### Tile
-In the tile layout, the maps scale value is maintained in every direction around a point. Therefore, the shapes are represented accurately and without distortion for small areas
+In the tile layout, the map scale value is maintained in every direction around a point. Therefore, the shapes are represented accurately and without distortion for small areas.
{% highlight xaml %}
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- ShapeFileLayer layer = new ShapeFileLayer();
- layer.Uri = "Maps.Assets.world1.shp";
- layer.LayoutType = LayoutType.Tile;
+ShapeFileLayer layer = new ShapeFileLayer();
+layer.Uri = "Maps.Assets.world1.shp";
+layer.LayoutType = LayoutType.Tile;
- ShapeSetting setting = new ShapeSetting();
- setting.ShapeFill = new SolidColorBrush(Colors.Gray);
- setting.ShapeStroke= new SolidColorBrush(Colors.Black);
- setting.ShapeStrokeThickness = 0.5;
+ShapeSetting setting = new ShapeSetting();
+setting.ShapeFill = new SolidColorBrush(Colors.Gray);
+setting.ShapeStroke = new SolidColorBrush(Colors.Black);
+setting.ShapeStrokeThickness = 0.5;
- layer.ShapeSettings = setting;
- map.Layers.Add(layer);
+layer.ShapeSettings = setting;
+map.Layers.Add(layer);
{% endhighlight %}
-
+
diff --git a/chart-sdk/uwp/Map/Overview.md b/chart-sdk/uwp/Map/Overview.md
index 04d98e236..5c1fd9afa 100644
--- a/chart-sdk/uwp/Map/Overview.md
+++ b/chart-sdk/uwp/Map/Overview.md
@@ -1,19 +1,19 @@
---
layout: post
-title: About UWP Map control | Syncfusion
-description: Learn here all about introduction of Syncfusion Essential Studio UWP Map (SfMaps) control, its elements and more.
+title: About Syncfusion® UWP Maps Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Maps control, its features, capabilities, and more details.
platform: chart-sdk
control: SfMap
documentation: ug
---
-# UWP Map (SfMaps) Overview
+# About Syncfusion® UWP Maps Control
-A map is a graphical representation of geographical data. It is used to represent the statistical data of a particular geographical area on Earth. Panning and Zooming enables navigation around the map. `Data Visualization` can be enhanced in the map control with bubbles and labels. Bubbles and labels visualize the data that is bound to the map.
+A map is a graphical representation of geographical data. It is used to represent the statistical data of a particular geographical area on Earth. Panning and zooming enable navigation around the map. Data visualization can be enhanced in the map control with bubbles and labels. Bubbles and labels visualize the data that is bound to the map.
## Use case scenario
-The Maps control can be used in following cases:
+The Maps control can be used in the following cases:
* To visualize weather data.
* To visualize geographical statistics information.
@@ -23,20 +23,17 @@ The Maps control can be used in following cases:
## Key Concepts of Map
+A map contains a set of elements, including shapes, bubbles, annotations, and data items, that are maintained in layers. The [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html) is one of the layers that generates map shapes and binds business objects with them. Bubbles and map items enhance the data visualization capabilities of the map with data binding.
-A map contains a set of elements, including shapes, bubbles, annotations, and data items, that is maintained in layers. `ShapeFileLayer` is one of the layers that generates map shapes and bind business objects with them. `Bubbles` and `MapItems` enhance the data visualization capabilities of the map with data binding.
-
-`Treemap` like support provides rich UI for shapes and bubbles. `Markers` and `CustomDataBinding` items shows additional information on the map.
+Tree map-like support provides a rich UI for shapes and bubbles. Markers and custom data binding items show additional information on the map.
Options like zooming, panning, and map selection extend the interactivity of the map.
-
-
-
+
## Structure of Map
-A map is maintained through layers. The shape file layer is one of the layers that consist of vector shapes, bubbles and data visual items.
+A map is maintained through layers. The [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html) is one of the layers that consists of vector shapes, bubbles, and data visual items.
diff --git a/chart-sdk/uwp/Map/ShapeType.md b/chart-sdk/uwp/Map/ShapeType.md
index 983c0011f..86fc855b5 100644
--- a/chart-sdk/uwp/Map/ShapeType.md
+++ b/chart-sdk/uwp/Map/ShapeType.md
@@ -1,286 +1,270 @@
---
layout: post
-title: Shape Types in UWP Maps control | Syncfusion
-description: Learn about the Shape Types support in the Syncfusion UWP Maps (SfMaps) control, including its elements and more.
+title: Shape Types in UWP Maps | Syncfusion®
+description: Shape types in the UWP Maps define how geographic regions are rendered, enabling visualization of location-based data using map shapes.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Shape Types in UWP Maps (SfMaps)
+# Shape Types in UWP Maps
This feature allows you to draw a polygon, polyline, or circle on the map. You can provide input as Geo points to draw shapes in two different ways:
- 1.Add shapes using map element collection
- 2.Add shapes using point collection
-
+1. Add shapes using map element collection
+2. Add shapes using point collection
+
## Add shapes using map element collection
-You can provide input as a Geo points collection to add multiple shapes in a single layer by using the [`MapElements`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapElements) property of shape layer. There are three types of shapes available in map element.
+You can provide input as a Geo points collection to add multiple shapes in a single layer by using the [`MapElements`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapElements) property of the shape layer. There are three types of shapes available in the map element.
- 1.MapPolygon
- 2.MapPolyline
- 3.MapCircle
+1. MapPolygon
+2. MapPolyline
+3. MapCircle
### MapPolygon
-You can add polygon shape on map using [`MapPolygon`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapPolygon.html) class and provide Geo points collection to `Points` property. Polygon shape type is used to defines a group of land, water bodies, and other features with a spatial extent.
+You can add a polygon shape on the map using the [`MapPolygon`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapPolygon.html) class and provide a Geo points collection to the [`Points`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapShape.html#Syncfusion_UI_Xaml_Maps_MapShape_Points) property. The polygon shape type is used to define a group of land, water bodies, and other features with a spatial extent.
{% tabs %}
{% highlight xaml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- public partial class MyPage : ContentPage
+public partial class MyPage : ContentPage
+{
+ public MyPage()
{
-
- public MyPage()
- {
- InitializeComponent();
- ViewModel viewModel = new ViewModel();
- SfMap maps = new SfMap();
- maps.ZoomLevel = 4;
- ImageryLayer layer = new ImageryLayer();
- SubShapeFileLayer subLayer = new SubShapeFileLayer();
- layer.GeoCoordinates = new Point(30.9709225, -100.2187212);
-
- MapPolygon mapPolygon = new MapPolygon();
- mapPolygon.Fill = new SolidColorBrush(Colors.Blue);
- mapPolygon.Stroke = new SolidColorBrush(Colors.DarkBlue);
- mapPolygon.StrokeThickness = 4;
- mapPolygon.Points = viewModel.PolygonPoints1;
- subLayer.MapElements.Add(mapPolygon);
-
- mapPolygon = new MapPolygon();
- mapPolygon.Fill = new SolidColorBrush(Colors.Orange);
- mapPolygon.Stroke = new SolidColorBrush(Colors.Red);
- mapPolygon.StrokeThickness = 4;
- mapPolygon.Points = viewModel.PolygonPoints2;
- subLayer.MapElements.Add(mapPolygon);
-
- layer.SubShapeFileLayers.Add(subLayer);
- maps.Layers.Add(layer);
- this.Content = maps;
- }
+ InitializeComponent();
+ ViewModel viewModel = new ViewModel();
+ SfMap maps = new SfMap();
+ maps.ZoomLevel = 4;
+ ImageryLayer layer = new ImageryLayer();
+ SubShapeFileLayer subLayer = new SubShapeFileLayer();
+ layer.GeoCoordinates = new Point(30.9709225, -100.2187212);
+
+ MapPolygon mapPolygon = new MapPolygon();
+ mapPolygon.Fill = new SolidColorBrush(Colors.Blue);
+ mapPolygon.Stroke = new SolidColorBrush(Colors.DarkBlue);
+ mapPolygon.StrokeThickness = 4;
+ mapPolygon.Points = viewModel.PolygonPoints1;
+ subLayer.MapElements.Add(mapPolygon);
+
+ mapPolygon = new MapPolygon();
+ mapPolygon.Fill = new SolidColorBrush(Colors.Orange);
+ mapPolygon.Stroke = new SolidColorBrush(Colors.Red);
+ mapPolygon.StrokeThickness = 4;
+ mapPolygon.Points = viewModel.PolygonPoints2;
+ subLayer.MapElements.Add(mapPolygon);
+
+ layer.SubShapeFileLayers.Add(subLayer);
+ maps.Layers.Add(layer);
+ this.Content = maps;
}
+}
- public class ViewModel
+public class ViewModel
+{
+ public ObservableCollection PolygonPoints1
{
- public ObservableCollection PolygonPoints1
- {
- get; set;
- }
+ get; set;
+ }
- public ObservableCollection PolygonPoints2
+ public ObservableCollection PolygonPoints2
+ {
+ get; set;
+ }
+ public ViewModel()
+ {
+ PolygonPoints1 = new ObservableCollection()
{
- get; set;
- }
- public ViewModel()
+ new Point(37.042972, -109.085003),
+ new Point(40.992567, -109.021030),
+ new Point(40.968420, -102.048065),
+ new Point(36.991893, -102.144024),
+ new Point(37.042972, -109.085003)
+ };
+ PolygonPoints2 = new ObservableCollection()
{
-
- PolygonPoints1 = new ObservableCollection()
- {
- new Point(37.042972,-109.085003),
- new Point(40.992567,-109.021030),
- new Point(40.968420,-102.048065),
- new Point(36.991893,-102.144024),
- new Point(37.042972,-109.085003)
- };
- PolygonPoints2 = new ObservableCollection()
- {
- new Point(41.04621681452063, -104.0625),
- new Point(41.04621681452063, -102.0849609375),
- new Point(40.01078714046552, -102.041015625),
- new Point(40.04443758460856, -95.44921875),
- new Point(42.48830197960227, -96.3720703125),
- new Point(43.03677585761058, -98.4375),
- new Point(43.068887774169625, -104.0625),
- new Point(41.04621681452063, -104.0625),
- };
- }
+ new Point(41.04621681452063, -104.0625),
+ new Point(41.04621681452063, -102.0849609375),
+ new Point(40.01078714046552, -102.041015625),
+ new Point(40.04443758460856, -95.44921875),
+ new Point(42.48830197960227, -96.3720703125),
+ new Point(43.03677585761058, -98.4375),
+ new Point(43.068887774169625, -104.0625),
+ new Point(41.04621681452063, -104.0625)
+ };
}
-
+}
+
{% endhighlight %}
{% endtabs %}
-
+
### MapPolyline
-You can add polyline shape on map using [`MapPolyline`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapPolyline.html) class and provide Geo points collection to `Points`. Polylines are frequently used to define linear features such as roads, rivers, and power lines.
+You can add a polyline shape on the map using the [`MapPolyline`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapPolyline.html) class and provide a Geo points collection to the [`Points`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapShape.html#Syncfusion_UI_Xaml_Maps_MapShape_Points) property. Polylines are frequently used to define linear features such as roads, rivers, and power lines.
{% tabs %}
{% highlight xaml %}
-
-
-
-
-
-
-
-
-
- 51.5008, -0.1224
- 48.8567, 2.3508
- 52.5166, 13.3833
- 48.21327949272514, 16.388290236693138
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+ 51.5008, -0.1224
+ 48.8567, 2.3508
+ 52.5166, 13.3833
+ 48.21327949272514, 16.388290236693138
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- public partial class MyPage : ContentPage
+public partial class MyPage : ContentPage
+{
+ public MyPage()
{
-
- public MyPage()
+ InitializeComponent();
+ SfMap maps = new SfMap();
+ maps.ZoomLevel = 5;
+ ImageryLayer layer = new ImageryLayer();
+ layer.GeoCoordinates = new Point(49.9709225, 10.2187212);
+ SubShapeFileLayer subLayer = new SubShapeFileLayer();
+ MapPolyline mapPolyline = new MapPolyline();
+ mapPolyline.Stroke = new SolidColorBrush(Colors.Black);
+ mapPolyline.Points = new ObservableCollection()
{
- InitializeComponent();
-
- SfMap maps = new SfMap();
- maps.ZoomLevel = 5;
- ImageryLayer layer = new ImageryLayer();
- layer.GeoCoordinates = new Point(49.9709225, 10.2187212);
- SubShapeFileLayer subLayer = new SubShapeFileLayer();
- MapPolyline mapPolyline = new MapPolyline();
- mapPolyline.Stroke = new SolidColorBrush(Colors.Black);
- mapPolyline.Points = new ObservableCollection()
- {
- new Point(51.5008, -0.1224),
- new Point(48.8567, 2.3508),
- new Point(52.5166, 13.3833),
- new Point(48.21327949272514, 16.388290236693138)
- };
- subLayer.MapElements.Add(mapPolyline);
-
- layer.SubShapeFileLayers.Add(subLayer);
- maps.Layers.Add(layer);
- this.Content = maps;
- }
+ new Point(51.5008, -0.1224),
+ new Point(48.8567, 2.3508),
+ new Point(52.5166, 13.3833),
+ new Point(48.21327949272514, 16.388290236693138)
+ };
+ subLayer.MapElements.Add(mapPolyline);
+
+ layer.SubShapeFileLayers.Add(subLayer);
+ maps.Layers.Add(layer);
+ this.Content = maps;
}
-
+}
+
{% endhighlight %}
{% endtabs %}
-
+
### MapCircle
-A circle has a single Geo coordinate value and it can be positioned on map using [`Center`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html#Syncfusion_UI_Xaml_Maps_MapCircle_Center) property of [`MapCircle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html). The circles are often used to define features such as oil wells, landmarks, and elevations.
+A circle has a single Geo coordinate value and it can be positioned on the map using the [`Center`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html#Syncfusion_UI_Xaml_Maps_MapCircle_Center) property of the [`MapCircle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html). The circles are often used to define features such as oil wells, landmarks, and elevations.
-* [`Center`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html#Syncfusion_UI_Xaml_Maps_MapCircle_Center) - Holds latitude and longitude values that defines the center of the circle.
+* [`Center`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html#Syncfusion_UI_Xaml_Maps_MapCircle_Center) - Holds latitude and longitude values that define the center of the circle.
{% capture codesnippet1 %}
{% tabs %}
-{% highlight xaml %}
-
-
-
-
-
-
-
-
-
-
- 43.76140927456403, -79.35451013248883
-
-
-
-
- 40.7324105, -74.4416047
-
-
-
-
-
- 38.8781708, -77.1889971
-
-
-
-
-
-
-
-
-
+{% highlight xaml %}
+
+
+
+
+
+
+
+
+
+ 43.76140927456403, -79.35451013248883
+
+
+
+
+ 40.7324105, -74.4416047
+
+
+
+
+ 38.8781708, -77.1889971
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- public partial class MyPage : ContentPage
+public partial class MyPage : ContentPage
+{
+ public MyPage()
{
-
- public MyPage()
- {
- InitializeComponent();
-
- SfMap maps = new SfMap();
- maps.ZoomLevel = 4;
- ImageryLayer layer = new ImageryLayer();
- layer.GeoCoordinates = new Point(42.9709225, -90.2187212);
- SubShapeFileLayer subLayer = new SubShapeFileLayer();
- MapCircle mapCircle = new MapCircle();
- mapCircle.Fill = new SolidColorBrush(Colors.Blue);
- mapCircle.Center = new Point(43.76140927456403, -79.35451013248883);
- subLayer.MapElements.Add(mapCircle);
-
- mapCircle = new MapCircle();
- mapCircle.Fill = new SolidColorBrush(Colors.Blue);
- mapCircle.Center = new Point(40.7324105, -74.4416047);
- subLayer.MapElements.Add(mapCircle);
-
- mapCircle = new MapCircle();
- mapCircle.Fill = new SolidColorBrush(Colors.Blue);
- mapCircle.Center = new Point(38.8781708, -77.1889971);
- subLayer.MapElements.Add(mapCircle);
-
- layer.SubShapeFileLayers.Add(subLayer);
- maps.Layers.Add(layer);
- this.Content = maps;
- }
+ InitializeComponent();
+ SfMap maps = new SfMap();
+ maps.ZoomLevel = 4;
+ ImageryLayer layer = new ImageryLayer();
+ layer.GeoCoordinates = new Point(42.9709225, -90.2187212);
+ SubShapeFileLayer subLayer = new SubShapeFileLayer();
+ MapCircle mapCircle = new MapCircle();
+ mapCircle.Fill = new SolidColorBrush(Colors.Blue);
+ mapCircle.Center = new Point(43.76140927456403, -79.35451013248883);
+ subLayer.MapElements.Add(mapCircle);
+
+ mapCircle = new MapCircle();
+ mapCircle.Fill = new SolidColorBrush(Colors.Blue);
+ mapCircle.Center = new Point(40.7324105, -74.4416047);
+ subLayer.MapElements.Add(mapCircle);
+
+ mapCircle = new MapCircle();
+ mapCircle.Fill = new SolidColorBrush(Colors.Blue);
+ mapCircle.Center = new Point(38.8781708, -77.1889971);
+ subLayer.MapElements.Add(mapCircle);
+
+ layer.SubShapeFileLayers.Add(subLayer);
+ maps.Layers.Add(layer);
+ this.Content = maps;
}
+}
-
{% endhighlight %}
{% endtabs %}
@@ -289,326 +273,313 @@ A circle has a single Geo coordinate value and it can be positioned on map usin
{{ codesnippet1 | UnOrderList_Indent_Level_1 }}
-
+
### Customization of map elements
-The following properties are used to customize [`MapPolygon`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapPolygon.html), [`MapPolyline`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapPolyline.html), and [`MapCircle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html).
+The following properties are used to customize the [`MapPolygon`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapPolygon.html), [`MapPolyline`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapPolyline.html), and [`MapCircle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html).
* [`Fill`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapElement.html#Syncfusion_UI_Xaml_Maps_MapElement_Fill), [`Stroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapElement.html#Syncfusion_UI_Xaml_Maps_MapElement_Stroke), [`StrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapElement.html#Syncfusion_UI_Xaml_Maps_MapElement_StrokeThickness) - Used to customize the appearance of the map element's shape UI.
-* [`Radius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html#Syncfusion_UI_Xaml_Maps_MapCircle_Radius) - Used to customize radius or range of the map circle. This property is available only for [`MapCircle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html).
+* [`Radius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html#Syncfusion_UI_Xaml_Maps_MapCircle_Radius) - Used to customize the radius or range of the map circle. This property is available only for [`MapCircle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapCircle.html).
{% tabs %}
-{% highlight xaml %}
-
-
-
-
-
-
-
-
-
-
- 43.76140927456403, -79.35451013248883
-
-
-
-
-
-
-
-
-
+{% highlight xaml %}
+
+
+
+
+
+
+
+
+
+ 43.76140927456403, -79.35451013248883
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- public partial class MyPage : ContentPage
+public partial class MyPage : ContentPage
+{
+ public MyPage()
{
-
- public MyPage()
- {
- InitializeComponent();
-
- SfMap maps = new SfMap();
- maps.ZoomLevel = 4;
- ImageryLayer layer = new ImageryLayer();
- layer.GeoCoordinates = new Point(42.9709225, -90.2187212);
- SubShapeFileLayer subLayer = new SubShapeFileLayer();
- MapCircle mapCircle = new MapCircle();
- mapCircle.Fill = new SolidColorBrush(Color.FromArgb(115, 255, 0, 0));
- mapCircle.StrokeThickness = 3;
- mapCircle.Stroke = new SolidColorBrush(Color.FromArgb(62, 255, 0, 0));
- mapCircle.Radius = 110;
- mapCircle.Center = new Point(43.76140927456403, -79.35451013248883);
- subLayer.MapElements.Add(mapCircle);
-
- layer.SubShapeFileLayers.Add(subLayer);
- maps.Layers.Add(layer);
- this.Content = maps;
- }
+ InitializeComponent();
+ SfMap maps = new SfMap();
+ maps.ZoomLevel = 4;
+ ImageryLayer layer = new ImageryLayer();
+ layer.GeoCoordinates = new Point(42.9709225, -90.2187212);
+ SubShapeFileLayer subLayer = new SubShapeFileLayer();
+ MapCircle mapCircle = new MapCircle();
+ mapCircle.Fill = new SolidColorBrush(Color.FromArgb(115, 255, 0, 0));
+ mapCircle.StrokeThickness = 3;
+ mapCircle.Stroke = new SolidColorBrush(Color.FromArgb(62, 255, 0, 0));
+ mapCircle.Radius = 110;
+ mapCircle.Center = new Point(43.76140927456403, -79.35451013248883);
+ subLayer.MapElements.Add(mapCircle);
+
+ layer.SubShapeFileLayers.Add(subLayer);
+ maps.Layers.Add(layer);
+ this.Content = maps;
}
+}
-
{% endhighlight %}
{% endtabs %}
-
+
## Add shapes using point collection
You can add more number of shapes on map by using [`SubShapeFileLayer`](https://help.syncfusion.com/uwp/map/multilayer-support#subshapefilelayers) and `Points` collection property which contains the Geo coordinate points to draw a shape. In shape file layer, there are three type of shapes available and it can be changed by using the [`ShapeType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeType.html) property.
- 1.Polygon
- 2.Polyline
- 3.Point icon
-
+1. Polygon
+2. Polyline
+3. Point icon
+
You can customize the appearance of the shape UI by setting [`ShapeFill`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeFill), [`ShapeStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeStroke), and [`ShapeStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeStrokeThickness) properties in [`ShapeSetting`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html).
### Polygon
-You can add polygon shape on map by using [`Points`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Points) collection property of shape layer or sub layer and set [`ShapeType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeType.html) as `Polygon`. Polygon shape type defines a group of land, water bodies, and other features with a spatial extent.
+You can add a polygon shape on the map by using the [`Points`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Points) collection property of the shape layer or sub layer and set [`ShapeType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeType.html) as `Polygon`. The polygon shape type defines a group of land, water bodies, and other features with a spatial extent.
{% tabs %}
{% highlight xaml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- public partial class MainPage : ContentPage
+public partial class MainPage : ContentPage
+{
+ ViewModel obj = new ViewModel();
+ public MainPage()
{
- ViewModel obj = new ViewModel();
- public MainPage()
- {
- InitializeComponent();
- this.DataContext = obj;
- SfMap maps = new SfMap();
- maps.ZoomLevel = 4;
- ImageryLayer layer = new ImageryLayer();
- layer.GeoCoordinates = new Point(30.9709225, -100.2187212);
- SubShapeFileLayer subLayer1 = new SubShapeFileLayer();
- subLayer1.ShapeType = ShapeType.Polygon;
- subLayer1.Points = obj.SubLayer1;
- layer.SubShapeFileLayers.Add(subLayer1);
- SubShapeFileLayer subLayer2 = new SubShapeFileLayer();
- subLayer2.ShapeType = ShapeType.Polygon;
- subLayer1.Points = obj.SubLayer2;
- layer.SubShapeFileLayers.Add(subLayer2);
- ShapeSetting subLayerSetting1 = new ShapeSetting();
- subLayerSetting1.ShapeStrokeThickness = 4;
- subLayerSetting1.ShapeFill = new SolidColorBrush(Colors.Blue);
- subLayerSetting1.ShapeStroke = new SolidColorBrush(Colors.DarkBlue);
- subLayer1.ShapeSettings = subLayerSetting1;
- ShapeSetting subLayerSetting2 = new ShapeSetting();
- subLayerSetting2.ShapeStrokeThickness = 4;
- subLayerSetting2.ShapeFill = new SolidColorBrush(Colors.Orange);
- subLayerSetting2.ShapeStroke = new SolidColorBrush(Colors.Red);
- subLayer2.ShapeSettings = subLayerSetting2;
- subLayer1.Points = obj.SubLayer1;
- subLayer2.Points = obj.SubLayer2;
- maps.Layers.Add(layer);
- this.Content = maps;
- }
+ InitializeComponent();
+ this.DataContext = obj;
+ SfMap maps = new SfMap();
+ maps.ZoomLevel = 4;
+ ImageryLayer layer = new ImageryLayer();
+ layer.GeoCoordinates = new Point(30.9709225, -100.2187212);
+ SubShapeFileLayer subLayer1 = new SubShapeFileLayer();
+ subLayer1.ShapeType = ShapeType.Polygon;
+ subLayer1.Points = obj.SubLayer1;
+ layer.SubShapeFileLayers.Add(subLayer1);
+
+ SubShapeFileLayer subLayer2 = new SubShapeFileLayer();
+ subLayer2.ShapeType = ShapeType.Polygon;
+ subLayer2.Points = obj.SubLayer2;
+ layer.SubShapeFileLayers.Add(subLayer2);
+
+ ShapeSetting subLayerSetting1 = new ShapeSetting();
+ subLayerSetting1.ShapeStrokeThickness = 4;
+ subLayerSetting1.ShapeFill = new SolidColorBrush(Colors.Blue);
+ subLayerSetting1.ShapeStroke = new SolidColorBrush(Colors.DarkBlue);
+ subLayer1.ShapeSettings = subLayerSetting1;
+
+ ShapeSetting subLayerSetting2 = new ShapeSetting();
+ subLayerSetting2.ShapeStrokeThickness = 4;
+ subLayerSetting2.ShapeFill = new SolidColorBrush(Colors.Orange);
+ subLayerSetting2.ShapeStroke = new SolidColorBrush(Colors.Red);
+ subLayer2.ShapeSettings = subLayerSetting2;
+ maps.Layers.Add(layer);
+ this.Content = maps;
}
+}
- public class ViewModel
+public class ViewModel
+{
+ public ObservableCollection SubLayer1
{
- public ObservableCollection SubLayer1
- {
- get;set;
- }
+ get; set;
+ }
- public ObservableCollection SubLayer2
+ public ObservableCollection SubLayer2
+ {
+ get; set;
+ }
+ public ViewModel()
+ {
+ SubLayer1 = new ObservableCollection()
{
- get; set;
- }
- public ViewModel()
+ new Point(37.042972, -109.085003),
+ new Point(40.992567, -109.021030),
+ new Point(40.968420, -102.048065),
+ new Point(36.991893, -102.144024),
+ new Point(37.042972, -109.085003)
+ };
+ SubLayer2 = new ObservableCollection()
{
-
- SubLayer1 = new ObservableCollection()
- {
- new Point(37.042972,-109.085003),
- new Point(40.992567,-109.021030),
- new Point(40.968420,-102.048065),
- new Point(36.991893,-102.144024),
- new Point(37.042972,-109.085003)
- };
- SubLayer2 = new ObservableCollection()
- {
- new Point(41.04621681452063, -104.0625),
- new Point(41.04621681452063, -102.0849609375),
- new Point(40.01078714046552, -102.041015625),
- new Point(40.04443758460856, -95.44921875),
- new Point(42.48830197960227, -96.3720703125),
- new Point(43.03677585761058, -98.4375),
- new Point(43.068887774169625, -104.0625),
- new Point(41.04621681452063, -104.0625),
- };
- }
+ new Point(41.04621681452063, -104.0625),
+ new Point(41.04621681452063, -102.0849609375),
+ new Point(40.01078714046552, -102.041015625),
+ new Point(40.04443758460856, -95.44921875),
+ new Point(42.48830197960227, -96.3720703125),
+ new Point(43.03677585761058, -98.4375),
+ new Point(43.068887774169625, -104.0625),
+ new Point(41.04621681452063, -104.0625)
+ };
}
+}
+
{% endhighlight %}
{% endtabs %}
-
+
### Polyline
-You can add polyline shape on map by using [`Points`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Points) collection property of shape layer or sub layer and set [`ShapeType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeType.html) as `Polyline`. Polylines are frequently used to define linear features such as roads, rivers, and power lines.
+You can add a polyline shape on the map by using the [`Points`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Points) collection property of the shape layer or sub layer and set [`ShapeType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeType.html) as `Polyline`. Polylines are frequently used to define linear features such as roads, rivers, and power lines.
{% tabs %}
{% highlight xaml %}
-
-
-
-
-
-
- 51.5008, -0.1224
- 48.8567, 2.3508
- 52.5166, 13.3833
- 48.21327949272514, 16.388290236693138
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+ 51.5008, -0.1224
+ 48.8567, 2.3508
+ 52.5166, 13.3833
+ 48.21327949272514, 16.388290236693138
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- public partial class MyPage : ContentPage
+public partial class MyPage : ContentPage
+{
+ public MyPage()
{
-
- public MyPage()
+ InitializeComponent();
+ SfMap maps = new SfMap();
+ maps.ZoomLevel = 5;
+ ImageryLayer layer = new ImageryLayer();
+ layer.GeoCoordinates = new Point(49.9709225, 10.2187212);
+ SubShapeFileLayer subLayer = new SubShapeFileLayer();
+ subLayer.Points = new ObservableCollection()
{
- InitializeComponent();
-
- SfMap maps = new SfMap();
- maps.ZoomLevel = 5;
- ImageryLayer layer = new ImageryLayer();
- layer.GeoCoordinates = new Point(49.9709225, 10.2187212);
- SubShapeFileLayer subLayer = new SubShapeFileLayer();
- subLayer.Points = new ObservableCollection()
- {
- new Point(51.5008, -0.1224),
- new Point(48.8567, 2.3508),
- new Point(52.5166, 13.3833),
- new Point(48.21327949272514, 16.388290236693138)
- };
- subLayer.ShapeType = ShapeType.Polyline;
-
- ShapeSetting subLayerSetting = new ShapeSetting();
- subLayerSetting.ShapeStrokeThickness = 1;
- subLayerSetting.ShapeFill = new SolidColorBrush(Colors.Black);
- subLayer.ShapeSettings = subLayerSetting;
- layer.SubShapeFileLayers.Add(subLayer);
- maps.Layers.Add(layer);
- this.Content = maps;
- }
+ new Point(51.5008, -0.1224),
+ new Point(48.8567, 2.3508),
+ new Point(52.5166, 13.3833),
+ new Point(48.21327949272514, 16.388290236693138)
+ };
+ subLayer.ShapeType = ShapeType.Polyline;
+
+ ShapeSetting subLayerSetting = new ShapeSetting();
+ subLayerSetting.ShapeStrokeThickness = 1;
+ subLayerSetting.ShapeFill = new SolidColorBrush(Colors.Black);
+ subLayer.ShapeSettings = subLayerSetting;
+ layer.SubShapeFileLayers.Add(subLayer);
+ maps.Layers.Add(layer);
+ this.Content = maps;
}
-
-
+}
+
{% endhighlight %}
{% endtabs %}
-
+
### Point icon
-A point icon has a single Geo coordinate value and you can add multi point icon shapes on map by using [`Points`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Points) collection property of shape layer or sub layer and set [`ShapeType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeType.html) as `PointIcon`. The point icons are often used to define features such as oil wells, landmarks, and elevations.
+A point icon has a single Geo coordinate value and you can add multiple point icon shapes on the map by using the [`Points`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_Points) collection property of the shape layer or sub layer and set [`ShapeType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeType.html) as `PointIcon`. The point icons are often used to define features such as oil wells, landmarks, and elevations.
The size, shape, and alignment of the map points can be customized using the [`MapPointIconSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapPointIconSize), [`MapPointIcon`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapPointIcon), [`MapPointHorizontalAlignment`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapPointHorizontalAlignment), and [`MapPointVerticalAlignment`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_MapPointVerticalAlignment) properties of the shape file layer.
{% tabs %}
{% highlight xaml %}
-
-
-
-
-
-
- 43.96140927456403, -79.85451013248883
- 41.1324105, -74.4416047
- 39.2781708, -77.5889971
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+ 43.96140927456403, -79.85451013248883
+ 41.1324105, -74.4416047
+ 39.2781708, -77.5889971
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- public partial class MyPage : ContentPage
+public partial class MyPage : ContentPage
+{
+ public MyPage()
{
- public MyPage()
- {
- InitializeComponent();
- SfMap maps = new SfMap();
- maps.ZoomLevel = 4;
- ImageryLayer layer = new ImageryLayer();
- layer.GeoCoordinates = new Point(42.9709225, -90.2187212);
- SubShapeFileLayer subLayer = new SubShapeFileLayer();
- subLayer.Points.Add(new Point(43.96140927456403, -79.85451013248883));
- subLayer.Points.Add(new Point(41.1324105, -74.4416047));
- subLayer.Points.Add(new Point(39.2781708, -77.5889971));
- subLayer.MapPointIconSize = 10;
- subLayer.ShapeType = ShapeType.PointIcon;
- subLayer.MapPointIconSize = 10;
- ShapeSetting subLayerSetting = new ShapeSetting();
- subLayerSetting.ShapeFill = new SolidColorBrush(Colors.Blue);
- subLayer.ShapeSettings = subLayerSetting;
- layer.SubShapeFileLayers.Add(subLayer);
- maps.Layers.Add(layer);
- this.Content = maps;
-
- }
+ InitializeComponent();
+ SfMap maps = new SfMap();
+ maps.ZoomLevel = 4;
+ ImageryLayer layer = new ImageryLayer();
+ layer.GeoCoordinates = new Point(42.9709225, -90.2187212);
+ SubShapeFileLayer subLayer = new SubShapeFileLayer();
+ subLayer.Points.Add(new Point(43.96140927456403, -79.85451013248883));
+ subLayer.Points.Add(new Point(41.1324105, -74.4416047));
+ subLayer.Points.Add(new Point(39.2781708, -77.5889971));
+ subLayer.MapPointIconSize = 10;
+ subLayer.ShapeType = ShapeType.PointIcon;
+ ShapeSetting subLayerSetting = new ShapeSetting();
+ subLayerSetting.ShapeFill = new SolidColorBrush(Colors.Blue);
+ subLayer.ShapeSettings = subLayerSetting;
+ layer.SubShapeFileLayers.Add(subLayer);
+ maps.Layers.Add(layer);
+ this.Content = maps;
}
+}
+
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Map/Shapes-Color-Customization.md b/chart-sdk/uwp/Map/Shapes-Color-Customization.md
index 9a35933ba..23efffa61 100644
--- a/chart-sdk/uwp/Map/Shapes-Color-Customization.md
+++ b/chart-sdk/uwp/Map/Shapes-Color-Customization.md
@@ -1,68 +1,68 @@
---
layout: post
-title: Shapes Color Customization in UWP Map control | Syncfusion
-description: Learn here all about Shapes Color Customization support in Syncfusion UWP Map (SfMaps) control and more.
+title: Shapes Color Customization in UWP Maps | Syncfusion®
+description: Shapes color customization in the UWP Maps allows you to apply custom colors to map shapes for improved visualization and data representation.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Shapes Color Customization in UWP Map (SfMaps)
+# Shapes Color Customization in UWP Maps
-Maps highly support the customization of the shape’s color. The shape’s color can be customized using the following methods:
+The [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) control provides extensive support for the customization of the shape's color. The shape's color can be customized using the following methods:
-* Using the `ShapeFill`, `ShapeStroke` and `ShapeStrokeThickness` properties.
+* Using the [`ShapeFill`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeFill), [`ShapeStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeStroke), and [`ShapeStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeStrokeThickness) properties.
* Using tree map-like support.
* Using the color palette.
-The important property that makes an impact on shape colors is AutoFillColors. This is a Boolean type property. This property is available in the FillSetting. The use of this property is explained in the following sections.
+The important property that makes an impact on shape colors is [`AutoFillColors`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFillSetting.html#Syncfusion_UI_Xaml_Maps_ShapeFillSetting_AutoFillColors). This is a Boolean type property. This property is available in the [`FillSetting`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_FillSetting). The use of this property is explained in the following sections.
-## About ShapeFill, ShapeStroke and ShapeStrokeThickness
+## About ShapeFill, ShapeStroke, and ShapeStrokeThickness
-The above mentioned properties are available in the `ShapesSetting` property of the ShapeFileLayer. ShapeSetting defines the basic customization settings of shapes in the map.
+The above mentioned properties are available in the [`ShapeSettings`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html#Syncfusion_UI_Xaml_Maps_ShapeFileLayer_ShapeSettings) property of the [`ShapeFileLayer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFileLayer.html). [`ShapeSetting`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html) defines the basic customization settings of shapes in the map.
## ShapeFill
-`ShapeFill` is a Brush type property which sets the fill color of the shapes in the map.
+[`ShapeFill`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeFill) is a `Brush` type property that sets the fill color of the shapes in the map.
## ShapeStroke
-`ShapeStroke` is also a brush type property that sets the border color of the shape in the map.
+[`ShapeStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeStroke) is also a `Brush` type property that sets the border color of the shape in the map.
## ShapeStrokeThickness
-`ShapeStrokeThickness` is a double type property that sets the border thickness of the shape in the map.
+[`ShapeStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeStrokeThickness) is a `double` type property that sets the border thickness of the shape in the map.
-N> These setting works only when `AutoFillColor` is set as false.
+N> These settings work only when [`AutoFillColors`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFillSetting.html#Syncfusion_UI_Xaml_Maps_ShapeFillSetting_AutoFillColors) is set to `false`.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
-{% endhighlight %}
+{% endhighlight %}
-
+
## Tree map-like support
-ShapeFill is set based on the under-bound values of the shape. This provides a tree map-like impact on the map UI. The RangeColorMapping property provides a tree map-like fill for the shapes.
+`ShapeFill` is set based on the underlying values of the shape. This provides a tree map-like impact on the map UI. The [`RangeColorMapping`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.RangeColorMapping.html) property provides a tree map-like fill for the shapes.
## Range Color Mapping
-Range color mapping is one of the features used to differentiate the shape’s fill based on its under-bound value and color ranges. Range color mapping contains the following properties:
+Range color mapping is one of the features used to differentiate the shape's fill based on its underlying value and color ranges. Range color mapping contains the following properties:
Gets or sets the color values for the given range.
-The fill color of a particular bubble fill is determined by its under-bound value and color range. To provide a Tree Map like impact on the map, the data binding should work properly. For example, consider the following color ranges.
+The fill color of a particular shape is determined by its underlying value and color range. To provide a tree map-like impact on the map, the data binding should work properly. For example, consider the following color ranges.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
-{% endhighlight %}
+{% endhighlight %}
-AutoFillColor must be set to false to enable the range color mapping.
+[`AutoFillColors`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeFillSetting.html#Syncfusion_UI_Xaml_Maps_ShapeFillSetting_AutoFillColors) must be set to `false` to enable the range color mapping.
-N> The shape’s under-bound object value must have numeric property and should be mentioned in `ShapeValuePath` to work on this. The color between the given ranges is applied only to the shapes that have a proper under-bound values. The color for other shapes will be the ShapeFill’s color.
+N> The shape's underlying object value must have a numeric property and should be mentioned in [`ShapeValuePath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ShapeValuePath) to work with this. The color between the given ranges is applied only to the shapes that have proper underlying values. The color for other shapes will be the `ShapeFill`'s color.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+{% endhighlight %}
+
+
## ColorPalette
-`ColorPalette` is a set of colors that are applied on the shapes. Map contains two built-in color palettes. They are:
+[`ColorPalette`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ColorPalette) is a set of colors that are applied on the shapes. The map contains two built-in color palettes. They are:
-* Metro
-* CoolBlue
+* Metro
+* CoolBlue
* CustomPalette
-ColorPalette has to be set in the ShapeSetting’s ColorPalette property. ColorPalette is the enum property which accepts `Metro`, `CoolBlue` and `CustomPalette`.
+`ColorPalette` has to be set in the [`ShapeSetting`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html)'s [`ColorPalette`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_ColorPalette) property. `ColorPalette` is the enum property which accepts `Metro`, `CoolBlue`, and `CustomPalette`.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
-
+
## About CustomPalette
-Besides the built-in color palettes, the custom colors can be defined for the color palette. The custom colors are defined in the `CustomColors` in `ShapeSetting`. CustomColors is the collection property which accepts the `MapColorPalette`. To apply the custom colors, “ColorPalette” must be set to `CustomPalette` and `CustomColors` should be defined.
+Besides the built-in color palettes, custom colors can be defined for the color palette. The custom colors are defined in the [`CustomColors`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html#Syncfusion_UI_Xaml_Maps_ShapeSetting_CustomColors) property in [`ShapeSetting`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.ShapeSetting.html). `CustomColors` is the collection property which accepts the [`MapColorPalette`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapColorPalette.html). To apply the custom colors, `ColorPalette` must be set to `CustomPalette` and `CustomColors` should be defined.
## About MapColorPalette
-`MapColorPalette` contains a property named `FillBrush`. This property sets the fill color of the shape when custom palette is set.
+[`MapColorPalette`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapColorPalette.html) contains a property named [`FillBrush`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.MapColorPalette.html#Syncfusion_UI_Xaml_Maps_MapColorPalette_FillBrush). This property sets the fill color of the shape when the custom palette is set.
{% highlight html %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+{% endhighlight %}
+
+
diff --git a/chart-sdk/uwp/Map/Zooming-and-Panning.md b/chart-sdk/uwp/Map/Zooming-and-Panning.md
index 459c4c13c..dca817cd9 100644
--- a/chart-sdk/uwp/Map/Zooming-and-Panning.md
+++ b/chart-sdk/uwp/Map/Zooming-and-Panning.md
@@ -1,117 +1,112 @@
---
layout: post
-title: Zooming and Panning in UWP Map control | Syncfusion
-description: Learn here all about Zooming and Panning support in Syncfusion UWP Map (SfMaps) control and more.
+title: Zooming and Panning in UWP Maps | Syncfusion®
+description: Zooming and panning in the UWP Maps enable interactive navigation using gestures, mouse actions, zoom levels, and programmatic controls.
platform: chart-sdk
control: SfMaps
documentation: ug
---
-# Zooming and Panning in UWP Map (SfMaps)
+# Zooming and Panning in UWP Map
-The Zooming and Panning feature of the Map control allows users to zoom in and out and navigate the map.
+The zooming and panning feature of the [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) control allows users to zoom in and out and navigate the map.
## Zooming
-The zooming feature enables users to zoom in and out of the map to show in-depth information. It is controlled by the `ZoomLevel` property of the map. When the zoom level of the Map control is increased, the map is zoomed in. If the zoom level is decreased then the map is zoomed out.
+The zooming feature enables users to zoom in and out of the map to show in-depth information. It is controlled by the [`ZoomLevel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ZoomLevel) property of the map. When the zoom level of the map control is increased, the map is zoomed in. If the zoom level is decreased, then the map is zoomed out.
## Properties Related to Zooming
The following properties are related to the zooming feature of the Maps control:
-* ZoomLevel
-* EnableZoom
-* MinZoom
-* MaxZoom
+* [ZoomLevel](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ZoomLevel)
+* [EnableZoom](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_EnableZoom)
+* [MinZoom](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_MinZoom)
+* [MaxZoom](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_MaxZoom)
## ZoomLevel
-`ZoomLevel` is the primary property of the zooming feature. It controls the map’s scale size while zooming. Initially, the zoom level is 1. ZoomLevel cannot be less than 1.
+[`ZoomLevel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ZoomLevel) is the primary property of the zooming feature. It controls the map's scale size while zooming. Initially, the zoom level is 1. `ZoomLevel` cannot be less than 1.
## EnableZoom
-The `EnableZoom` property enables or disables the zooming feature. A `True` value of this property enables the zooming feature and `False` disables the zooming feature.
+The [`EnableZoom`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_EnableZoom) property enables or disables the zooming feature. A `true` value of this property enables the zooming feature and `false` disables the zooming feature.
## MinZoom
-The `MinZoom` property is used to set the minimum zoom level of the map.
+The [`MinZoom`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_MinZoom) property is used to set the minimum zoom level of the map.
## MaxZoom
-The `MaxZoom` property is used to set the maximum zoom level of the Map control.
+The [`MaxZoom`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_MaxZoom) property is used to set the maximum zoom level of the [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) control.
{% highlight html %}
-
-
+
{% endhighlight %}
-## Methods to Zoom the Map:
+## Methods to Zoom the Map
Maps can be zoomed using the following methods:
-* By changing the ZoomLevel.
-* Through the Zoom method.
+* By changing the [`ZoomLevel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_ZoomLevel).
+* Through the [`Zoom`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_Zoom_System_Double_) method.
* By pinching the map.
* Through the mouse scroll.
* By double-tapping on the map.
-
-
## Changing the ZoomLevel
-A map can be zoomed by changing the zoom level of the Map control. Incrementing the ZoomLevel will zoom in on the map and decrementing the ZoomLevel will zoom out of the map.
+A map can be zoomed by changing the zoom level of the [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) control. Incrementing the `ZoomLevel` will zoom in on the map and decrementing the `ZoomLevel` will zoom out of the map.
## Through the Zoom method
-Maps can be zoomed through the Zoom method. The Zoom method has the parameter zoom value. The map can be zoomed or scaled with the zoom value parameter.
+Maps can be zoomed through the [`Zoom`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_Zoom_System_Double_) method. The `Zoom` method has the parameter zoom value. The map can be zoomed or scaled with the zoom value parameter.
{% highlight c# %}
- SfMap syncMap = new SfMap();
- ShapeFileLayer shapeLayer = new ShapeFileLayer();
- shapeLayer.Uri = "MapApp.ShapeFiles.world.shp";
- syncMap.Layers.Add(shapeLayer);
- syncMap.Zoom(5);
+SfMap syncMap = new SfMap();
+ShapeFileLayer shapeLayer = new ShapeFileLayer();
+shapeLayer.Uri = "MapApp.ShapeFiles.world.shp";
+syncMap.Layers.Add(shapeLayer);
+syncMap.Zoom(5);
-{% endhighlight %}
+{% endhighlight %}
## By pinching the map
-Since UWP fully supports touch interactions, the Maps control also supports touch interactions. Maps can be zoomed through pinching events. Scale value is determined by using the delta value of the pinch event.
+Since UWP fully supports touch interactions, the Maps control also supports touch interactions. Maps can be zoomed through pinching events. The scale value is determined by using the delta value of the pinch event.
## Through a mouse wheel event
-In addition to the pinching event, the map can be zoomed with mouse events. When the mouse is scrolled up, the map is zoomed in. When the mouse is scrolled down, the map is zoomed out.
+In addition to the pinching event, the map can be zoomed with mouse events. When the mouse is scrolled up, the map is zoomed in. When the mouse is scrolled down, the map is zoomed out.
## Through a double-tapping event
-When the map is double-tapped, the zooming operation is performed.
+When the map is double-tapped, the zooming operation is performed.
-
-
+
## Panning the map
The panning feature enables navigation through the map.
-Properties related to Panning are:
+Properties related to panning are:
-* EnablePan
+* [EnablePan](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_EnablePan)
## Enable and disable pan
-The `EnablePan` property enables or disables the panning feature of the map. A `True` value enables the panning feature. A `False` value disables the panning feature of the map.
+The [`EnablePan`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_EnablePan) property enables or disables the panning feature of the map. A `true` value enables the panning feature. A `false` value disables the panning feature of the map.
{% highlight html %}
-
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
@@ -119,28 +114,28 @@ The `EnablePan` property enables or disables the panning feature of the map. A `
There are two methods for panning the map. They are:
-* Through the Pan method.
+* Through the [`Pan`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_Pan_System_Double_System_Double_) method.
* By dragging the map.
## Through the Pan method
-The map can be panned with the Pan method in the Maps control. The Pan method has two parameters: x and y. The map is translated with respect to the x and y parameters.
+The map can be panned with the [`Pan`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html#Syncfusion_UI_Xaml_Maps_SfMap_Pan_System_Double_System_Double_) method in the [`SfMap`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Maps.SfMap.html) control. The `Pan` method has two parameters: x and y. The map is translated with respect to the x and y parameters.
{% highlight c# %}
-
- SfMap syncMap = new SfMap();
- syncMap.EnablePan = true;
- ShapeFileLayer layer = new ShapeFileLayer();
- layer.Uri = "App2.world1.shp";
- syncMap.Layers.Add(layer);
- syncMap.Pan(200, 200);
-{% endhighlight %}
+SfMap syncMap = new SfMap();
+syncMap.EnablePan = true;
+ShapeFileLayer layer = new ShapeFileLayer();
+layer.Uri = "App2.world1.shp";
+syncMap.Layers.Add(layer);
+syncMap.Pan(200, 200);
+
+{% endhighlight %}
## Dragging the map
The map can be panned by dragging the map through mouse interactions. This works automatically for touch events.
-N> The map can be panned only when some parts of the map are outside the view of the control.
+N> The map can be panned only when some parts of the map are outside the view of the control.
-
+
diff --git a/chart-sdk/uwp/Radial-Gauge/GettingStarted.md b/chart-sdk/uwp/Radial-Gauge/GettingStarted.md
index 07c99773b..a71dc8827 100644
--- a/chart-sdk/uwp/Radial-Gauge/GettingStarted.md
+++ b/chart-sdk/uwp/Radial-Gauge/GettingStarted.md
@@ -1,22 +1,22 @@
---
layout: post
-title: Getting Started with UWP Radial Gauge control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP Radial Gauge (SfCircularGauge) control, its elements and more.
+title: Getting Started with UWP Radial Gauge | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Radial Gauge control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# Getting Started with UWP Radial Gauge (SfCircularGauge)
+# Getting Started with UWP Radial Gauge
-This section explains the steps required to configure the [`CircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) , and also explains the steps required to add basic elements to [`CircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) through various APIs available within it.
+This section explains the steps required to configure the [`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html), and also explains the steps required to add basic elements to the [`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) through various APIs available within it.
## Adding Gauge Reference
-Refer this [article](https://help.syncfusion.com/uwp/add-syncfusion-controls) to know how to add Syncfusion controls in Visual Studio projects through various way. You can also refer [this](https://help.syncfusion.com/uwp/control-dependencies) link to know about the assemblies required for adding Gauge to your project.
+Refer to this [article](https://help.syncfusion.com/uwp/add-syncfusion-controls) to know how to add Syncfusion controls in Visual Studio projects through various ways. You can also refer to [this](https://help.syncfusion.com/uwp/control-dependencies) link to know about the assemblies required for adding the Gauge to your project.
## Initialize Gauge
-Import the [`CircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) namespace as shown below in your respective Window,
+Import the [`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) namespace as shown below in your respective window,
{% tabs %}
@@ -34,20 +34,19 @@ using Syncfusion.UI.Xaml.Gauges;
{% endtabs %}
-You can initialize an empty [`CircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) control.
+You can initialize an empty [`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) control.
{% tabs %}
{% highlight xml %}
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
this.Content = sfCircularGauge;
{% endhighlight %}
@@ -56,46 +55,32 @@ this.Content = sfCircularGauge;
## Adding header
-You can assign a unique header to [`CircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) by using the [`GaugeHeader`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeader) property.
+You can assign a unique header to the [`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) by using the [`GaugeHeader`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeader) property.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
sfCircularGauge.HeaderAlignment = HeaderAlignment.Custom;
-
sfCircularGauge.GaugeHeaderPosition = new Point(0.4, 0.7);
-
TextBlock textBlock = new TextBlock();
-
textBlock.Text = "Temperature (K)";
-
textBlock.Height = 40;
-
textBlock.Width = 120;
-
textBlock.FontSize = 15;
-
textBlock.Foreground = new SolidColorBrush(Colors.Black);
-
sfCircularGauge.GaugeHeader = textBlock;
{% endhighlight %}
@@ -104,54 +89,36 @@ sfCircularGauge.GaugeHeader = textBlock;
## Configuring Scales
-You can configure the [`CircularScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html) elements by making use of following API’s available in [`CircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html).
+You can configure the [`CircularScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html) elements by making use of the following APIs available in the [`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html). They are:
-They are:
-
-* StartAngle
-
-* SweepAngle
-
-* StartValue
-
-* EndValue
-
-* Interval
-
-* TickStroke
-
-* LabelStroke
+* [`StartAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartAngle)
+* [`SweepAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SweepAngle)
+* [`StartValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartValue)
+* [`EndValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EndValue)
+* [`Interval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Interval)
+* [`TickStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickStroke)
+* [`LabelStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelStroke)
{% tabs %}
{% highlight xml %}
-
-
+
-
-
+ TickStroke="#BEBEBE" LabelStroke="#9E9E9E" SmallTickStroke="#BEBEBE"/>
+
{% endhighlight %}
{% highlight c# %}
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 9;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
@@ -160,48 +127,33 @@ sfCircularGauge.Scales.Add(circularScale);
## Adding ranges
-You can add ranges to the [`CircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) by creating ranges collection using the [`CircularRange`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html) property.
+You can add ranges to the [`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) by creating a ranges collection using the [`CircularRange`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html) class.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
CircularRange circularRange = new CircularRange();
-
circularRange.StartValue = 0;
-
circularRange.EndValue = 60;
-
circularRange.Stroke = new SolidColorBrush(Color.FromArgb(0xff, 0xd1, 0xdb, 0xdb));
-
circularScale.Ranges.Add(circularRange);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
@@ -210,62 +162,40 @@ sfCircularGauge.Scales.Add(circularScale);
## Adding a needle pointer
-Create a `Needle Pointer`, and associate it with a scale that is to be displayed the current value.
+Create a [`NeedlePointer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.PointerType.html#Syncfusion_UI_Xaml_Gauges_PointerType_NeedlePointer), and associate it with a scale that is to display the current value.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.NeedlePointer;
-
circularPointer.NeedleLengthFactor = 0.5;
-
circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
-
circularPointer.PointerCapDiameter = 20;
-
circularPointer.NeedlePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
circularPointer.PointerCapStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
circularPointer.Value = 60;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
@@ -274,52 +204,35 @@ sfCircularGauge.Scales.Add(circularScale);
## Adding a range pointer
-The `Range Pointer` provides an alternative way to indicate the current value.
+The [`RangePointer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.PointerType.html#Syncfusion_UI_Xaml_Gauges_PointerType_RangePointer) provides an alternative way to indicate the current value.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.RangePointer;
-
circularPointer.Value = 40;
-
circularPointer.RangePointerStrokeThickness = 9;
-
circularPointer.RangePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xd1, 0xdb, 0xdb));
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
@@ -328,48 +241,33 @@ sfCircularGauge.Scales.Add(circularScale);
## Adding a symbol pointer
-The `Symbol Pointer` points to the current value in a scale.
+The [`SymbolPointer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.PointerType.html#Syncfusion_UI_Xaml_Gauges_PointerType_SymbolPointer) points to the current value in a scale.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.SymbolPointer;
-
circularPointer.Value = 70;
-
circularPointer.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.InvertedArrow;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
@@ -382,208 +280,116 @@ The following code example is the complete code of the previous configurations.
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
+
{% endhighlight %}
{% highlight c# %}
using Windows.Foundation;
-
using Windows.UI.Xaml.Controls;
-
using Windows.UI.Xaml.Media;
-
using Syncfusion.UI.Xaml.Gauges;
-
using Windows.UI;
namespace GaugeGettingStarted
-
{
-
-public sealed partial class MainPage : Page
-
-{
-
-public MainPage()
-
-{
-
-this.InitializeComponent();
-
-SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
-sfCircularGauge.Height = 500;
-
-sfCircularGauge.Width = 500;
-
-//Adding header
-
-sfCircularGauge.HeaderAlignment = HeaderAlignment.Custom;
-
-sfCircularGauge.GaugeHeaderPosition = new Point(0.4, 0.7);
-
-TextBlock textBlock = new TextBlock();
-
-textBlock.Text = "Temperature (K)";
-
-textBlock.Height = 40;
-
-textBlock.Width = 120;
-
-textBlock.FontSize = 15;
-
-textBlock.Foreground = new SolidColorBrush(Colors.Black);
-
-sfCircularGauge.GaugeHeader = textBlock;
-
-//Initializing scales for circular gauge
-
-CircularScale circularScale = new CircularScale();
-
-circularScale.Radius = 150;
-
-circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
-circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
-circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
-circularScale.RimStrokeThickness = 9;
-
-circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
-//Adding range
-
-CircularRange circularRange = new CircularRange();
-
-circularRange.StartValue = 0;
-
-circularRange.EndValue = 60;
-
-circularRange.Stroke = new SolidColorBrush(Color.FromArgb(0xff, 0xd1, 0xdb, 0xdb));
-
-circularScale.Ranges.Add(circularRange);
-
-//Adding needle pointer
-
-CircularPointer circularPointer = new CircularPointer();
-
-circularPointer.PointerType = PointerType.NeedlePointer;
-
-circularPointer.NeedleLengthFactor = 0.5;
-
-circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
-
-circularPointer.PointerCapDiameter = 20;
-
-circularPointer.PointerCapStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
-circularPointer.Value = 60;
-
-circularPointer.NeedlePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
-circularScale.Pointers.Add(circularPointer);
-
-//Adding range pointer
-
-CircularPointer circularPointer1 = new CircularPointer();
-
-circularPointer1.PointerType = PointerType.RangePointer;
-
-circularPointer1.Value = 40;
-
-circularPointer1.RangePointerStrokeThickness = 9;
-
-circularPointer1.RangePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xd1, 0xdb, 0xdb));
-
-circularScale.Pointers.Add(circularPointer1);
-
-//Adding symbol pointer
-
-CircularPointer circularPointer2 = new CircularPointer();
-
-circularPointer2.PointerType = PointerType.SymbolPointer;
-
-circularPointer2.Value = 70;
-
-circularPointer2.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.InvertedArrow;
-
-circularScale.Pointers.Add(circularPointer2);
-
-sfCircularGauge.Scales.Add(circularScale);
-
-this.Content = sfCircularGauge;
-
-}
-
-}
-
+ public sealed partial class MainPage : Page
+ {
+ public MainPage()
+ {
+ this.InitializeComponent();
+ SfCircularGauge sfCircularGauge = new SfCircularGauge();
+ sfCircularGauge.Height = 500;
+ sfCircularGauge.Width = 500;
+ //Adding header
+ sfCircularGauge.HeaderAlignment = HeaderAlignment.Custom;
+ sfCircularGauge.GaugeHeaderPosition = new Point(0.4, 0.7);
+ TextBlock textBlock = new TextBlock();
+ textBlock.Text = "Temperature (K)";
+ textBlock.Height = 40;
+ textBlock.Width = 120;
+ textBlock.FontSize = 15;
+ textBlock.Foreground = new SolidColorBrush(Colors.Black);
+ sfCircularGauge.GaugeHeader = textBlock;
+
+ //Initializing scales for circular gauge
+ CircularScale circularScale = new CircularScale();
+ circularScale.Radius = 150;
+ circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+ circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+ circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+ circularScale.RimStrokeThickness = 9;
+ circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
+ //Adding range
+ CircularRange circularRange = new CircularRange();
+ circularRange.StartValue = 0;
+ circularRange.EndValue = 60;
+ circularRange.Stroke = new SolidColorBrush(Color.FromArgb(0xff, 0xd1, 0xdb, 0xdb));
+ circularScale.Ranges.Add(circularRange);
+
+ //Adding needle pointer
+ CircularPointer circularPointer = new CircularPointer();
+ circularPointer.PointerType = PointerType.NeedlePointer;
+ circularPointer.NeedleLengthFactor = 0.5;
+ circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
+ circularPointer.PointerCapDiameter = 20;
+ circularPointer.PointerCapStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
+ circularPointer.Value = 60;
+ circularPointer.NeedlePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
+ circularScale.Pointers.Add(circularPointer);
+ //Adding range pointer
+ CircularPointer circularPointer1 = new CircularPointer();
+ circularPointer1.PointerType = PointerType.RangePointer;
+ circularPointer1.Value = 40;
+ circularPointer1.RangePointerStrokeThickness = 9;
+ circularPointer1.RangePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xd1, 0xdb, 0xdb));
+ circularScale.Pointers.Add(circularPointer1);
+
+ //Adding symbol pointer
+ CircularPointer circularPointer2 = new CircularPointer();
+ circularPointer2.PointerType = PointerType.SymbolPointer;
+ circularPointer2.Value = 70;
+ circularPointer2.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.InvertedArrow;
+ circularScale.Pointers.Add(circularPointer2);
+ sfCircularGauge.Scales.Add(circularScale);
+ this.Content = sfCircularGauge;
+ }
+ }
}
{% endhighlight %}
@@ -592,7 +398,7 @@ this.Content = sfCircularGauge;
The following screenshot illustrates the result of the previous codes.
-
+
-You can find the complete getting started sample from this [`link`](http://www.syncfusion.com/downloads/support/directtrac/general/ze/GaugeGettingStarted-1968766965).
+You can find the complete getting started sample from this [`link`](http://www.syncfusion.com/downloads/support/directtrac/general/ze/GaugeGettingStarted-1968766965).
diff --git a/chart-sdk/uwp/Radial-Gauge/Header.md b/chart-sdk/uwp/Radial-Gauge/Header.md
index 08af29bde..7f811e1b4 100644
--- a/chart-sdk/uwp/Radial-Gauge/Header.md
+++ b/chart-sdk/uwp/Radial-Gauge/Header.md
@@ -1,102 +1,69 @@
---
layout: post
-title: Header in UWP Radial Gauge control | Syncfusion
-description: Learn here all about Header support in Syncfusion UWP Radial Gauge (SfCircularGauge) control and more.
+title: Header in UWP Radial Gauge | Syncfusion®
+description: Header in the UWP Radial Gauge displays a title for the gauge, providing context and helping users understand displayed values.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# Header in UWP Radial Gauge (SfCircularGauge)
+# Header in UWP Radial Gauge
-Header allows you to show text or any UI content inside the gauge control using [`GaugeHeader`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeader) option. This provides information about the data that is being plotted in the circular gauge.
+The header allows you to show text or any UI content inside the gauge control using the [`GaugeHeader`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeader) property. This provides information about the data that is being plotted in the circular gauge.
## Header
-The [`GaugeHeader`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeader) is an object that can be used to set a unique header for the circular gauge. You can add text and images as header in the circular gauge. Only one header can be added in a circular gauge.
+The [`GaugeHeader`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeader) is an object that can be used to set a unique header for the circular gauge. You can add text and images as a header in the circular gauge. Only one header can be added in a circular gauge.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
sfCircularGauge.HeaderAlignment = HeaderAlignment.Center;
-
TextBlock textBlock = new TextBlock();
-
textBlock.Text = "Temperature (K)";
-
textBlock.Height = 40;
-
textBlock.Width = 100;
-
textBlock.FontSize = 13;
-
textBlock.Foreground = new SolidColorBrush(Colors.Black);
-
sfCircularGauge.GaugeHeader = textBlock;
-
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting alignment for header
@@ -105,297 +72,182 @@ The gauge header can be positioned by using the [`HeaderAlignment`](https://help
It includes the following options:
* Left
-
* Right
-
* Top
-
* Bottom
-
* Center
-
* TopLeft
-
* TopRight
-
* BottomLeft
-
* BottomRight
-
* Custom
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
sfCircularGauge.HeaderAlignment = HeaderAlignment.Top;
-
TextBlock textBlock = new TextBlock();
-
textBlock.Text = "Temperature (K)";
-
textBlock.Height = 40;
-
textBlock.Width = 100;
-
textBlock.FontSize = 13;
-
textBlock.Foreground = new SolidColorBrush(Colors.Black);
-
sfCircularGauge.GaugeHeader = textBlock;
-
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting position for header
-The [`GaugeHeaderPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeaderPosition) property is used to place header in the circular gauge. The value for [`GaugeHeaderPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeaderPosition) should be specified in offset value. In the point value, which has been given for the [`GaugeHeaderPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeaderPosition) , the first value represent x-coordinate and the second value represents y-coordinate. First, set the [`HeaderAlignment`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_HeaderAlignment) to custom, then set the position of header.
+The [`GaugeHeaderPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeaderPosition) property is used to place the header in the circular gauge. The value for the [`GaugeHeaderPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeaderPosition) should be specified in an offset value. In the point value that has been given for the [`GaugeHeaderPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_GaugeHeaderPosition), the first value represents the x-coordinate and the second value represents the y-coordinate. First, set the [`HeaderAlignment`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_HeaderAlignment) to Custom, then set the position of the header.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
sfCircularGauge.HeaderAlignment = HeaderAlignment.Custom;
-
sfCircularGauge.GaugeHeaderPosition = new Point(0.42, 0.6);
-
TextBlock textBlock = new TextBlock();
-
textBlock.Text = "Temperature (K)";
-
textBlock.Height = 40;
-
textBlock.Width = 100;
-
textBlock.FontSize = 13;
-
textBlock.Foreground = new SolidColorBrush(Colors.Black);
-
sfCircularGauge.GaugeHeader = textBlock;
-
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Customization of header font
-You can customize the header’s text by using the `FontFamily`, `FontStyle`, `FontSize`, and `Foreground` properties.
+You can customize the header's text by using the [`FontFamily`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_FontFamily), [`FontStyle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_FontStyle), [`FontSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_FontSize), and [`Foreground`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_Foreground) properties.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
sfCircularGauge.HeaderAlignment = HeaderAlignment.Custom;
-
sfCircularGauge.GaugeHeaderPosition = new Point(0.42, 0.6);
-
TextBlock textBlock = new TextBlock();
-
textBlock.Text = "Temperature (K)";
-
textBlock.Height = 40;
-
textBlock.Width = 100;
-
textBlock.FontSize = 13;
-
textBlock.Foreground = new SolidColorBrush(Colors.Black);
-
sfCircularGauge.GaugeHeader = textBlock;
-
sfCircularGauge.FontSize = 15;
-
sfCircularGauge.FontFamily = new FontFamily("Monotype Corsiva");
-
sfCircularGauge.FontStyle = Windows.UI.Text.FontStyle.Italic;
-
sfCircularGauge.Foreground = new SolidColorBrush(Colors.Blue);
-
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Radial-Gauge/Labels.md b/chart-sdk/uwp/Radial-Gauge/Labels.md
index 9003c3c4a..05e9b49b8 100644
--- a/chart-sdk/uwp/Radial-Gauge/Labels.md
+++ b/chart-sdk/uwp/Radial-Gauge/Labels.md
@@ -1,234 +1,165 @@
---
layout: post
-title: Labels in UWP Radial Gauge control | Syncfusion
-description: Learn here all about Labels support in Syncfusion UWP Radial Gauge (SfCircularGauge) control and more.
+title: Labels in UWP Radial Gauge | Syncfusion®
+description: Labels in the UWP Radial Gauge display scale values and support customization through styling, positioning, and appearance settings.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# Labels in UWP Radial Gauge (SfCircularGauge)
+# Labels in UWP Radial Gauge
-The [`Scale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html) labels associate numeric values with major scale tick marks.
+The [`CircularScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html) labels associate numeric values with major scale tick marks.
## Label stroke customization
-The label color can be changed using the [`LabelStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelStroke) property.
+The label color can be changed using the [`LabelStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelStroke) property.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Colors.DeepPink);
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Label font customization
-The label font can be customized using the `FontSize`, `FontFamily`, and `FontStyle` properties.
+The label font can be customized using the [`FontSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_FontSize), [`FontFamily`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_FontFamily), and [`FontStyle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_FontStyle) properties.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
sfCircularGauge.FontSize = 20;
-
sfCircularGauge.FontFamily = new FontFamily("Monotype Corsiva");
-
sfCircularGauge.FontStyle = Windows.UI.Text.FontStyle.Italic;
CircularScale circularScale = new CircularScale();
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting position for labels
-The `Labels` can be placed inside the scale, outside the scale, or on the scale using the following two ways:
-
-1. Placing the labels by selecting one of the options available in the [`LabelPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPosition) property.
-
-They are,
+The labels can be placed inside the scale, outside the scale, or on the scale using the following two ways:
-1.Inside (Default)
+1. Placing the labels by selecting one of the options available in the [`LabelPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPosition) property.
-2.Outside
+They are:
-3.Custom
+* Inside (Default)
+* Outside
+* Custom
-{% capture codesnippet1 %}
+{% capture codesnippet1 %}
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.LabelPosition = LabelPosition.Outside;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-{% endcapture %}
+{% endcapture %}
-{{ codesnippet1 | OrderList_Indent_Level_2 }}
+{{ codesnippet1 | OrderList_Indent_Level_2 }}
-
+
-2. Positioning the labels far away from the ticks using the [`LabelOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelOffset) property. First, set the [`LabelPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPosition) to custom, and then position the label using the [`LabelOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelOffset) property.
+2. Positioning the labels far away from the ticks using the [`LabelOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelOffset) property. First, set the [`LabelPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPosition) to Custom, and then position the label using the [`LabelOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelOffset) property.
{% capture codesnippet2 %}
@@ -236,58 +167,35 @@ sfCircularGauge.Scales.Add(circularScale);
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.LabelPosition = LabelPosition.Custom;
-
circularScale.LabelOffset = 0.5;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
@@ -296,454 +204,304 @@ sfCircularGauge.Scales.Add(circularScale);
{% endcapture %}
-{{ codesnippet2 | OrderList_Indent_Level_1 }}
+{{ codesnippet2 | OrderList_Indent_Level_1 }}
-
+
## Setting smart labels
-Smart labels allow to change the numeric scale type of the labels displayed in a gauge scale and customize the labels by adding prefixes or suffixes to the scale labels.
+Smart labels allow you to change the numeric scale type of the labels displayed in a gauge scale and customize the labels by adding prefixes or suffixes to the scale labels.
-### Enable/disable smart labels
+### Enable/disable smart labels
-The [`EnableSmartLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EnableSmartLabels) property is a Boolean property that enables or disables the smart label feature of the circular gauge.
+The [`EnableSmartLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EnableSmartLabels) property is a Boolean property that enables or disables the smart label feature of the circular gauge.
## Setting numeric scale type
-The [`NumericScaleType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_NumericScaleType) property allows to set the type of label. The following types can be applied to labels:
+The [`NumericScaleType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_NumericScaleType) property allows you to set the type of label. The following types can be applied to labels:
-•Auto
-
-•Thousands
-
-•Millions
-
-•Billions
-
-•Trillions
-
-•Quadrillions
-
-•Quintillions
+* Auto
+* Thousands
+* Millions
+* Billions
+* Trillions
+* Quadrillions
+* Quintillions
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.StartValue = 0;
-
circularScale.EndValue = 100;
-
circularScale.EnableSmartLabels = true;
-
circularScale.NumericScaleType = NumericScaleType.Thousands;
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting number of fraction digits for labels
-The [`NoOfFractionDigit`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_NoOfFractionalDigit) property is used to set the number of fractional digits to be displayed in the scale labels.
+The [`NoOfFractionalDigit`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_NoOfFractionalDigit) property is used to set the number of fractional digits to be displayed in the scale labels.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.NoOfFractionalDigit = 3;
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting postfix and prefix for labels
-You can postfix/prefix values to the scale labels using the [`LabelPostfix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPostfix) and [`LabelPrefix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPrefix) properties, respectively.
+You can postfix or prefix values to the scale labels using the [`LabelPostfix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPostfix) and [`LabelPrefix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPrefix) properties, respectively.
### Label postfix
-The [`LabelPostfix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPostfix) property allows to postfix the values to the scale labels.
+The [`LabelPostfix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPostfix) property allows you to postfix the values to the scale labels.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.LabelPostfix = "k";
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
### Label prefix
-The [`LabelPrefix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPrefix) property allows to prefix the values to the scale labels.
+The [`LabelPrefix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_LabelPrefix) property allows you to prefix the values to the scale labels.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.LabelPrefix = "$";
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Edge label customization
-You can customize the edge label by using the [`ShowFirstLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_ShowFirstLabel) and [`ShowLastLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_ShowLastLabel) properties, which are Boolean properties. The [`ShowFirstLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_ShowFirstLabel) property is used to enable or disable first label, and the [`ShowLastLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_ShowLastLabel) property is used to enable or disable the last label in circular gauge.
+You can customize the edge label by using the [`ShowFirstLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_ShowFirstLabel) and [`ShowLastLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_ShowLastLabel) properties, which are Boolean properties. The [`ShowFirstLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_ShowFirstLabel) property is used to enable or disable the first label, and the [`ShowLastLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_ShowLastLabel) property is used to enable or disable the last label in the circular gauge.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.StartValue = 0;
-
circularScale.Interval = 1;
-
circularScale.MinorTicksPerInterval = 5;
-
circularScale.EndValue = 12;
-
circularScale.StartAngle = 270;
-
circularScale.SweepAngle = 360;
-
circularScale.ShowFirstLabel = false;
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting auto angle for label
-Scale labels can be rotated automatically based on the current angle. To enable or disable the auto angle, use the [`EnableAutoAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EnableAutoAngle) property.
+Scale labels can be rotated automatically based on the current angle. To enable or disable the auto angle, use the [`EnableAutoAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EnableAutoAngle) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.EnableAutoAngle = true;
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Radial-Gauge/Overview.md b/chart-sdk/uwp/Radial-Gauge/Overview.md
index 37129e16d..0c4bc7e26 100644
--- a/chart-sdk/uwp/Radial-Gauge/Overview.md
+++ b/chart-sdk/uwp/Radial-Gauge/Overview.md
@@ -1,14 +1,14 @@
---
layout: post
-title: About UWP Radial Gauge control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Radial Gauge (SfCircularGauge) control, its elements and more.
+title: About Syncfusion® UWP Radial Gauge Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio UWP Radial Gauge control, its features, capabilities, and more details.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# UWP Radial Gauge (SfCircularGauge) Overview
+# About Syncfusion UWP Radial Gauge Control
-Circular Gauge helps you to visualize the numeric values over a circular scale. The appearance of the gauge is fully customized to integrate your applications without fault.
+The Circular Gauge helps you to visualize the numeric values over a circular scale. The appearance of the gauge is fully customized to integrate your applications without fault.
## Key features
@@ -17,16 +17,12 @@ Circular Gauge helps you to visualize the numeric values over a circular scale.
[`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) is a composite UI element with the following subparts:
* Scales
-
* Ranges
-
* Pointers
-
* Header
-
* Annotations
-The circular gauge control is highly customizable control with variety of simple APIs to modify its basic look and feel. You can position ranges, ticks, labels, and range pointers as needed.
+The circular gauge control is a highly customizable control with a variety of simple APIs to modify its basic look and feel. You can position ranges, ticks, labels, and range pointers as needed.
### Scales
@@ -48,7 +44,7 @@ The circular gauge control is highly customizable control with variety of simple
[`Annotations`](https://help.syncfusion.com/uwp/sfcirculargauge/annotations) allows you to mark the specific area of interest in a circular gauge. You can place custom views, text, and images as annotations by using the annotations feature.
-
+
diff --git a/chart-sdk/uwp/Radial-Gauge/Pointers.md b/chart-sdk/uwp/Radial-Gauge/Pointers.md
index 5c805a680..e6c1c524a 100644
--- a/chart-sdk/uwp/Radial-Gauge/Pointers.md
+++ b/chart-sdk/uwp/Radial-Gauge/Pointers.md
@@ -1,188 +1,138 @@
---
layout: post
-title: Pointers in UWP Radial Gauge control | Syncfusion
-description: Learn here all about Pointers support in Syncfusion UWP Radial Gauge (SfCircularGauge) control and more.
+title: Pointers in UWP Radial Gauge | Syncfusion®
+description: Pointers in the UWP Radial Gauge indicate values on the gauge scale using different pointer types and customizable appearance settings.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# Pointers in UWP Radial Gauge (SfCircularGauge)
+# Pointers in UWP Radial Gauge
-Pointers are used to indicate values on the scale. Value of the pointer can be modified using the [`Value`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_Value) property.
+Pointers are used to indicate values on the scale. The value of the pointer can be modified using the [`Value`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_Value) property.
## Pointer Type
-There are three types of pointers. You can choose a pointer using the [`PointerType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_PointerType) property.
+There are three types of pointers. You can choose a pointer using the [`PointerType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_PointerType) property.
## Needle pointer
-A needle pointer contains two parts, a needle and a pointer cap, that can be placed on a gauge to mark values.
+A needle pointer contains two parts: a needle and a pointer cap, that can be placed on a gauge to mark values.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.NeedlePointer;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### NeedlePointerType
The appearance of the needle pointer can be customized using the [`NeedlePointerType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedlePointerType) property. The default value of this property is Rectangle.
The [`NeedlePointerType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedlePointerType) is an `enum` property that includes the following options:
-1. Rectangle
-
-2. Triangle
-
-3. Tapered
-
-4. Arrow
+* Rectangle
+* Triangle
+* Tapered
+* Arrow
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.NeedlePointer;
-
circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### Needle pointer customization
-The length of a needle is controlled using the [`NeedleLengthFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedleLengthFactor) property. The minimum and maximum bounds of the [`NeedleLengthFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedleLengthFactor) property are 0 and 1. The needle’s UI is customized using the [`NeedlePointerStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedlePointerStroke) and [`NeedlePointerStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedlePointerStrokeThickness) properties. The size of the pointer cap can be modified by changing the [`PointerCapDiameter`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_PointerCapDiameter) property, and color can be modified using the [`PointerCapStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_PointerCapStroke) property.
+The length of a needle is controlled using the [`NeedleLengthFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedleLengthFactor) property. The minimum and maximum bounds of the [`NeedleLengthFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedleLengthFactor) property are 0 and 1. The needle's UI is customized using the [`NeedlePointerStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedlePointerStroke) and [`NeedlePointerStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_NeedlePointerStrokeThickness) properties. The size of the pointer cap can be modified by changing the [`PointerCapDiameter`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_PointerCapDiameter) property, and the color can be modified using the [`PointerCapStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_PointerCapStroke) property.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.NeedlePointer;
-
circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
-
circularPointer.NeedlePointerStroke = new SolidColorBrush(Colors.DeepSkyBlue);
-
-circularPointer.NeedlePointerStrokeThickness =10;
-
+circularPointer.NeedlePointerStrokeThickness = 10;
circularPointer.NeedleLengthFactor = 0.5;
-
circularPointer.PointerCapDiameter = 20;
-
circularPointer.PointerCapStroke = new SolidColorBrush(Colors.DeepSkyBlue);
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### Setting visibility of needle pointer
@@ -192,151 +142,107 @@ The visibility of the needle pointer can be set using the [`NeedlePointerVisibil
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Visibility.Hidden;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
## Range pointer
-The range pointer is an accenting line or shaded background range that can be placed on a gauge to mark values.
+The range pointer is an accenting line or shaded background range that can be placed on a gauge to mark values.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.RangePointer;
-
circularPointer.Value = 50;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### Range pointer customization
-The range pointer’s UI is customized using the [`RangePointerStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_RangePointerStroke) and [`RangePointerStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_RangePointerStrokeThickness) properties.
+The range pointer's UI is customized using the [`RangePointerStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_RangePointerStroke) and [`RangePointerStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_RangePointerStrokeThickness) properties.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.RangePointer;
-
circularPointer.Value = 50;
-
circularPointer.RangePointerStroke = new SolidColorBrush(Colors.DarkCyan);
-
circularPointer.RangePointerStrokeThickness = 20;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### Setting visibility for range pointer
@@ -346,120 +252,88 @@ The [`RangePointerVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.RangePointerVisibility = Visibility.Hidden;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### Setting position for range pointer
-The `RangePointer` can be placed inside or outside the scale by the following two ways:
-1. Using the [`RangePointerPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerPosition) property.
+The [`RangePointer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.PointerType.html#Syncfusion_UI_Xaml_Gauges_PointerType_RangePointer) can be placed inside or outside the scale in the following two ways:
+1. Using the [`RangePointerPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerPosition) property.
-You can place the range pointer by selecting one of the options available in the [`RangePointerPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerPosition) property.
+You can place the range pointer by selecting one of the options available in the [`RangePointerPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerPosition) property.
They are:
-1. Inside (Default)
-
-2. Outside
-
-3. Cross
+* Inside (Default)
+* Outside
+* Cross
+* Custom
-4. Custom
+{% capture codesnippet1 %}
-{% capture codesnippet1 %}
-
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
scale.RangePointerPosition = RangePointerPosition.Outside;
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.RangePointer;
-
circularPointer.RangePointerStroke = new SolidColorBrush(Colors.HotPink);
-
circularPointer.Value = 60;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
-{% endcapture %}
-{{ codesnippet1 | OrderList_Indent_Level_1 }}
+{% endcapture %}
+
+{{ codesnippet1 | OrderList_Indent_Level_1 }}
-
+
-2. Using the [`RangePointerOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerOffset) property. First, set the [`RangePointerPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerPosition) to custom, and then set the [`RangePointerOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerOffset) property.
+2. Using the [`RangePointerOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerOffset) property. First, set the [`RangePointerPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerPosition) to Custom, and then set the [`RangePointerOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePointerOffset) property.
{% capture codesnippet2 %}
@@ -467,44 +341,28 @@ sfCircularGauge.Scales.Add(scale);
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
scale.RangePointerOffset = 0.5;
-
scale.RangePointerPosition = RangePointerPosition.Custom;
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.RangePointer;
-
circularPointer.Value = 90;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
@@ -513,59 +371,45 @@ sfCircularGauge.Scales.Add(scale);
{% endcapture %}
-{{ codesnippet2 | OrderList_Indent_Level_1 }}
+{{ codesnippet2 | OrderList_Indent_Level_1 }}
-
+
## Symbol pointer
-In symbol pointer, the value is pointed out using a symbol on the scale. The symbol is an enum property that provides symbol options for the symbol pointer, which contains several shapes such as rectangle, ellipse, and triangle.
+In a symbol pointer, the value is pointed out using a symbol on the scale. The [`Symbol`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_Symbol) is an `enum` property that provides symbol options for the symbol pointer, which contains several shapes such as rectangle, ellipse, and triangle.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.SymbolPointer;
-
circularPointer.Value = 60;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### Symbol pointer customization
@@ -575,378 +419,245 @@ You can modify the stroke of the symbol by changing the [`SymbolPointerStroke`](
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.SymbolPointer;
-
circularPointer.Value = 60;
-
circularPointer.SymbolPointerStroke = new SolidColorBrush(Colors.Red);
-
circularPointer.SymbolPointerHeight = 20;
-
circularPointer.SymbolPointerWidth = 20;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### Setting visibility of symbol pointer
-The visibility of the symbol pointer can be set using the [`SymbolPointerVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_SymbolPointerVisibility) Property.
+The visibility of the symbol pointer can be set using the [`SymbolPointerVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_SymbolPointerVisibility) property.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.SymbolPointerVisibility = Visibility.Hidden;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### Setting multiple pointers
-In addition to the default pointer, you can add n number of pointers to a scale using the [`Pointers`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Pointers) property.
+In addition to the default pointer, you can add multiple pointers to a scale using the [`Pointers`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Pointers) property.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.PointerType = PointerType.NeedlePointer;
-
circularPointer.NeedleLengthFactor = 0.4;
-
circularPointer.Value = 60;
-
circularPointer.NeedlePointerType = NeedlePointerType.Tapered;
-
circularPointer.PointerCapStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
scale.Pointers.Add(circularPointer);
-
CircularPointer circularPointer1 = new CircularPointer();
-
circularPointer1.PointerType = PointerType.RangePointer;
-
circularPointer1.Value = 100;
-
scale.Pointers.Add(circularPointer1);
-
CircularPointer circularPointer2 = new CircularPointer();
-
circularPointer2.PointerType = PointerType.SymbolPointer;
-
circularPointer2.Value = 50;
-
circularPointer2.Symbol = Symbol.Pentagon;
-
circularPointer2.SymbolPointerHeight = 20;
-
circularPointer2.SymbolPointerWidth = 20;
-
circularPointer2.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
scale.Pointers.Add(circularPointer2);
-
-scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting animation for pointer
-The [`EnableAnimation`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_EnableAnimation) property is a Boolean property that enables or disables the animation of the pointers in circular gauge.
+The [`EnableAnimation`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_EnableAnimation) property is a Boolean property that enables or disables the animation of the pointers in the circular gauge.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
- CircularScale scale = new CircularScale();
-
- scale.Radius = 150;
-
- CircularPointer circularPointer = new CircularPointer();
-
- circularPointer.PointerType = PointerType.NeedlePointer;
-
- circularPointer.EnableAnimation = true;
-
- circularPointer.NeedleLengthFactor = 0.4;
-
- circularPointer.Value = 60;
-
- circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
-
- circularPointer.PointerCapDiameter = 20;
-
- circularPointer.PointerCapStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
- scale.Pointers.Add(circularPointer);
-
- CircularPointer circularPointer1 = new CircularPointer();
-
- circularPointer1.PointerType = PointerType.RangePointer;
-
- circularPointer1.RangePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
- circularPointer1.EnableAnimation = true;
-
- circularPointer1.Value = 100;
-
- scale.Pointers.Add(circularPointer1);
-
- scale.Pointers.Add(circularPointer);
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+CircularScale scale = new CircularScale();
+scale.Radius = 150;
+CircularPointer circularPointer = new CircularPointer();
+circularPointer.PointerType = PointerType.NeedlePointer;
+circularPointer.EnableAnimation = true;
+circularPointer.NeedleLengthFactor = 0.4;
+circularPointer.Value = 60;
+circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
+circularPointer.PointerCapDiameter = 20;
+circularPointer.PointerCapStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
+scale.Pointers.Add(circularPointer);
- sfCircularGauge.Scales.Add(scale);
+CircularPointer circularPointer1 = new CircularPointer();
+circularPointer1.PointerType = PointerType.RangePointer;
+circularPointer1.RangePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
+circularPointer1.EnableAnimation = true;
+circularPointer1.Value = 100;
+scale.Pointers.Add(circularPointer1);
+sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
+
### Step frequency
The [`StepFrequency`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_StepFrequency) property is used to specify the interval between snap points while dragging the [`SymbolPointer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.PointerType.html#Syncfusion_UI_Xaml_Gauges_PointerType_SymbolPointer) or [`NeedlePointer`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.PointerType.html#Syncfusion_UI_Xaml_Gauges_PointerType_NeedlePointer).
-For example, when the value of [`StepFrequency`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_StepFrequency) is 20, then while dragging, the pointer will not move continuously, instead it will update in terms of 20.
+For example, when the value of [`StepFrequency`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_StepFrequency) is 20, while dragging the pointer will not move continuously; instead, it will update in terms of 20.
-N> To work with the [`StepFrequency`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_StepFrequency) value, enable pointer dragging support.
+N> To work with the [`StepFrequency`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_StepFrequency) value, enable pointer dragging support using the [`EnableDragging`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_EnableDragging) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
+sfCircularGauge.Height = 500;
+sfCircularGauge.Width = 500;
+CircularScale circularScale = new CircularScale();
+circularScale.Radius = 150;
+circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.RimStrokeThickness = 9;
+circularScale.TickPosition = TickPosition.Cross;
+circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
- sfCircularGauge.Height = 500;
-
- sfCircularGauge.Width = 500;
-
- CircularScale circularScale = new CircularScale();
-
- circularScale.Radius = 150;
-
- circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
- circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.RimStrokeThickness = 9;
- circularScale.TickPosition = TickPosition.Cross;
-
- circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
- CircularPointer circularPointer = new CircularPointer();
- circularPointer.PointerType = PointerType.NeedlePointer;
- circularPointer.Value = 60;
- circularPointer.EnableAnimation = false;
- circularPointer.EnableDragging = true;
- circularPointer.StepFrequency = 20;
- circularPointer.NeedleLengthFactor = 0.7;
-
- circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
-
- circularPointer.PointerCapDiameter = 20;
-
- circularPointer.PointerCapStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
-
- circularPointer.NeedlePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
-
- circularScale.Pointers.Add(circularPointer);
-
- CircularPointer circularPointer2 = new CircularPointer();
-
- circularPointer2.PointerType = PointerType.SymbolPointer;
-
- circularPointer2.Value = 70;
-
- circularPointer2.StepFrequency = 5;
-
- circularPointer2.EnableDragging = true;
- circularPointer2.EnableAnimation = false;
-
- circularPointer2.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.Arrow;
-
- circularScale.Pointers.Add(circularPointer2);
-
- sfCircularGauge.Scales.Add(circularScale);
-
- grid.Children.Add(sfCircularGauge);
+CircularPointer circularPointer = new CircularPointer();
+circularPointer.PointerType = PointerType.NeedlePointer;
+circularPointer.Value = 60;
+circularPointer.EnableAnimation = false;
+circularPointer.EnableDragging = true;
+circularPointer.StepFrequency = 20;
+circularPointer.NeedleLengthFactor = 0.7;
+circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
+circularPointer.PointerCapDiameter = 20;
+circularPointer.PointerCapStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
+circularPointer.NeedlePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x39, 0xb2, 0xc6));
+circularScale.Pointers.Add(circularPointer);
+CircularPointer circularPointer2 = new CircularPointer();
+circularPointer2.PointerType = PointerType.SymbolPointer;
+circularPointer2.Value = 70;
+circularPointer2.StepFrequency = 5;
+circularPointer2.EnableDragging = true;
+circularPointer2.EnableAnimation = false;
+circularPointer2.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.Arrow;
+circularScale.Pointers.Add(circularPointer2);
+sfCircularGauge.Scales.Add(circularScale);
+grid.Children.Add(sfCircularGauge);
{% endhighlight %}
@@ -956,7 +667,7 @@ SfCircularGauge sfCircularGauge = new SfCircularGauge();
### Value change started event
-Called when the user starts updating a new value of the pointer by initiating the dragging. While dragging the pointer, other events (ValueChanging, ValueChanged, and ValueChangeCompleted) will be followed after this event.
+Called when the user starts updating a new value of the pointer by initiating the dragging. While dragging the pointer, other events ([`ValueChanging`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_ValueChanging), [`ValueChanged`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_ValueChanged), and [`ValueChangeCompleted`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_ValueChangeCompleted)) will follow after this event.
The [`ValueChangeStarted`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_ValueChangeStarted) event contains the following argument.
@@ -966,20 +677,23 @@ The [`ValueChangeStarted`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml
{% highlight xml %}
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- private void CircularPointer_ValueChangeStarted(object sender, Syncfusion.UI.Xaml.Gauges.PointerValueChangedEventArgs e)
- {
-
- }
+private void CircularPointer_ValueChangeStarted(object sender, Syncfusion.UI.Xaml.Gauges.PointerValueChangedEventArgs e)
+{
+}
{% endhighlight %}
@@ -987,7 +701,7 @@ The [`ValueChangeStarted`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml
### Value changing event
-Called during a drag when the user is updating before a new value for the pointer by dragging
+Called during a drag when the user is updating the pointer with a new value.
The [`ValueChanging`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_ValueChanging) event contains the following argument.
@@ -999,20 +713,23 @@ The [`ValueChanging`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gaug
{% highlight xml %}
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- private void CircularPointer_ValueChanging(object sender, Syncfusion.UI.Xaml.Gauges.PointerValueChangingEventArgs e)
- {
-
- }
+private void CircularPointer_ValueChanging(object sender, Syncfusion.UI.Xaml.Gauges.PointerValueChangingEventArgs e)
+{
+}
{% endhighlight %}
@@ -1020,7 +737,7 @@ The [`ValueChanging`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gaug
### Value change completed event
-Called after a new value has been updated by terminating the dragging of the pointer. While dragging the pointer, other events (ValueChangeStarted, ValueChanging, and ValueChanged) will be called prior to the ValueChangeCompleted event.
+Called after a new value has been updated by terminating the dragging of the pointer. While dragging the pointer, other events ([`ValueChangeStarted`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_ValueChangeStarted), [`ValueChanging`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_ValueChanging), and [`ValueChanged`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_ValueChanged)) will be called prior to the [`ValueChangeCompleted`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularPointer.html#Syncfusion_UI_Xaml_Gauges_CircularPointer_ValueChangeCompleted) event.
This event will notify the completion of dragging with a new value being updated.
@@ -1032,20 +749,23 @@ The [`ValueChangeCompleted`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xa
{% highlight xml %}
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- private void CircularPointer_ValueChangeCompleted(object sender, Syncfusion.UI.Xaml.Gauges.PointerValueChangedEventArgs e)
- {
-
- }
+private void CircularPointer_ValueChangeCompleted(object sender, Syncfusion.UI.Xaml.Gauges.PointerValueChangedEventArgs e)
+{
+}
{% endhighlight %}
diff --git a/chart-sdk/uwp/Radial-Gauge/Ranges.md b/chart-sdk/uwp/Radial-Gauge/Ranges.md
index d2f5415dd..3f0660861 100644
--- a/chart-sdk/uwp/Radial-Gauge/Ranges.md
+++ b/chart-sdk/uwp/Radial-Gauge/Ranges.md
@@ -1,801 +1,503 @@
---
layout: post
-title: Ranges in UWP Radial Gauge control | Syncfusion
-description: Learn here all about Ranges support in Syncfusion UWP Radial Gauge (SfCircularGauge) control and more.
+title: Ranges in UWP Radial Gauge | Syncfusion®
+description: Ranges in the UWP Radial Gauge highlight specific value intervals on the gauge scale, helping visualize thresholds, targets, and data groups.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# Ranges in UWP Radial Gauge (SfCircularGauge)
+# Ranges in UWP Radial Gauge
-Range is a visual element, which begins and ends at the specified values within a scale.
+A range is a visual element that begins and ends at the specified values within a scale.
## Setting start and end values for range
-The start and end values of ranges are set by using the [`StartValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_StartValue) and [`EndValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_EndValue) properties.
+The start and end values of ranges are set by using the [`StartValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_StartValue) and [`EndValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_EndValue) properties.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularRange circularRange = new CircularRange();
-
circularRange.StartValue = 0;
-
circularRange.EndValue = 50;
-
circularRange.Stroke = new SolidColorBrush(Color.FromArgb(0xff, 0xd1, 0xdb, 0xdb));
-
circularScale.Ranges.Add(circularRange);
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Range customization
-A range’s UI is customized by using the [`Stroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_Stroke) , [`StrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_StrokeThickness) , and [`RangeOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangeOffset) properties. First, set the [`RangePosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePosition) property to custom, and then set the offset.
+A range's UI is customized by using the [`Stroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_Stroke), [`StrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_StrokeThickness), and [`RangeOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangeOffset) properties. First, set the [`RangePosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePosition) property to Custom, and then set the offset.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RangePosition = RangePosition.Custom;
-
circularScale.RangeOffset = 0.55;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularRange circularRange = new CircularRange();
-
circularRange.StartValue = 0;
-
circularRange.EndValue = 50;
-
circularRange.Stroke = new SolidColorBrush(Colors.Pink);
-
circularRange.StrokeThickness = 40;
-
circularScale.Ranges.Add(circularRange);
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting width for range
-The appearance of the circular range is customized by setting the [`StartWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_StartWidth) and [`EndWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_EndWidth) properties.
+The appearance of the circular range is customized by setting the [`StartWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_StartWidth) and [`EndWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_EndWidth) properties.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RangePosition = RangePosition.Inside;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
CircularRange circularRange = new CircularRange();
-
circularRange.StartValue = 10;
-
circularRange.EndValue = 80;
-
circularRange.StrokeThickness = 10;
-
circularRange.StartWidth = 1;
-
circularRange.EndWidth = 10;
-
circularRange.Stroke = new SolidColorBrush(Color.FromArgb(0xff, 0xd1, 0xdb, 0xdb));
-
circularScale.Ranges.Add(circularRange);
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Binding range stroke
-You can bind the range’s stroke to the tick lines and labels within its range by setting the [`BindRangeStrokeToLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_BindRangeStrokeToLabels) and [`BindRangeStrokeToTicks`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_BindRangeStrokeToTicks) properties to true.
+You can bind the range's stroke to the tick lines and labels within its range by setting the [`BindRangeStrokeToLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_BindRangeStrokeToLabels) and [`BindRangeStrokeToTicks`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_BindRangeStrokeToTicks) properties to true.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale scale = new CircularScale();
-
scale.Radius = 150;
-
scale.BindRangeStrokeToLabels = true;
-
scale.BindRangeStrokeToTicks = true;
-
CircularRange circularRange = new CircularRange();
-
circularRange.StartValue = 0;
-
circularRange.EndValue = 40;
-
circularRange.Stroke = new SolidColorBrush(Colors.Green);
-
circularRange.StrokeThickness = 10;
-
scale.Ranges.Add(circularRange);
-
CircularRange circularRange1 = new CircularRange();
-
circularRange1.StartValue = 40;
-
circularRange1.EndValue = 60;
-
circularRange1.Stroke = new SolidColorBrush(Colors.Yellow);
-
circularRange1.StrokeThickness = 10;
-
scale.Ranges.Add(circularRange1);
-
CircularRange circularRange2 = new CircularRange();
-
circularRange2.StartValue = 60;
-
circularRange2.EndValue = 100;
-
circularRange2.Stroke = new SolidColorBrush(Colors.Red);
-
circularRange2.StrokeThickness = 10;
-
scale.Ranges.Add(circularRange2);
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
scale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(scale);
{% endhighlight %}
{% endtabs %}
-
-
+
## Setting position for range
-The range can be placed inside the scale, outside the scale, or on the scale by using the following two ways:
+The range can be placed inside the scale, outside the scale, or on the scale in the following two ways:
### Range position
-You can place the range by selecting one of the options available in the [`RangePosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePosition) property.
+You can place the range by selecting one of the options available in the [`RangePosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePosition) property.
-1.Inside
-
-2.Outside
-
-3.SetAsGaugeRim (Default)
-
-4.Custom
+* Inside
+* Outside
+* SetAsGaugeRim (Default)
+* Custom
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RangePosition = RangePosition.Outside;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularRange circularRange = new CircularRange();
-
circularRange.StartValue = 0;
-
circularRange.EndValue = 40;
-
circularRange.Stroke = new SolidColorBrush(Colors.Green);
-
circularRange.StrokeThickness = 10;
-
circularScale.Ranges.Add(circularRange);
-
CircularRange circularRange1 = new CircularRange();
-
circularRange1.StartValue = 40;
-
circularRange1.EndValue = 60;
-
circularRange1.Stroke = new SolidColorBrush(Colors.Yellow);
-
circularRange1.StrokeThickness = 10;
-
circularScale.Ranges.Add(circularRange1);
-
CircularRange circularRange2 = new CircularRange();
-
circularRange2.StartValue = 60;
-
circularRange2.EndValue = 100;
-
circularRange2.Stroke = new SolidColorBrush(Colors.Red);
-
circularRange2.StrokeThickness = 10;
-
circularScale.Ranges.Add(circularRange2);
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
### Range offset
-You can place the range by using [`RangeOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangeOffset) property. First, set the [`RangePosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePosition) to custom, and then set the [`RangeOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangeOffset) property.
+You can place the range by using the [`RangeOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangeOffset) property. First, set the [`RangePosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangePosition) to Custom, and then set the [`RangeOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RangeOffset) property.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RangeOffset = 0.5;
-
circularScale.RangePosition = RangePosition.Custom;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularRange circularRange = new CircularRange();
-
circularRange.StartValue = 0;
-
circularRange.EndValue = 100;
-
circularRange.StrokeThickness = 8;
-
circularRange.Stroke = new SolidColorBrush(Color.FromArgb(0xff, 0xd1, 0xdb, 0xdb));
-
circularScale.Ranges.Add(circularRange);
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting multiple ranges
-In addition to the default range, you can add n number of ranges to a scale by using the [`Ranges`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Ranges) property.
+In addition to the default range, you can add multiple ranges to a scale by using the [`Ranges`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Ranges) property.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RangePosition = RangePosition.Inside;
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularRange circularRange = new CircularRange();
-
circularRange.StartValue = 0;
-
circularRange.EndValue = 40;
-
circularRange.Stroke = new SolidColorBrush(Colors.Green);
-
circularRange.StrokeThickness = 10;
-
circularRange.StartWidth = 1;
-
circularRange.EndWidth = 10;
-
circularScale.Ranges.Add(circularRange);
-
CircularRange circularRange1 = new CircularRange();
-
circularRange1.StartValue = 40;
-
circularRange1.EndValue = 60;
-
circularRange1.Stroke = new SolidColorBrush(Colors.Yellow);
-
circularRange1.StrokeThickness = 10;
-
circularRange1.StartWidth = 1;
-
circularRange1.EndWidth = 10;
-
circularScale.Ranges.Add(circularRange1);
-
CircularRange circularRange2 = new CircularRange();
-
circularRange2.StartValue = 60;
-
circularRange2.EndValue = 100;
-
circularRange2.Stroke = new SolidColorBrush(Colors.Red);
-
circularRange2.StrokeThickness = 10;
-
circularRange2.StartWidth = 1;
-
circularRange2.EndWidth = 10;
-
circularScale.Ranges.Add(circularRange2);
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting gradient color for range
-You can give smooth color transition to range by specifying the different colors based on range value.
+You can give a smooth color transition to a range by specifying the different colors based on the range value using the [`GradientStops`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularRange.html#Syncfusion_UI_Xaml_Gauges_CircularRange_GradientStops) property.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
- CircularScale circularScale = new CircularScale();
-
- circularScale.RangePosition = RangePosition.Inside;
-
- circularScale.Radius = 150;
-
- circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
- circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.RimStrokeThickness = 8;
-
- circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
- CircularRange circularRange = new CircularRange();
-
- circularRange.StartValue = 0;
-
- circularRange.EndValue = 50;
-
- ObservableCollection gradientColor1 = new ObservableCollection();
-
- GaugeGradientStop gaugeGradientStop = new GaugeGradientStop();
-
- gaugeGradientStop.Value = 0;
-
- gaugeGradientStop.Color = Color.FromArgb(0xff, 0x30, 0xB3, 0x2D);
-
- gradientColor1.Add(gaugeGradientStop);
-
- GaugeGradientStop gaugeGradientStop1 = new GaugeGradientStop();
-
- gaugeGradientStop1.Value = 50;
-
- gaugeGradientStop1.Color = Color.FromArgb(0xff, 0xFF, 0xDD, 0x00);
-
- gradientColor1.Add(gaugeGradientStop1);
-
- circularRange.GradientStops = gradientColor1;
-
- circularScale.Ranges.Add(circularRange);
-
- CircularPointer circularPointer = new CircularPointer();
-
- circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+CircularScale circularScale = new CircularScale();
+circularScale.RangePosition = RangePosition.Inside;
+circularScale.Radius = 150;
+circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.RimStrokeThickness = 8;
+circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
- circularScale.Pointers.Add(circularPointer);
+CircularRange circularRange = new CircularRange();
+circularRange.StartValue = 0;
+circularRange.EndValue = 50;
+ObservableCollection gradientColor1 = new ObservableCollection();
+GaugeGradientStop gaugeGradientStop = new GaugeGradientStop();
+gaugeGradientStop.Value = 0;
+gaugeGradientStop.Color = Color.FromArgb(0xff, 0x30, 0xB3, 0x2D);
+gradientColor1.Add(gaugeGradientStop);
+
+GaugeGradientStop gaugeGradientStop1 = new GaugeGradientStop();
+gaugeGradientStop1.Value = 50;
+gaugeGradientStop1.Color = Color.FromArgb(0xff, 0xFF, 0xDD, 0x00);
+gradientColor1.Add(gaugeGradientStop1);
+circularRange.GradientStops = gradientColor1;
+circularScale.Ranges.Add(circularRange);
- sfCircularGauge.Scales.Add(circularScale);
+CircularPointer circularPointer = new CircularPointer();
+circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
+circularScale.Pointers.Add(circularPointer);
+sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Radial-Gauge/Rim.md b/chart-sdk/uwp/Radial-Gauge/Rim.md
index 5ce94b582..2bec22ca8 100644
--- a/chart-sdk/uwp/Radial-Gauge/Rim.md
+++ b/chart-sdk/uwp/Radial-Gauge/Rim.md
@@ -1,293 +1,198 @@
---
layout: post
-title: Rim in UWP Radial Gauge control | Syncfusion
-description: Learn here all about Rim support in Syncfusion UWP Radial Gauge (SfCircularGauge) control and more.
+title: Rim in UWP Radial Gauge | Syncfusion®
+description: Rim in the UWP Radial Gauge customizes the outer boundary of the gauge, enhancing appearance and improving visual presentation.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# Rim in UWP Radial Gauge (SfCircularGauge)
+# Rim in UWP Radial Gauge
-Scale determines the structure of a circular gauge by using a circular rim. By setting the [`StartAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartAngle) and [`SweepAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SweepAngle) properties, you can change the shape of the circular gauge to a full-circular gauge, half-circular gauge, or quarter-circular gauge.
+The scale determines the structure of a circular gauge by using a circular rim. By setting the [`StartAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartAngle) and [`SweepAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SweepAngle) properties, you can change the shape of the circular gauge to a full-circular gauge, half-circular gauge, or quarter-circular gauge.
-The [`StartValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartValue) and [`EndValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EndValue) properties determine the overall range of the circular rim.
+The [`StartValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartValue) and [`EndValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EndValue) properties determine the overall range of the circular rim.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.StartAngle = 270;
-
circularScale.SweepAngle = 360;
-
circularScale.StartValue = 0;
-
circularScale.EndValue = 360;
-
circularScale.Interval = 20;
-
circularScale.MinorTicksPerInterval = 0;
-
circularScale.Radius = 150;
-
circularScale.ShowFirstLabel = false;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Rim customization
-The color and thickness of the rim can be set by using the [`RimStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RimStroke) and [`RimStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RimStrokeThickness) properties.
+The color and thickness of the rim can be set by using the [`RimStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RimStroke) and [`RimStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RimStrokeThickness) properties.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RadiusFactor = 1;
-
circularScale.RimStrokeThickness = 40;
-
circularScale.RimStroke = new SolidColorBrush(Colors.SkyBlue);
-
circularScale.Radius = 150;
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting position for rim
-You can customize the position of [`Scales`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_Scales) in the following two ways:
+You can customize the position of the [`Scales`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_Scales) in the following two ways:
-1.`RadiusFactor` property.
-
-2.`Radius` property.
+1. Using the [`RadiusFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RadiusFactor) property.
+2. Using the [`Radius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Radius) property.
### Setting radius factor for rim
-The value for [`RadiusFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RadiusFactor) should be specified in offset value.
+The value for the [`RadiusFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_RadiusFactor) should be specified in an offset value.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RadiusFactor = 0.5;
-
circularScale.RimStrokeThickness = 30;
-
circularScale.Radius = 200;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
### Setting radius for rim
-You can set the [`Radius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Radius) of rim in pixel value.
+You can set the [`Radius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Radius) of the rim in a pixel value.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.RimStrokeThickness = 8;
-
circularScale.Radius = 100;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Radial-Gauge/Scales.md b/chart-sdk/uwp/Radial-Gauge/Scales.md
index 0ce813d2c..c8b7cb034 100644
--- a/chart-sdk/uwp/Radial-Gauge/Scales.md
+++ b/chart-sdk/uwp/Radial-Gauge/Scales.md
@@ -1,677 +1,476 @@
---
layout: post
-title: Scales in UWP Radial Gauge control | Syncfusion
-description: Learn here all about Scales support in Syncfusion UWP Radial Gauge (SfCircularGauge) control and more.
+title: Scales in UWP Radial Gauge | Syncfusion®
+description: Scales in the UWP Radial Gauge define value ranges, intervals, and labels, enabling accurate measurement and data representation.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# Scales in UWP Radial Gauge (SfCircularGauge)
+# Scales in UWP Radial Gauge
-Scales contain a collection of [`CircularScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html) elements, which integrate labels, tick marks, and a rim to customize the basic look and feel of the circular gauge.
+The scales contain a collection of [`CircularScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html) elements, which integrate labels, tick marks, and a rim to customize the basic look and feel of the circular gauge.
## Scale
-The [`CircularScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html) contains sub elements such as rim, ticks, labels, ranges, and pointers. They define the radius, start angle, sweep direction, sweep angle, overall minimum and maximum values, frequency of labels, and tick marks. A scale will have multiple ranges.
+The [`CircularScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html) contains sub elements such as a rim, ticks, labels, ranges, and pointers. They define the radius, start angle, sweep direction, sweep angle, overall minimum and maximum values, and frequency of labels and tick marks. A scale can have multiple ranges.
-A range is a visual element, which begins and ends at the specified values within a [`CircularScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html). A range will have one or more pointers to point out the values in a scale.
+A range is a visual element that begins and ends at the specified values within a [`CircularScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html). A range can have one or more pointers to point out the values in a scale.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting start and end values for scale
-The [`StartValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartValue) and [`EndValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EndValue) properties allow you to set the start and end values for a scale.
+The [`StartValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartValue) and [`EndValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EndValue) properties allow you to set the start and end values for a scale.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.StartValue = -30;
-
circularScale.EndValue = 50;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting start and sweep angles for scale
-The [`StartAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartAngle) and [`SweepAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SweepAngle) properties allow you to set the start and end angles for a scale.
+The [`StartAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartAngle) and [`SweepAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SweepAngle) properties allow you to set the start and end angles for a scale.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.StartAngle = 185;
-
circularScale.SweepAngle = 270;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
-
+
## Setting interval for scale
-The [`Interval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Interval) property allows you to set the interval for a scale.
+The [`Interval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Interval) property allows you to set the interval for a scale.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
CircularScale circularScale = new CircularScale();
-
circularScale.Radius = 150;
-
circularScale.StartValue = 0;
-
circularScale.EndValue = 500;
-
circularScale.Interval = 100;
-
circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
circularScale.RimStrokeThickness = 8;
-
circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
circularScale.Pointers.Add(circularPointer);
-
sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting auto interval for scale
-By default, the interval value is calculated by 10. By using the [`EnableAutoInterval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EnableAutoInterval) property, you can set auto interval based on the start and end values.
+By default, the interval value is calculated by 10. By using the [`EnableAutoInterval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_EnableAutoInterval) property, you can set the auto interval based on the start and end values.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
- CircularScale circularScale = new CircularScale();
-
- circularScale.Radius = 150;
-
- circularScale.StartValue = 0;
-
- circularScale.EndValue = 1000;
-
- circularScale.EnableAutoInterval = true;
-
- circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
- circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.RimStrokeThickness = 8;
-
- circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
- CircularPointer circularPointer = new CircularPointer();
-
- circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
- circularScale.Pointers.Add(circularPointer);
-
- sfCircularGauge.Scales.Add(circularScale);
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+CircularScale circularScale = new CircularScale();
+circularScale.Radius = 150;
+circularScale.StartValue = 0;
+circularScale.EndValue = 1000;
+circularScale.EnableAutoInterval = true;
+circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.RimStrokeThickness = 8;
+circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
+CircularPointer circularPointer = new CircularPointer();
+circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
+circularScale.Pointers.Add(circularPointer);
+sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting scale direction for scale
-The [`SweepDirection`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SweepDirection) property allows you to render the gauge scale in either clockwise or counterclockwise direction.
+The [`SweepDirection`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SweepDirection) property allows you to render the gauge scale in either a clockwise or counterclockwise direction.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
- CircularScale circularScale = new CircularScale();
-
- circularScale.Radius = 150;
-
- circularScale.StartValue = 0;
-
- circularScale.EndValue = 100;
-
- circularScale.SweepDirection = SweepDirection.Counterclockwise;
-
- circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
- circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.RimStrokeThickness = 8;
-
- circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
- CircularPointer circularPointer = new CircularPointer();
-
- circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
-
- circularScale.Pointers.Add(circularPointer);
-
- sfCircularGauge.Scales.Add(circularScale);
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+CircularScale circularScale = new CircularScale();
+circularScale.Radius = 150;
+circularScale.StartValue = 0;
+circularScale.EndValue = 100;
+circularScale.SweepDirection = SweepDirection.Counterclockwise;
+circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.RimStrokeThickness = 8;
+circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
+CircularPointer circularPointer = new CircularPointer();
+circularPointer.NeedlePointerVisibility = Windows.UI.Xaml.Visibility.Collapsed;
+circularScale.Pointers.Add(circularPointer);
+sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting multiple scales for circular gauge
-You can add multiple scales to the same circular gauge and customize all the scales in a [`Scales`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_Scales) collection.
+You can add multiple scales to the same circular gauge and customize all the scales in a [`Scales`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_Scales) collection.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
this.Background = new SolidColorBrush(Colors.Black);
-
SfCircularGauge circularGauge = new SfCircularGauge();
-
CircularScale scale1 = new CircularScale();
-
scale1.TickStroke = new SolidColorBrush(Colors.White);
-
scale1.LabelStroke = new SolidColorBrush(Colors.White);
-
scale1.SmallTickStroke = new SolidColorBrush(Colors.White);
-
scale1.Radius = 175;
CircularScale scale2 = new CircularScale();
-
scale2.TickStroke = new SolidColorBrush(Colors.White);
-
scale2.LabelStroke = new SolidColorBrush(Colors.White);
-
scale2.SmallTickStroke = new SolidColorBrush(Colors.White);
-
scale2.Radius = 90;
CircularRange circularRange = new CircularRange();
-
circularRange.StartValue = 0;
-
circularRange.EndValue = 60;
-
circularRange.Stroke = new SolidColorBrush(Color.FromArgb(0xFF, 0xB0, 0xB0, 0xB0));
-
circularRange.StrokeThickness = 5;
-
scale1.Ranges.Add(circularRange);
CircularRange circularRange1 = new CircularRange();
-
circularRange1.StartValue = 60;
-
circularRange1.EndValue = 100;
-
circularRange1.Stroke = new SolidColorBrush(Color.FromArgb(0xFF, 0xC1, 0x25, 0x2C));
-
circularRange1.StrokeThickness = 5;
-
scale1.Ranges.Add(circularRange1);
CircularPointer circularPointer = new CircularPointer();
-
circularPointer.Value = 30;
-
circularPointer.PointerType = PointerType.SymbolPointer;
-
circularPointer.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.InvertedArrow;
-
circularPointer.SymbolPointerWidth = 30;
-
circularPointer.SymbolPointerHeight = 20;
-
circularPointer.SymbolPointerStroke = new SolidColorBrush(Colors.Green);
-
circularPointer.SymbolPointerBorderBrush = new SolidColorBrush(Colors.Green);
-
scale1.Pointers.Add(circularPointer);
CircularRange circularRange2 = new CircularRange();
-
circularRange2.StartValue = 0;
-
circularRange2.EndValue = 60;
-
circularRange2.Stroke = new SolidColorBrush(Color.FromArgb(0xFF, 0xB0, 0xB0, 0xB0));
-
circularRange2.StrokeThickness = 5;
-
scale2.Ranges.Add(circularRange2);
CircularRange circularRange3 = new CircularRange();
-
circularRange3.StartValue = 60;
-
circularRange3.EndValue = 100;
-
circularRange3.Stroke = new SolidColorBrush(Color.FromArgb(0xFF, 0xC1, 0x25, 0x2C));
-
circularRange3.StrokeThickness = 5;
-
scale2.Ranges.Add(circularRange3);
CircularPointer circularPointer2 = new CircularPointer();
-
circularPointer2.Value = 30;
-
circularPointer2.PointerType = PointerType.NeedlePointer;
-
circularPointer2.NeedlePointerStroke = new SolidColorBrush(Color.FromArgb(0xFF, 0xC1, 0x25, 0x2C));
-
scale2.Pointers.Add(circularPointer2);
-
circularGauge.Scales.Add(scale1);
-
circularGauge.Scales.Add(scale2);
{% endhighlight %}
{% endtabs %}
-
+
## Calculate radius and center based on angle
-This feature is used to automatically adjust the radius and center of a circular gauge based on the `StartAngle` and `SweepAngle` properties by enable the `IsCenterAligned` property of gauge.
+This feature is used to automatically adjust the radius and center of a circular gauge based on the [`StartAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_StartAngle) and [`SweepAngle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SweepAngle) properties by enabling the [`IsCenterAligned`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_IsCenterAligned) property of the gauge.
-N> Default value of the IsCenterAligned property is false. To enable the center align feature, you need to set Ticks, Labels and Range position as Custom and set IsCenterAligned as true.
+N> The default value of the [`IsCenterAligned`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_IsCenterAligned) property is false. To enable the center align feature, you need to set the ticks, labels, and range positions to Custom and set [`IsCenterAligned`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_IsCenterAligned) to true.
{% tabs %}
{% highlight xaml %}
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
- sfCircularGauge.Height = 500;
- sfCircularGauge.Width = 500;
- sfCircularGauge.IsCenterAligned = true;
- CircularScale circularScale = new CircularScale();
- circularScale.EnableAutoAngle = true;
- circularScale.StartAngle = 180;
- circularScale.SweepAngle = 180;
- circularScale.StartValue = 0;
- circularScale.EndValue = 1000;
- circularScale.SymbolPointerOffset = 1;
- circularScale.Interval = 500;
- circularScale.RangePointerOffset = 0;
- circularScale.RimStroke = new SolidColorBrush(Colors.LightGray);
- circularScale.EnableAutoInterval = true;
- circularScale.RimStrokeThickness = 15;
- circularScale.TickStroke = new SolidColorBrush(Colors.LightGray);
- circularScale.LabelStroke = new SolidColorBrush(Colors.Black);
- circularScale.FontSize = 20;
- circularScale.SmallTickStroke = new SolidColorBrush(Colors.LightGray);
- CircularPointer circularPointer = new CircularPointer();
- circularPointer.PointerType = PointerType.NeedlePointer;
- circularPointer.Value = 500;
- circularPointer.NeedleLengthFactor = 0.5;
- circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
- circularPointer.PointerCapDiameter = 15;
- circularPointer.PointerCapStroke = new SolidColorBrush(Colors.Blue);
- circularPointer.NeedlePointerStroke = new SolidColorBrush(Colors.Black);
- circularScale.Pointers.Add(circularPointer);
- CircularPointer circularPointer1 = new CircularPointer();
- circularPointer1.RangeCap = RangeCap.Both;
- circularPointer1.PointerType = PointerType.RangePointer;
- circularPointer1.Value = 1000;
- circularPointer1.RangePointerStrokeThickness = 15;
- circularPointer1.RangePointerStroke = new SolidColorBrush(Colors.Brown);
- circularScale.Pointers.Add(circularPointer1);
- CircularPointer circularPointer2 = new CircularPointer();
- circularPointer2.PointerType = PointerType.SymbolPointer;
- circularPointer2.Value = 300;
- circularPointer2.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.InvertedArrow;
- circularPointer2.SymbolPointerBorderBrush = new SolidColorBrush(Colors.Brown);
- circularPointer2.SymbolPointerStroke = new SolidColorBrush(Colors.Brown);
- circularPointer2.SymbolPointerWidth = 30;
- circularPointer2.SymbolPointerHeight = 30;
- circularScale.Pointers.Add(circularPointer2);
- sfCircularGauge.Scales.Add(circularScale);
-
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+sfCircularGauge.Height = 500;
+sfCircularGauge.Width = 500;
+sfCircularGauge.IsCenterAligned = true;
+CircularScale circularScale = new CircularScale();
+circularScale.EnableAutoAngle = true;
+circularScale.StartAngle = 180;
+circularScale.SweepAngle = 180;
+circularScale.StartValue = 0;
+circularScale.EndValue = 1000;
+circularScale.SymbolPointerOffset = 1;
+circularScale.Interval = 500;
+circularScale.RangePointerOffset = 0;
+circularScale.RimStroke = new SolidColorBrush(Colors.LightGray);
+circularScale.EnableAutoInterval = true;
+circularScale.RimStrokeThickness = 15;
+circularScale.TickStroke = new SolidColorBrush(Colors.LightGray);
+circularScale.LabelStroke = new SolidColorBrush(Colors.Black);
+circularScale.FontSize = 20;
+circularScale.SmallTickStroke = new SolidColorBrush(Colors.LightGray);
+
+CircularPointer circularPointer = new CircularPointer();
+circularPointer.PointerType = PointerType.NeedlePointer;
+circularPointer.Value = 500;
+circularPointer.NeedleLengthFactor = 0.5;
+circularPointer.NeedlePointerType = NeedlePointerType.Triangle;
+circularPointer.PointerCapDiameter = 15;
+circularPointer.PointerCapStroke = new SolidColorBrush(Colors.Blue);
+circularPointer.NeedlePointerStroke = new SolidColorBrush(Colors.Black);
+circularScale.Pointers.Add(circularPointer);
+
+CircularPointer circularPointer1 = new CircularPointer();
+circularPointer1.RangeCap = RangeCap.Both;
+circularPointer1.PointerType = PointerType.RangePointer;
+circularPointer1.Value = 1000;
+circularPointer1.RangePointerStrokeThickness = 15;
+circularPointer1.RangePointerStroke = new SolidColorBrush(Colors.Brown);
+circularScale.Pointers.Add(circularPointer1);
+
+CircularPointer circularPointer2 = new CircularPointer();
+circularPointer2.PointerType = PointerType.SymbolPointer;
+circularPointer2.Value = 300;
+circularPointer2.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.InvertedArrow;
+circularPointer2.SymbolPointerBorderBrush = new SolidColorBrush(Colors.Brown);
+circularPointer2.SymbolPointerStroke = new SolidColorBrush(Colors.Brown);
+circularPointer2.SymbolPointerWidth = 30;
+circularPointer2.SymbolPointerHeight = 30;
+circularScale.Pointers.Add(circularPointer2);
+sfCircularGauge.Scales.Add(circularScale);
+
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Radial-Gauge/Ticks.md b/chart-sdk/uwp/Radial-Gauge/Ticks.md
index 58a628dc1..bb1583159 100644
--- a/chart-sdk/uwp/Radial-Gauge/Ticks.md
+++ b/chart-sdk/uwp/Radial-Gauge/Ticks.md
@@ -1,21 +1,21 @@
---
layout: post
-title: Ticks in UWP Radial Gauge control | Syncfusion
-description: Learn here all about Ticks support in Syncfusion UWP Radial Gauge (SfCircularGauge) control and more.
+title: Ticks in UWP Radial Gauge | Syncfusion®
+description: Ticks in the UWP Radial Gauge indicate scale intervals and support customization of size, position, style, and appearance settings.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# Ticks in UWP Radial Gauge (SfCircularGauge)
+# Ticks in UWP Radial Gauge
-Ticks help you identify the gauge’s data value by marking the gauge scale in regular increments.
+Ticks help you identify the gauge's data value by marking the gauge scale in regular increments.
## Tick customization
-The Interval property is used to calculate the tick count for a scale. Similar ticks, small ticks are calculated using the [`MinorTicksPerInterval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_MinorTicksPerInterval) property.
+The [`Interval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_Interval) property is used to calculate the tick count for a scale. Similarly, small ticks are calculated using the [`MinorTicksPerInterval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_MinorTicksPerInterval) property.
-The length, stroke, and stroke thickness of a tick are set using the [`TickLength`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickLength), [`TickStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickStroke), and [`TickStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickStrokeThickness) UI properties, respectively. Similar ticks, the length, stroke, and stroke thickness of a small tick are set using the [`SmallTickLength`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SmallTickLength), [`SmallTickStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SmallTickStroke), and [`SmallTickStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SmallTickStrokeThickness) UI properties, respectively.
+The length, stroke, and stroke thickness of a tick are set using the [`TickLength`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickLength), [`TickStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickStroke), and [`TickStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickStrokeThickness) properties, respectively. Similarly, the length, stroke, and stroke thickness of a small tick are set using the [`SmallTickLength`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SmallTickLength), [`SmallTickStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SmallTickStroke), and [`SmallTickStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_SmallTickStrokeThickness) properties, respectively.
### Customize major ticks for scale
@@ -23,51 +23,34 @@ The length, stroke, and stroke thickness of a tick are set using the [`TickLengt
{% highlight xml %}
-
-
+
-
-
-
-
-
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
- CircularScale circularScale = new CircularScale();
-
- circularScale.Radius = 150;
-
- circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
- circularScale.TickLength = 20;
-
- circularScale.TickStrokeThickness = 2;
-
- circularScale.TickStroke = new SolidColorBrush(Colors.Brown);
-
- circularScale.SmallTickStroke = new SolidColorBrush(Colors.White);
-
- circularScale.RimStrokeThickness = 9;
-
- circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
- sfCircularGauge.Scales.Add(circularScale);
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+CircularScale circularScale = new CircularScale();
+circularScale.Radius = 150;
+circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+circularScale.TickLength = 20;
+circularScale.TickStrokeThickness = 2;
+circularScale.TickStroke = new SolidColorBrush(Colors.Brown);
+circularScale.SmallTickStroke = new SolidColorBrush(Colors.White);
+circularScale.RimStrokeThickness = 9;
+circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
+sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
### Customize minor ticks for scale
@@ -75,241 +58,159 @@ The length, stroke, and stroke thickness of a tick are set using the [`TickLengt
{% highlight xml %}
-
-
+
-
-
-
-
-
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
- CircularScale circularScale = new CircularScale();
-
- circularScale.Radius = 150;
-
- circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
- circularScale.SmallTickLength = 10;
-
- circularScale.SmallTickStrokeThickness = 2;
-
- circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.SmallTickStroke = new SolidColorBrush(Colors.Blue);
-
- circularScale.RimStrokeThickness = 9;
-
- circularScale.MinorTicksPerInterval = 3;
-
- circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
- sfCircularGauge.Scales.Add(circularScale);
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+CircularScale circularScale = new CircularScale();
+circularScale.Radius = 150;
+circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+circularScale.SmallTickLength = 10;
+circularScale.SmallTickStrokeThickness = 2;
+circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.SmallTickStroke = new SolidColorBrush(Colors.Blue);
+circularScale.RimStrokeThickness = 9;
+circularScale.MinorTicksPerInterval = 3;
+circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
+sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting shape for tick
-The [`TickShape`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickShape) is an enum property that provides an option to select shape of the circular mark ticks, which contains several shapes such as rectangle, ellipse, and triangle.
+The [`TickShape`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickShape) is an `enum` property that provides an option to select the shape of the circular mark ticks, which contains several shapes such as rectangle, ellipse, and triangle.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
- CircularScale circularScale = new CircularScale();
-
- circularScale.Radius = 150;
-
- circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
- circularScale.SmallTickLength = 10;
-
- circularScale.SmallTickStrokeThickness = 2;
-
- circularScale.TickStroke = new SolidColorBrush(Colors.Blue);
-
- circularScale.SmallTickStroke = new SolidColorBrush(Colors.Blue);
-
- circularScale.RimStrokeThickness = 9;
-
- circularScale.TickShape = TickShape.Triangle;
-
- circularScale.MinorTicksPerInterval = 3;
-
- circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
- sfCircularGauge.Scales.Add(circularScale);
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+CircularScale circularScale = new CircularScale();
+circularScale.Radius = 150;
+circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+circularScale.SmallTickLength = 10;
+circularScale.SmallTickStrokeThickness = 2;
+circularScale.TickStroke = new SolidColorBrush(Colors.Blue);
+circularScale.SmallTickStroke = new SolidColorBrush(Colors.Blue);
+circularScale.RimStrokeThickness = 9;
+circularScale.TickShape = TickShape.Triangle;
+circularScale.MinorTicksPerInterval = 3;
+circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
+sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
## Setting position for tick
-The major and minor ticks can be positioned far away from the rim using the following two ways:
-
- 1. Using the `MajorTickOffset` and `MinorTickOffset` properties. First, set the `TickPosition` property to custom, and then set the offset of the tick.
+The major and minor ticks can be positioned far away from the rim in the following two ways:
+
+1. Using the [`MajorTickOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_MajorTickOffset) and [`MinorTickOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_MinorTickOffset) properties. First, set the [`TickPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickPosition) property to Custom, and then set the offset of the tick.
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
- CircularScale circularScale = new CircularScale();
-
- circularScale.Radius = 150;
-
- circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
- circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.RimStrokeThickness = 9;
-
- circularScale.MinorTicksPerInterval = 3;
-
- circularScale.TickPosition = TickPosition.Custom;
-
- circularScale.MajorTickOffset = 0.5;
-
- circularScale.MinorTickOffset = 0.5;
-
- circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
- sfCircularGauge.Scales.Add(circularScale);
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+CircularScale circularScale = new CircularScale();
+circularScale.Radius = 150;
+circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.RimStrokeThickness = 9;
+circularScale.MinorTicksPerInterval = 3;
+circularScale.TickPosition = TickPosition.Custom;
+circularScale.MajorTickOffset = 0.5;
+circularScale.MinorTickOffset = 0.5;
+circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
+sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
-
- 2. Placing the ticks inside the scale, outside the scale, or across the scale by selecting one of the options available in the `TickPosition` property.
-
- They are:
-
-1. Inside (Default)
+
-2. Outside
+2. Placing the ticks inside the scale, outside the scale, or across the scale by selecting one of the options available in the [`TickPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.CircularScale.html#Syncfusion_UI_Xaml_Gauges_CircularScale_TickPosition) property.
-3. Cross
+They are:
-4. Custom
+* Inside (Default)
+* Outside
+* Cross
+* Custom
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
+
-
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge sfCircularGauge = new SfCircularGauge();
-
- CircularScale circularScale = new CircularScale();
-
- circularScale.Radius = 150;
-
- circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
-
- circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
-
- circularScale.RimStrokeThickness = 9;
-
- circularScale.MinorTicksPerInterval = 3;
-
- circularScale.TickPosition = TickPosition.Outside;
-
- circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
-
- sfCircularGauge.Scales.Add(circularScale);
+SfCircularGauge sfCircularGauge = new SfCircularGauge();
+CircularScale circularScale = new CircularScale();
+circularScale.Radius = 150;
+circularScale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x57, 0xb2, 0xc6));
+circularScale.TickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.SmallTickStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xc1, 0xc1, 0xc1));
+circularScale.RimStrokeThickness = 9;
+circularScale.MinorTicksPerInterval = 3;
+circularScale.TickPosition = TickPosition.Outside;
+circularScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x99, 0x99, 0x99));
+sfCircularGauge.Scales.Add(circularScale);
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Radial-Gauge/annotations.md b/chart-sdk/uwp/Radial-Gauge/annotations.md
index 1e4e202c0..901e85146 100644
--- a/chart-sdk/uwp/Radial-Gauge/annotations.md
+++ b/chart-sdk/uwp/Radial-Gauge/annotations.md
@@ -1,352 +1,213 @@
---
layout: post
-title: Annotations in UWP Radial Gauge control | Syncfusion
-description: Learn here all about Annotations support in Syncfusion UWP Radial Gauge (SfCircularGauge) control and more.
+title: Annotations in UWP Radial Gauge | Syncfusion®
+description: Annotations in the UWP Radial Gauge allow you to add custom text, shapes, and UI elements to provide additional gauge information.
platform: chart-sdk
control: SfCircularGauge
documentation: ug
---
-# Annotations in UWP Radial Gauge (SfCircularGauge)
+# Annotations in UWP Radial Gauge
-[`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) supports [`Annotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_Annotations), which allows you to mark the specific area of interest in circular gauge. You can place custom views as annotations. The text and images also can be added by using [`Annotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_Annotations) property.
+[`SfCircularGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html) supports [`Annotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_Annotations), which allows you to mark a specific area of interest in a circular gauge. You can place custom views as annotations. Text and images can also be added by using the [`Annotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfCircularGauge.html#Syncfusion_UI_Xaml_Gauges_SfCircularGauge_Annotations) property.
-## Setting image annotation
+## Setting image annotation
-Annotations provide options to add any image over the gauge control with respect to its offset position. You can add multiple images in single control.
+Annotations provide options to add any image over the gauge control with respect to its [`Offset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.GaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_GaugeAnnotation_Offset) position. You can add multiple images in a single control. The image is placed using the [`ContentTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.GaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_GaugeAnnotation_ContentTemplate) property of [`GaugeAnnotation`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.GaugeAnnotation.html), and its position is controlled by the [`Angle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.GaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_GaugeAnnotation_Angle) and [`Offset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.GaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_GaugeAnnotation_Offset) properties.
{% tabs %}
{% highlight xaml %}
-
-
+
-
-
-
-
-
-
-
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge gauge = new SfCircularGauge();
-
- CircularScale scale = new CircularScale();
-
- scale.RimStrokeThickness = 20;
-
- scale.Radius = 150;
-
- scale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
-
- scale.StartAngle = 90;
-
- scale.SweepAngle = 360;
-
- scale.StartValue = 0;
-
- scale.EndValue = 100;
-
- scale.Interval = 10;
-
- scale.RangePointerPosition = RangePointerPosition.Custom;
-
- scale.RangePointerOffset = 0;
-
- CircularPointer pointer = new CircularPointer();
-
- pointer.PointerType = PointerType.RangePointer;
-
- pointer.Value = 73.2;
-
- pointer.RangePointerStrokeThickness = 20;
-
- pointer.RangeCap = RangeCap.Both;
-
- pointer.RangePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xFC, 0xFB, 0x48));
-
- scale.Pointers.Add(pointer);
-
- gauge.HeaderAlignment = HeaderAlignment.Custom;
-
- gauge.GaugeHeaderPosition = new Point(0.46, 0.5);
-
- TextBlock textBlock = new TextBlock();
-
- textBlock.Text = "73.2 F";
-
- textBlock.Height = 40;
-
- textBlock.Width = 120;
-
- textBlock.FontSize = 20;
-
- textBlock.FontStyle = Windows.UI.Text.FontStyle.Normal;
-
- textBlock.Foreground = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- gauge.GaugeHeader = textBlock;
-
- GaugeAnnotation annotation = new GaugeAnnotation();
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "";
-
- content += "";
-
- content += "" + "" + "";
-
- content += "";
-
- annotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
-
- annotation.Angle = 270;
-
- annotation.Offset = 0.1;
-
- gauge.Annotations.Add(annotation);
-
- gauge.Scales.Add(scale);
-
- this.Content = gauge;
+SfCircularGauge gauge = new SfCircularGauge();
+CircularScale scale = new CircularScale();
+scale.RimStrokeThickness = 20;
+scale.Radius = 150;
+scale.RimStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
+scale.StartAngle = 90;
+scale.SweepAngle = 360;
+scale.StartValue = 0;
+scale.EndValue = 100;
+scale.Interval = 10;
+scale.RangePointerPosition = RangePointerPosition.Custom;
+scale.RangePointerOffset = 0;
+CircularPointer pointer = new CircularPointer();
+pointer.PointerType = PointerType.RangePointer;
+pointer.Value = 73.2;
+pointer.RangePointerStrokeThickness = 20;
+pointer.RangeCap = RangeCap.Both;
+pointer.RangePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xFC, 0xFB, 0x48));
+scale.Pointers.Add(pointer);
+gauge.HeaderAlignment = HeaderAlignment.Custom;
+gauge.GaugeHeaderPosition = new Point(0.46, 0.5);
+TextBlock textBlock = new TextBlock();
+textBlock.Text = "73.2 F";
+textBlock.Height = 40;
+textBlock.Width = 120;
+textBlock.FontSize = 20;
+textBlock.FontStyle = Windows.UI.Text.FontStyle.Normal;
+textBlock.Foreground = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+gauge.GaugeHeader = textBlock;
+GaugeAnnotation annotation = new GaugeAnnotation();
+var content = "";
+content += "";
+content += "";
+content += "";
+content += "";
+content += "" + "" + "";
+content += "";
+annotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
+annotation.Angle = 270;
+annotation.Offset = 0.1;
+gauge.Annotations.Add(annotation);
+gauge.Scales.Add(scale);
+this.Content = gauge;
{% endhighlight %}
{% endtabs %}
-
+
-## Setting text annotation
+## Setting text annotation
-You can add any text over the gauge control to enhance the readability. You can add multiple text instances in single control.
+You can add any text over the gauge control to enhance readability. You can add multiple text instances in a single control.
{% tabs %}
{% highlight xaml %}
-
-
+
-
-
-
-
-
-
-
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
+
{% endhighlight %}
{% highlight c# %}
- SfCircularGauge gauge = new SfCircularGauge();
-
- CircularScale scale = new CircularScale();
-
- scale.Radius = 200;
-
- scale.StartAngle = 160;
-
- scale.SweepAngle = 270;
-
- scale.StartValue = 0;
-
- scale.EndValue = 15;
-
- scale.RangePointerOffset = 0.2;
-
- scale.SymbolPointerOffset = 0.5;
-
- CircularPointer rangePointer = new CircularPointer();
-
- rangePointer.PointerType = PointerType.RangePointer;
-
- rangePointer.RangeStart = 1.5;
-
- rangePointer.RangePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x06, 0x82, 0xF6));
-
- rangePointer.Value = 13;
-
- rangePointer.RangeCap = RangeCap.End;
-
- rangePointer.RangePointerStrokeThickness = 30;
-
- scale.Pointers.Add(rangePointer);
-
- gauge.HeaderAlignment = HeaderAlignment.Custom;
-
- gauge.GaugeHeaderPosition = new Point(0.48, 0.48);
-
- TextBlock textBlock = new TextBlock();
-
- textBlock.Text = "13M";
-
- textBlock.Height = 40;
-
- textBlock.Width = 120;
-
- textBlock.FontSize = 20;
-
- textBlock.FontStyle = Windows.UI.Text.FontStyle.Normal;
-
- textBlock.Foreground = new SolidColorBrush(Color.FromArgb(0xff,0x06,0x82,0xF6));
-
- gauge.GaugeHeader = textBlock;
-
- CircularPointer pointer1 = new CircularPointer();
-
- pointer1.PointerType = PointerType.SymbolPointer;
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "";
-
- content += "";
-
- content += "" + "" + "";
-
- content += "";
-
- pointer1.SymbolPointerTemplate = (DataTemplate)XamlReader.Load(content);
-
- pointer1.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.Custom;
-
- pointer1.SymbolPointerWidth = 60;
-
- pointer1.SymbolPointerHeight = 60;
-
- pointer1.Value = 0;
-
- scale.Pointers.Add(pointer1);
-
- CircularPointer pointer2 = new CircularPointer();
-
- pointer2.PointerType = PointerType.SymbolPointer;
-
- pointer2.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.Ellipse;
-
- pointer2.SymbolPointerWidth = 30;
-
- pointer2.SymbolPointerHeight = 30;
-
- pointer2.SymbolPointerBorderBrush = new SolidColorBrush(Color.FromArgb(0xff, 0x9e, 0x9e, 0x9e));
-
- pointer2.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x9e, 0x9e, 0x9e));
-
- pointer2.Value = 13;
-
- scale.Pointers.Add(pointer2);
-
- gauge.Scales.Add(scale);
-
- this.Content = gauge;
+SfCircularGauge gauge = new SfCircularGauge();
+CircularScale scale = new CircularScale();
+scale.Radius = 200;
+scale.StartAngle = 160;
+scale.SweepAngle = 270;
+scale.StartValue = 0;
+scale.EndValue = 15;
+scale.RangePointerOffset = 0.2;
+scale.SymbolPointerOffset = 0.5;
+
+CircularPointer rangePointer = new CircularPointer();
+rangePointer.PointerType = PointerType.RangePointer;
+rangePointer.RangeStart = 1.5;
+rangePointer.RangePointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x06, 0x82, 0xF6));
+rangePointer.Value = 13;
+rangePointer.RangeCap = RangeCap.End;
+rangePointer.RangePointerStrokeThickness = 30;
+scale.Pointers.Add(rangePointer);
+gauge.HeaderAlignment = HeaderAlignment.Custom;
+gauge.GaugeHeaderPosition = new Point(0.48, 0.48);
+TextBlock textBlock = new TextBlock();
+textBlock.Text = "13M";
+textBlock.Height = 40;
+textBlock.Width = 120;
+textBlock.FontSize = 20;
+textBlock.FontStyle = Windows.UI.Text.FontStyle.Normal;
+textBlock.Foreground = new SolidColorBrush(Color.FromArgb(0xff, 0x06, 0x82, 0xF6));
+gauge.GaugeHeader = textBlock;
+
+CircularPointer pointer1 = new CircularPointer();
+pointer1.PointerType = PointerType.SymbolPointer;
+var content = "";
+content += "";
+content += "";
+content += "";
+content += "";
+content += "" + "" + "";
+content += "";
+pointer1.SymbolPointerTemplate = (DataTemplate)XamlReader.Load(content);
+pointer1.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.Custom;
+pointer1.SymbolPointerWidth = 60;
+pointer1.SymbolPointerHeight = 60;
+pointer1.Value = 0;
+scale.Pointers.Add(pointer1);
+
+CircularPointer pointer2 = new CircularPointer();
+pointer2.PointerType = PointerType.SymbolPointer;
+pointer2.Symbol = Syncfusion.UI.Xaml.Gauges.Symbol.Ellipse;
+pointer2.SymbolPointerWidth = 30;
+pointer2.SymbolPointerHeight = 30;
+pointer2.SymbolPointerBorderBrush = new SolidColorBrush(Color.FromArgb(0xff, 0x9e, 0x9e, 0x9e));
+pointer2.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x9e, 0x9e, 0x9e));
+pointer2.Value = 13;
+scale.Pointers.Add(pointer2);
+gauge.Scales.Add(scale);
+this.Content = gauge;
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/Range-Selector/Customization.md b/chart-sdk/uwp/Range-Selector/Customization.md
index 07bcd0ceb..a3075daec 100644
--- a/chart-sdk/uwp/Range-Selector/Customization.md
+++ b/chart-sdk/uwp/Range-Selector/Customization.md
@@ -1,12 +1,12 @@
---
layout: post
-title: Customization in UWP Range Selector control | Syncfusion
-description: Learn here all about Customization support in Syncfusion UWP Range Selector (SfDateTimeRangeNavigator) control and more.
+title: Customization in UWP Range Selector | Syncfusion®
+description: Customization in the UWP Range Selector enables modification of visual elements, selection appearance, labels, and navigation settings.
platform: chart-sdk
control: SfDateTimeRangeNavigator
documentation: ug
---
-# Customization in UWP Range Selector (SfDateTimeRangeNavigator)
+# Customization in UWP Range Selector
## Higher level bar customization
diff --git a/chart-sdk/uwp/Range-Selector/Getting-Started.md b/chart-sdk/uwp/Range-Selector/Getting-Started.md
index 4ab4421e3..e1ca35563 100644
--- a/chart-sdk/uwp/Range-Selector/Getting-Started.md
+++ b/chart-sdk/uwp/Range-Selector/Getting-Started.md
@@ -1,12 +1,12 @@
---
layout: post
-title: Getting Started with UWP Range Selector control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP Range Selector (SfDateTimeRangeNavigator) control, its elements and more.
+title: Getting Started with UWP Range Selector | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Range Selector control. Explore setup, configuration, range selection, and customization options.
platform: chart-sdk
control: SfDateTimeRangeNavigator
documentation: ug
---
-# Getting Started with UWP Range Selector (SfDateTimeRangeNavigator)
+# Getting Started with UWP Range Selector
## Visual Structure
diff --git a/chart-sdk/uwp/Range-Selector/Interactivity.md b/chart-sdk/uwp/Range-Selector/Interactivity.md
index 00cba4b27..af5ea8361 100644
--- a/chart-sdk/uwp/Range-Selector/Interactivity.md
+++ b/chart-sdk/uwp/Range-Selector/Interactivity.md
@@ -1,12 +1,12 @@
---
layout: post
-title: Interactivity in UWP Range Selector control | Syncfusion
-description: Learn here all about Interactivity support in Syncfusion UWP Range Selector (SfDateTimeRangeNavigator) control and more.
+title: Interactivity in UWP Range Selector | Syncfusion®
+description: Interactivity in the UWP Range Selector enables user interaction, range selection, navigation, and customization of selection behavior.
platform: chart-sdk
control: SfDateTimeRangeNavigator
documentation: ug
---
-# Interactivity in UWP Range Selector (SfDateTimeRangeNavigator)
+# Interactivity in UWP Range Selector
The SfDateTimeRangeNavigator helps the user to visualize large data in a simplified manner. The timespan of the data is represented in the higher level bar and lower level bar. The default timespan is calculated smartly and provides suitable DateTime format and Interval for the given data. It can hold any type of UI element inside the Navigator.
diff --git a/chart-sdk/uwp/Range-Selector/Overview.md b/chart-sdk/uwp/Range-Selector/Overview.md
index b8c826ccf..31e42184d 100644
--- a/chart-sdk/uwp/Range-Selector/Overview.md
+++ b/chart-sdk/uwp/Range-Selector/Overview.md
@@ -1,12 +1,12 @@
---
layout: post
-title: About UWP Range Selector control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Range Selector (SfDateTimeRangeNavigator) control, its elements and more.
+title: About Syncfusion® UWP Range Selector Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Range Selector control, its features, capabilities, and more details.
platform: chart-sdk
control: SfDateTimeRangeNavigator
documentation: ug
---
-# UWP Range Selector (SfDateTimeRangeNavigator) Overview
+# About Syncfusion® UWP Range Selector Control
The SfDateTimeRangeNavigator is a time-bound data visualization control. Its purpose is to allow scrolling and navigation through large periods of time. The control can be easily combined with other controls such as Chart, DataGrid, etc. to create rich and powerful dashboards.
diff --git a/chart-sdk/uwp/Range-Selector/ToolTip-Support.md b/chart-sdk/uwp/Range-Selector/ToolTip-Support.md
index 3689f065c..fe7cb2685 100644
--- a/chart-sdk/uwp/Range-Selector/ToolTip-Support.md
+++ b/chart-sdk/uwp/Range-Selector/ToolTip-Support.md
@@ -1,12 +1,12 @@
---
layout: post
-title: ToolTip Support in UWP Range Selector control | Syncfusion
-description: Learn here all about ToolTip support in Syncfusion UWP Range Selector (SfDateTimeRangeNavigator) control and more.
+title: Tooltip Support in UWP Range Selector | Syncfusion®
+description: Tooltip support in the UWP Range Selector displays additional information for selected ranges and supports customization of tooltip content.
platform: chart-sdk
control: SfDateTimeRangeNavigator
documentation: ug
---
-# ToolTip Support in UWP Range Selector (SfDateTimeRangeNavigator)
+# Tooltip Support in UWP Range Selector
The DateTimeRangeNavigator control provides ToolTip support for sliders. Sliders are used to select a particular region of data in the DateTimeRangeNavigator control. ToolTips for sliders show the selected start and end date time values. You can even view exact date values to the precision of milliseconds.
diff --git a/chart-sdk/uwp/Sparkline/Customize-segment-brush.md b/chart-sdk/uwp/Sparkline/Customize-segment-brush.md
index 4c93f332a..82bd715bf 100644
--- a/chart-sdk/uwp/Sparkline/Customize-segment-brush.md
+++ b/chart-sdk/uwp/Sparkline/Customize-segment-brush.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Customize segment brush in UWP Sparkline control | Syncfusion
-description: Learn here all about Customize segment brush support in Syncfusion UWP Sparkline (SfSparkline) control and more.
+title: Customize segment brush in UWP Sparkline | Syncfusion®
+description: Customize segment brush in the UWP Sparkline to apply different colors to data segments and improve visual distinction of trends.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Customize segment brush in UWP Sparkline (SfSparkline)
+# Customize segment brush in UWP Sparkline
We can customize the first, last, negative, high, and low point brushes of column sparkline like markers in area and line sparkline.
diff --git a/chart-sdk/uwp/Sparkline/Getting-started.md b/chart-sdk/uwp/Sparkline/Getting-started.md
index ee031cdcf..147e32037 100644
--- a/chart-sdk/uwp/Sparkline/Getting-started.md
+++ b/chart-sdk/uwp/Sparkline/Getting-started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting Started with UWP Sparkline control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP Sparkline (SfSparkline) control, its elements and more.
+title: Getting Started with UWP Sparkline control | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Sparkline control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Getting Started with UWP Sparkline (SfSparkline)
+# Getting Started with UWP Sparkline
The following section helps you to build your application with SfSparkline.
diff --git a/chart-sdk/uwp/Sparkline/Highlight-Segment.md b/chart-sdk/uwp/Sparkline/Highlight-Segment.md
index ec07af9e0..da95cee9d 100644
--- a/chart-sdk/uwp/Sparkline/Highlight-Segment.md
+++ b/chart-sdk/uwp/Sparkline/Highlight-Segment.md
@@ -1,12 +1,12 @@
---
layout: post
-title: Highlight segment in UWP Sparkline control | Syncfusion
-description: Learn here all about Highlight segment support in Syncfusion UWP Sparkline (SfSparkline) control and more.
+title: Highlight Segment in UWP Sparkline | Syncfusion®
+description: Highlight segment in the UWP Sparkline emphasizes specific data points or ranges with distinct styling for improved data visibility.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Highlight segment in UWP Sparkline (SfSparkline)
+# Highlight Segment in UWP Sparkline
This feature enables highlighting the column segments on mouse move and this is applicable for column and win-loss sparklines.
diff --git a/chart-sdk/uwp/Sparkline/How-To/Add-labels-for-track-ball.md b/chart-sdk/uwp/Sparkline/How-To/Add-labels-for-track-ball.md
index 4c2af45da..6ba0720ba 100644
--- a/chart-sdk/uwp/Sparkline/How-To/Add-labels-for-track-ball.md
+++ b/chart-sdk/uwp/Sparkline/How-To/Add-labels-for-track-ball.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Add labels for track ball
-description: Add labels for track ball
+title: How to add labels for track ball in UWP Sparkline | Syncfusion®
+description: Add labels for the track ball in the UWP Sparkline to display data values and customize label appearance during data interaction.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Add labels for track ball
+# How to add labels for track ball in UWP Sparkline
We can add labels for the track ball to show the corresponding values. In order to add labels for the trackball, you need to subscribe to the OnSparklineMouseMove event and you can get the following data from the event argument.
diff --git a/chart-sdk/uwp/Sparkline/How-To/Customize-the-marker-for-specific-data-point.md b/chart-sdk/uwp/Sparkline/How-To/Customize-the-marker-for-specific-data-point.md
index 03030053d..e16bc9345 100644
--- a/chart-sdk/uwp/Sparkline/How-To/Customize-the-marker-for-specific-data-point.md
+++ b/chart-sdk/uwp/Sparkline/How-To/Customize-the-marker-for-specific-data-point.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Customize the marker for specific data point
-description: Customize the marker for specific data point
+title: How to customize a data point marker in UWP Sparkline | Syncfusion®
+description: Customize a data point marker in the UWP Sparkline to apply distinct styles and improve the visibility of specific data points.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Customize the marker for specific data point
+# How to customize a data point marker in UWP Sparkline
We can customize the marker for a specific data point with a custom template for LineSparkline and AreaSparkline. In order to customize the marker, we need to inherit the [`MarkerTemplateSelector`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.MarkerTemplateSelector.html) class and override the SelectTemplate method.
diff --git a/chart-sdk/uwp/Sparkline/Marker-Customization.md b/chart-sdk/uwp/Sparkline/Marker-Customization.md
index f3b815e21..9c9680ccc 100644
--- a/chart-sdk/uwp/Sparkline/Marker-Customization.md
+++ b/chart-sdk/uwp/Sparkline/Marker-Customization.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Marker customization in UWP Sparkline control | Syncfusion
-description: Learn here all about Marker customization support in Syncfusion UWP Sparkline (SfSparkline) control and more.
+title: Marker Customization in UWP Sparkline | Syncfusion®
+description: Marker customization in the UWP Sparkline allows you to modify marker appearance, styles, colors, and sizes for better data visualization.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Marker customization in UWP Sparkline (SfSparkline)
+# Marker Customization in UWP Sparkline
We can customize the markers by initializing the marker template selector class, and we can differentiate the first, last, high, low, negative points.
diff --git a/chart-sdk/uwp/Sparkline/Markers.md b/chart-sdk/uwp/Sparkline/Markers.md
index 3adf53c19..2672592e5 100644
--- a/chart-sdk/uwp/Sparkline/Markers.md
+++ b/chart-sdk/uwp/Sparkline/Markers.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Markers in UWP Sparkline control | Syncfusion
-description: Learn here all about Markers support in Syncfusion Universal Windows Sparkline (SfSparkline) control and more.
+title: Markers in UWP Sparkline | Syncfusion®
+description: Markers in the UWP Sparkline highlight specific data points, making trends, values, and key points easier to identify and analyze.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Markers in UWP Sparkline (SfSparkline)
+# Markers in UWP Sparkline
Markers are used to indicate the value point for line and area series, and we can customize with different templates. It is applicable for LineSparkline and AreaSparkline.
diff --git a/chart-sdk/uwp/Sparkline/Overview.md b/chart-sdk/uwp/Sparkline/Overview.md
index 8ab3583c1..786476c5e 100644
--- a/chart-sdk/uwp/Sparkline/Overview.md
+++ b/chart-sdk/uwp/Sparkline/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About UWP Sparkline control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Sparkline (SfSparkline) control, its elements and more.
+title: About Syncfusion® UWP Sparkline control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Sparkline control, its features, capabilities, and more details.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# UWP Sparkline (SfSparkline) Overview
+# About Syncfusion UWP Sparkline control
A sparkline is a very small chart, typically drawn without axes or coordinates. It presents the general shape of data in a simple and highly condensed way.
diff --git a/chart-sdk/uwp/Sparkline/Range-Band.md b/chart-sdk/uwp/Sparkline/Range-Band.md
index 80cb9dcd1..2d470d55e 100644
--- a/chart-sdk/uwp/Sparkline/Range-Band.md
+++ b/chart-sdk/uwp/Sparkline/Range-Band.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Range Band in UWP Sparkline control | Syncfusion
-description: Learn here all about Range Band support in Syncfusion UWP Sparkline (SfSparkline) control and more.
+title: Range Band in UWP Sparkline | Syncfusion®
+description: Range band in the UWP Sparkline highlights a specified value range, helping emphasize thresholds, targets, and data variations.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Range Band in UWP Sparkline (SfSparkline)
+# Range Band in UWP Sparkline
The range band feature is used to highlight the particular mentioned range along the Y axis.
diff --git a/chart-sdk/uwp/Sparkline/ShowHide-Axis.md b/chart-sdk/uwp/Sparkline/ShowHide-Axis.md
index 37373cf1e..124f727da 100644
--- a/chart-sdk/uwp/Sparkline/ShowHide-Axis.md
+++ b/chart-sdk/uwp/Sparkline/ShowHide-Axis.md
@@ -1,13 +1,13 @@
---
layout: post
-title: ShowHide Axis in UWP Sparkline control | Syncfusion
-description: Learn here all about ShowHide Axis support in Syncfusion UWP Sparkline (SfSparkline) control and more.
+title: Show and Hide Axis in UWP Sparkline | Syncfusion®
+description: Show and hide the axis in the UWP Sparkline to control axis visibility and customize the chart appearance based on data requirements.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# ShowHide Axis in UWP Sparkline (SfSparkline)
+# Show and Hide Axis in UWP Sparkline
ShowAxis is used to enable the axis and this feature is applicable for all the sparklines except WinLoss sparkline. Also, you can style the axis by the AxisStyle property and position the axis by the AxisOrigin property.
diff --git a/chart-sdk/uwp/Sparkline/Sparkline-Types.md b/chart-sdk/uwp/Sparkline/Sparkline-Types.md
index c10ec1522..be3a4a215 100644
--- a/chart-sdk/uwp/Sparkline/Sparkline-Types.md
+++ b/chart-sdk/uwp/Sparkline/Sparkline-Types.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Sparkline Types in UWP Sparkline control | Syncfusion
-description: Learn here all about Sparkline Types support in Syncfusion UWP Sparkline (SfSparkline) control and more.
+title: Sparkline Types in UWP Sparkline | Syncfusion®
+description: Sparkline types in the UWP Sparkline provide multiple visualization options to represent trends, variations, and data patterns effectively.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Sparkline Types in UWP Sparkline (SfSparkline)
+# Sparkline Types in UWP Sparkline
## Line Sparkline
diff --git a/chart-sdk/uwp/Sparkline/Track-ball.md b/chart-sdk/uwp/Sparkline/Track-ball.md
index 35bc1df50..8ed93b4f7 100644
--- a/chart-sdk/uwp/Sparkline/Track-ball.md
+++ b/chart-sdk/uwp/Sparkline/Track-ball.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Track ball in UWP Sparkline control | Syncfusion
-description: Learn here all about Track ball support in Syncfusion UWP Sparkline (SfSparkline) control and more.
+title: Trackball in UWP Sparkline | Syncfusion®
+description: Trackball in the UWP Sparkline displays data values at specific points, enabling precise inspection and analysis of chart data.
platform: chart-sdk
control: SfSparkline
documentation: ug
---
-# Track ball in UWP Sparkline (SfSparkline)
+# Trackball in UWP Sparkline
This is used to indicate the value point on mouse move and this feature is applicable for line and area sparklines.
diff --git a/chart-sdk/uwp/bullet-graph/Caption.md b/chart-sdk/uwp/bullet-graph/Caption.md
index c79983bf0..79b1e173d 100644
--- a/chart-sdk/uwp/bullet-graph/Caption.md
+++ b/chart-sdk/uwp/bullet-graph/Caption.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Caption in UWP Bullet Graph control | Syncfusion
-description: Learn here all about Caption support in Syncfusion UWP Bullet Graph (SfBulletGraph) control and more.
+title: Caption in UWP Bullet Graph | Syncfusion®
+description: Caption in the UWP Bullet Graph displays descriptive text for the graph, helping users understand displayed metrics and data context.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Caption in UWP Bullet Graph (SfBulletGraph)
+# Caption in UWP Bullet Graph
The [`Caption`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.BulletGraph.SfBulletGraph.html#Syncfusion_UI_Xaml_BulletGraph_SfBulletGraph_Caption) for a bullet graph is used to specify a unique label describing the value represented in the bullet graph.
diff --git a/chart-sdk/uwp/bullet-graph/Flow-Direction.md b/chart-sdk/uwp/bullet-graph/Flow-Direction.md
index 26b7f4fa6..1b4a758a4 100644
--- a/chart-sdk/uwp/bullet-graph/Flow-Direction.md
+++ b/chart-sdk/uwp/bullet-graph/Flow-Direction.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Flow Direction in UWP Bullet Graph control | Syncfusion
-description: Learn here all about Flow Direction support in Syncfusion UWP Bullet Graph (SfBulletGraph) control and more.
+title: Flow Direction in UWP Bullet Graph | Syncfusion®
+description: Flow direction in the UWP Bullet Graph controls the layout orientation, enabling content to be displayed from left to right or right to left.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Flow Direction in UWP Bullet Graph (SfBulletGraph)
+# Flow Direction in UWP Bullet Graph
By default the flow direction of SfBulletGraph is forward (LTR). It can be customized by using the **FlowDirection** property respectively.
diff --git a/chart-sdk/uwp/bullet-graph/Getting-Started.md b/chart-sdk/uwp/bullet-graph/Getting-Started.md
index 4d60fe408..acc1ff7f8 100644
--- a/chart-sdk/uwp/bullet-graph/Getting-Started.md
+++ b/chart-sdk/uwp/bullet-graph/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting Started with UWP Bullet Graph control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP Bullet Graph (SfBulletGraph) control, its elements and more.
+title: Getting Started with UWP Bullet Graph | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Bullet Graph control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Getting Started with UWP Bullet Graph (SfBulletGraph)
+# Getting Started with UWP Bullet Graph
This section explains you the steps required to configure the [`SfBulletGraph`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.BulletGraph.SfBulletGraph.html) and also explains the steps to add basic elements of **SfBulletGraph** through various API’s available within it.
diff --git a/chart-sdk/uwp/bullet-graph/Key-features.md b/chart-sdk/uwp/bullet-graph/Key-features.md
index 0a0b4a350..8f60f6d1e 100644
--- a/chart-sdk/uwp/bullet-graph/Key-features.md
+++ b/chart-sdk/uwp/bullet-graph/Key-features.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Key Features in UWP Bullet Graph control | Syncfusion
-description: Learn here all about Key Features support in Syncfusion UWP Bullet Graph (SfBulletGraph) control and more.
+title: Key Features in UWP Bullet Graph | Syncfusion®
+description: Key features in the UWP Bullet Graph include comparative measurement, target indicators, qualitative ranges, and customizable visualization.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Key Features in UWP Bullet Graph (SfBulletGraph)
+# Key Features in UWP Bullet Graph
**SfBulletGraph** is a composite UI element with the following sub-parts:
diff --git a/chart-sdk/uwp/bullet-graph/Labels.md b/chart-sdk/uwp/bullet-graph/Labels.md
index eddf21452..92c0205c4 100644
--- a/chart-sdk/uwp/bullet-graph/Labels.md
+++ b/chart-sdk/uwp/bullet-graph/Labels.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Labels in UWP Bullet Graph control | Syncfusion
-description: Learn here all about Labels support in Syncfusion UWP Bullet Graph (SfBulletGraph) control and more.
+title: Label Customization in UWP Bullet Graph | Syncfusion®
+description: Learn Label Customization in UWP Bullet Graph using Syncfusion controls. It supports data operations, UI customization, and enterprise features.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Labels in UWP Bullet Graph (SfBulletGraph)
+# Label Customization in UWP Bullet Graph
A quantitative scale label specifies the numeric value according to the major ticks in the range of the scale.
diff --git a/chart-sdk/uwp/bullet-graph/Measures.md b/chart-sdk/uwp/bullet-graph/Measures.md
index a019ca821..5703da3b5 100644
--- a/chart-sdk/uwp/bullet-graph/Measures.md
+++ b/chart-sdk/uwp/bullet-graph/Measures.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Measures in UWP Bullet Graph control | Syncfusion
-description: Learn here all about Measures support in Syncfusion UWP Bullet Graph (SfBulletGraph) control and more.
+title: Measures in UWP Bullet Graph | Syncfusion®
+description: Measures in the UWP Bullet Graph display actual values against targets, enabling performance comparison and progress evaluation.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Measures in UWP Bullet Graph (SfBulletGraph)
+# Measures in UWP Bullet Graph
## Featured measure
diff --git a/chart-sdk/uwp/bullet-graph/Orientation.md b/chart-sdk/uwp/bullet-graph/Orientation.md
index 46ceb9648..21c514da1 100644
--- a/chart-sdk/uwp/bullet-graph/Orientation.md
+++ b/chart-sdk/uwp/bullet-graph/Orientation.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Orientation in UWP Bullet Graph control | Syncfusion
-description: Learn here all about Orientation support in Syncfusion UWP Bullet Graph (SfBulletGraph) control and more.
+title: Orientation in UWP Bullet Graph | Syncfusion®
+description: Orientation in the UWP Bullet Graph allows you to display the graph in horizontal or vertical layouts based on application requirements.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Orientation in UWP Bullet Graph (SfBulletGraph)
+# Orientation in UWP Bullet Graph
By default, the orientation of SfBulletGraph is horizontal. It can be customized by using the [`Orientation`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.BulletGraph.SfBulletGraph.html#Syncfusion_UI_Xaml_BulletGraph_SfBulletGraph_Orientation) property respectively.
diff --git a/chart-sdk/uwp/bullet-graph/Overview.md b/chart-sdk/uwp/bullet-graph/Overview.md
index 87c2dda64..d892ead32 100644
--- a/chart-sdk/uwp/bullet-graph/Overview.md
+++ b/chart-sdk/uwp/bullet-graph/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About UWP Bullet Graph control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Bullet Graph (SfBulletGraph) control, its elements and more.
+title: About Syncfusion® UWP Bullet Graph Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Bullet Graph control, its features, capabilities, and more details.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# UWP Bullet Graph (SfBulletGraph) Overview
+# About Syncfusion® UWP Bullet Graph Control
Bullet Graph is a variation of the bar graph, which is developed as a replacement for the dashboard gauges and meters. The bullet graph features a single, primary measure (for example, current year-to-date revenue), and compares that measure to one or more other measures to enrich its meaning (for example, compared to a target). It displays the measures in the context of the qualitative range of performance, such as poor, satisfactory, and good.
diff --git a/chart-sdk/uwp/bullet-graph/Quantitative-scale.md b/chart-sdk/uwp/bullet-graph/Quantitative-scale.md
index f7b150b25..ac96eefec 100644
--- a/chart-sdk/uwp/bullet-graph/Quantitative-scale.md
+++ b/chart-sdk/uwp/bullet-graph/Quantitative-scale.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Quantitative Scale in UWP Bullet Graph control | Syncfusion
-description: Learn here all about Quantitative Scale support in Syncfusion UWP Bullet Graph (SfBulletGraph) control and more.
+title: Quantitative Scale in UWP Bullet Graph | Syncfusion®
+description: Quantitative scale in the UWP Bullet Graph defines value ranges, intervals, and targets, enabling accurate performance measurement and comparison.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Quantitative Scale in UWP Bullet Graph (SfBulletGraph)
+# Quantitative Scale in UWP Bullet Graph
Quantitative scale contains two major components such as ticks and labels, which give the look of a bar graph. It defines the frequency of labels and tick marks with overall Minimum and Maximum values for the declared Interval. The length of the quantitative scale can be customized by using the [`QuantitativeScaleLength`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.BulletGraph.SfBulletGraph.html#Syncfusion_UI_Xaml_BulletGraph_SfBulletGraph_QuantitativeScaleLength) property.
diff --git a/chart-sdk/uwp/bullet-graph/Ranges.md b/chart-sdk/uwp/bullet-graph/Ranges.md
index b3ab134af..96694982c 100644
--- a/chart-sdk/uwp/bullet-graph/Ranges.md
+++ b/chart-sdk/uwp/bullet-graph/Ranges.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Ranges in UWP Bullet Graph control | Syncfusion
-description: Learn here all about Ranges support in Syncfusion UWP Bullet Graph (SfBulletGraph) control and more.
+title: Ranges in UWP Bullet Graph | Syncfusion®
+description: Ranges in the UWP Bullet Graph highlight specific value intervals, helping visualize performance levels, thresholds, and target comparisons.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Ranges in UWP Bullet Graph (SfBulletGraph)
+# Ranges in UWP Bullet Graph
Ranges for a bullet graph are a collection of qualitative ranges. A qualitative range is a visual element which ends at a specified [`RangeEnd`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.BulletGraph.Range.html#Syncfusion_UI_Xaml_BulletGraph_Range_RangeEnd) at the start of the previous range's RangeEnd. The qualitative ranges are arranged according to each RangeEnd value.
diff --git a/chart-sdk/uwp/bullet-graph/Ticks.md b/chart-sdk/uwp/bullet-graph/Ticks.md
index da8ae1416..626835e13 100644
--- a/chart-sdk/uwp/bullet-graph/Ticks.md
+++ b/chart-sdk/uwp/bullet-graph/Ticks.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Ticks in UWP Bullet Graph control | Syncfusion
-description: Learn about ticks support in Syncfusion UWP Bullet Graph (SfBulletGraph), including customization options and usage details.
+title: Ticks in UWP Bullet Graph | Syncfusion®
+description: Ticks in the UWP Bullet Graph indicate scale intervals and support customization of size, position, style, and appearance settings.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Ticks in UWP Bullet Graph (SfBulletGraph)
+# Ticks in UWP Bullet Graph
Quantitative scale is displayed with two types of ticks:
diff --git a/chart-sdk/uwp/bullet-graph/Tooltip.md b/chart-sdk/uwp/bullet-graph/Tooltip.md
index ed7446f65..70bfa6811 100644
--- a/chart-sdk/uwp/bullet-graph/Tooltip.md
+++ b/chart-sdk/uwp/bullet-graph/Tooltip.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Tooltip in UWP Bullet Graph control | Syncfusion
-description: Learn here all about Tooltip support in Syncfusion UWP Bullet Graph (SfBulletGraph) control and more.
+title: Tooltip in UWP Bullet Graph | Syncfusion®
+description: Tooltip in the UWP Bullet Graph displays detailed information about values and targets on hover, enabling better data analysis.
platform: chart-sdk
control: SfBulletGraph
documentation: ug
---
-# Tooltip in UWP Bullet Graph (SfBulletGraph)
+# Tooltip in UWP Bullet Graph
Tooltip in SfBulletGraph is used to view the values of FeaturedMeasure, ComparativeMeasure, and QualitativeRange in a required design.
diff --git a/chart-sdk/uwp/charts/Adornments.md b/chart-sdk/uwp/charts/Adornments.md
index dc652e83f..e192b9ac2 100644
--- a/chart-sdk/uwp/charts/Adornments.md
+++ b/chart-sdk/uwp/charts/Adornments.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Adornments in UWP Charts control | Syncfusion
-description: Learn here all about Adornments support in Syncfusion® UWP Charts (SfChart) control, its elements, features, and more.
+title: Adornments in UWP Chart | Syncfusion®
+description: Adornments in the UWP Chart display additional information for data points and support customization of labels, symbols, and appearance.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Adornments in UWP Charts (SfChart)
+# Adornments in UWP Chart
Chart adornments are used to display values related to a chart segment element. Values from data point(x, y) or other custom properties from a data source can be displayed.
diff --git a/chart-sdk/uwp/charts/Animation.md b/chart-sdk/uwp/charts/Animation.md
index 2de59999d..1c1756b61 100644
--- a/chart-sdk/uwp/charts/Animation.md
+++ b/chart-sdk/uwp/charts/Animation.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Animation in UWP Charts control | Syncfusion
-description: Learn everything about Animation support in Syncfusion® UWP Charts (SfChart) control and explore additional features.
+title: Animation in UWP Chart | Syncfusion®
+description: Animation in the UWP Chart enables smooth transitions for chart series and data points, enhancing data visualization and user experience.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Animation in UWP Charts (SfChart)
+# Animation in UWP Chart
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) Animation allows you to animate the chart series on loading, and whenever the ItemsSource changes. Animation in chart can be enabled by setting the [`EnableAnimation`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_EnableAnimation) property to true and defining the corresponding animation speed with [`AnimationDuration`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_AnimationDuration) property.
diff --git a/chart-sdk/uwp/charts/Annotations.md b/chart-sdk/uwp/charts/Annotations.md
index 4f62216b0..e90a2623d 100644
--- a/chart-sdk/uwp/charts/Annotations.md
+++ b/chart-sdk/uwp/charts/Annotations.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Annotations in UWP Charts control | Syncfusion
-description: Learn here about how to add proper Annotations support in the chart area of Syncfusion® UWP Charts(SfChart) control and more.
+title: Annotations in UWP Chart | Syncfusion®
+description: Annotations in the UWP Chart display custom content within the chart area and support flexible positioning for enhanced data visualization.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Annotations in UWP Charts (SfChart)
+# Annotations in UWP Chart
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) supports [`Annotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html#Syncfusion_UI_Xaml_Charts_SfChart_Annotations), which allows you to mark the specific area of interest in the chart area. You can draw custom shapes, also text and images can be added using [`Annotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html#Syncfusion_UI_Xaml_Charts_SfChart_Annotations).
diff --git a/chart-sdk/uwp/charts/Area.md b/chart-sdk/uwp/charts/Area.md
index 1077f28ed..b7208f492 100644
--- a/chart-sdk/uwp/charts/Area.md
+++ b/chart-sdk/uwp/charts/Area.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Area in UWP Charts control | Syncfusion
-description: Learn here all about Area support in Syncfusion® Universal Windows Platform (UWP) Charts (SfChart) control and more.
+title: Area in UWP Chart | Syncfusion®
+description: Area in the UWP Chart displays data as filled regions between data points and the axis, emphasizing trends and value magnitude.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Area in UWP Charts (SfChart)
+# Chart area in UWP Chart
Chart area represents the entire chart and all its elements. It’s a virtual rectangular area that includes all the chart elements like axis, legends, series etc.
diff --git a/chart-sdk/uwp/charts/Axis.md b/chart-sdk/uwp/charts/Axis.md
index d050bf2e0..90eb2006b 100644
--- a/chart-sdk/uwp/charts/Axis.md
+++ b/chart-sdk/uwp/charts/Axis.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Axis in UWP Charts control | Syncfusion
-description: Learn here all about Axis support in Syncfusion® Universal Windows Platform (UWP) Charts (SfChart) control and more.
+title: Axis types and customization in UWP Chart | Syncfusion®
+description: Chart axis in the UWP Chart defines data scales, categories, and value ranges, supporting accurate data visualization and analysis.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Axis in UWP Charts (SfChart)
+# Axis types and customization in UWP Chart
[`ChartAxis`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartAxis.html) is used to locate a data point inside the chart area. Generally, to locate a data point, you require two axes along each direction, that is, horizontal and vertical, in a chart. The vertical axis, or y-axis, usually represents numerical values. The horizontal axis, or x-axis, represents categorical or numerical or date and time values. [`ChartAxis`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartAxis.html) supports the following types.
@@ -2505,7 +2505,7 @@ chart.SecondaryAxis = secondaryAxis;
## Multi-level labels
-[`Axis`](https://help.syncfusion.com/uwp/charts/axis) can be customized with multiple levels of label by using its [`MultiLevelLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartAxisBase2D.html#Syncfusion_UI_Xaml_Charts_ChartAxisBase2D_MultiLevelLabels) property. These labels are placed based on the provided [`Start`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartMultiLevelLabel.html#Syncfusion_UI_Xaml_Charts_ChartMultiLevelLabel_Start) and [`End`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartMultiLevelLabel.html#Syncfusion_UI_Xaml_Charts_ChartMultiLevelLabel_End) range values and we can add any number of labels to an axis. The below code snippet shows how to set a multilevel label,
+[`Axis`](https://help.syncfusion.com/chart-sdk/uwp/charts/axis) can be customized with multiple levels of label by using its [`MultiLevelLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartAxisBase2D.html#Syncfusion_UI_Xaml_Charts_ChartAxisBase2D_MultiLevelLabels) property. These labels are placed based on the provided [`Start`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartMultiLevelLabel.html#Syncfusion_UI_Xaml_Charts_ChartMultiLevelLabel_Start) and [`End`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartMultiLevelLabel.html#Syncfusion_UI_Xaml_Charts_ChartMultiLevelLabel_End) range values and we can add any number of labels to an axis. The below code snippet shows how to set a multilevel label,
{% tabs %}
diff --git a/chart-sdk/uwp/charts/DataBinding.md b/chart-sdk/uwp/charts/DataBinding.md
index 470372be1..86e1ccafa 100644
--- a/chart-sdk/uwp/charts/DataBinding.md
+++ b/chart-sdk/uwp/charts/DataBinding.md
@@ -1,17 +1,17 @@
---
layout: post
-title: DataBinding in UWP Charts control | Syncfusion
-description: Learn all about DataBinding support in Syncfusion® UWP Charts (SfChart) control, its functionality, and more
+title: Data Binding in UWP Charts | Syncfusion®
+description: Data binding in the UWP Chart connects chart series to data sources, enabling dynamic visualization and automatic data updates.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# DataBinding in UWP Charts (SfChart)
+# Data Binding in UWP Charts
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) offers [`ItemsSource`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_ItemsSource) property to bind various datasource ranges from simple collection property to complex properties.
-### Binding a simple collection to the chart
+## Binding a simple collection to the chart
{% tabs %}
@@ -80,7 +80,7 @@ public sealed partial class MainPage : Page
{% endtabs %}
-### Binding complex property to the chart
+## Binding complex property to the chart
The complex property binding feature enables you to access nested object reference property values to render the chart segment.
{% tabs %}
@@ -130,7 +130,7 @@ public class DataPointWithMultipleData
{% endtabs %}
-### Binding array property to the chart
+## Binding array property to the chart
The [`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) supports array values for the [`XBindingPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_XBindingPath) and [`YBindingPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.XYDataSeries.html#Syncfusion_UI_Xaml_Charts_XyDataSeries_YBindingPath). [`XBindingPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_XBindingPath) and [`YBindingPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.XYDataSeries.html#Syncfusion_UI_Xaml_Charts_XyDataSeries_YBindingPath) are bound with the property name in the corresponding index value. You can bind the same property with different index values.
@@ -221,7 +221,7 @@ private void CreateChart()
{% endtabs %}
-### Listening property changes
+## Listening property changes
You can notify the [`XBindingPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_XBindingPath) and [`YBindingPath`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.XYDataSeries.html#Syncfusion_UI_Xaml_Charts_XyDataSeries_YBindingPath) properties changes by setting [`ListenPropertyChange`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_ListenPropertyChange) as true as shown in the below code snippet.
diff --git a/chart-sdk/uwp/charts/EmptyPoints.md b/chart-sdk/uwp/charts/EmptyPoints.md
index 8f315c089..f09ed3e44 100644
--- a/chart-sdk/uwp/charts/EmptyPoints.md
+++ b/chart-sdk/uwp/charts/EmptyPoints.md
@@ -1,13 +1,13 @@
---
layout: post
-title: EmptyPoints in UWP Charts control | Syncfusion
-description: Learn here about how to add proper EmptyPoints support were data point has NaN or null values in Syncfusion® UWP Charts(SfChart).
+title: Empty Points in UWP Charts | Syncfusion®
+description: Empty points in the UWP Chart handle missing data values by skipping, displaying, or interpolating points within a series.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# EmptyPoints in UWP Charts (SfChart)
+# Empty Points in UWP Charts
The data collection that is passed to the chart can have NaN or Null values that are considered as empty points. The empty point can be defined as in the below code example.
diff --git a/chart-sdk/uwp/charts/ErrorBar.md b/chart-sdk/uwp/charts/ErrorBar.md
index 31520b2a4..e0a555389 100644
--- a/chart-sdk/uwp/charts/ErrorBar.md
+++ b/chart-sdk/uwp/charts/ErrorBar.md
@@ -1,13 +1,13 @@
---
layout: post
-title: ErrorBar in UWP Charts control | Syncfusion
-description: Learn here about how to add proper ErrorBar support to indicate error in reported values of Syncfusion® UWP Charts(SfChart) control.
+title: ErrorBar Chart in UWP Charts | Syncfusion®
+description: Error bars in the UWP Chart represent data variability and uncertainty, helping users analyze ranges, deviations, and accuracy.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# ErrorBar in UWP Charts (SfChart)
+# ErrorBar in UWP Charts
[`ErrorBarSeries`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ErrorBarSeries.html) is used to indicate the errors or uncertainty in reported values. This will find the possible variations in measurements, and in Chart control these values are displayed as data points.
diff --git a/chart-sdk/uwp/charts/Exporting.md b/chart-sdk/uwp/charts/Exporting.md
index 5a4e5de57..902edaee2 100644
--- a/chart-sdk/uwp/charts/Exporting.md
+++ b/chart-sdk/uwp/charts/Exporting.md
@@ -1,12 +1,12 @@
---
layout: post
-title: Exporting in UWP Charts control | Syncfusion
-description: Learn everything about Exporting support in Syncfusion® UWP Charts (SfChart) control and explore additional features.
+title: Exporting in UWP Charts | Syncfusion®
+description: Exporting in the UWP Chart enables chart data and visuals to be saved in supported formats for sharing, printing, and reporting.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Exporting in UWP Charts (SfChart)
+# Exporting in UWP Charts
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) can be exported into the following types of image formats:
diff --git a/chart-sdk/uwp/charts/Getting-Started.md b/chart-sdk/uwp/charts/Getting-Started.md
index 045e6754e..a8326183b 100644
--- a/chart-sdk/uwp/charts/Getting-Started.md
+++ b/chart-sdk/uwp/charts/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting Started with UWP Charts control | Syncfusion
-description: Learn here about getting started with Syncfusion® UWP Charts (SfChart) control, its elements and more.
+title: Getting Started with UWP Charts control | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Charts control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Getting Started with UWP Charts (SfChart)
+# Getting Started with UWP Charts
This section explains the steps required to populate the Chart with data, header, add data labels, legend and tooltips to the Chart. This section covers only the minimal features that you need to know to get started with the Chart.
@@ -307,7 +307,7 @@ chart.Series.Add(series)
{% endtabs %}
-N> Syncfusion® Chart also supports rendering combination of multiple series. Refer [`this`](https://help.syncfusion.com/uwp/charts/area#multiple-area) for details.
+N> Syncfusion® Chart also supports rendering combination of multiple series. Refer [`this`](https://help.syncfusion.com/chart-sdk/uwp/charts/area#multiple-area) for details.
## Add title
@@ -374,7 +374,7 @@ series.AdornmentsInfo = New ChartAdornmentInfo() With {.ShowLabel = True}
{% endtabs %}
-Refer [`this`](https://help.syncfusion.com/uwp/charts/adornments) link to learn more about the options available in [`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) to customize chart adornments.
+Refer [`this`](https://help.syncfusion.com/chart-sdk/uwp/charts/adornments) link to learn more about the options available in [`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) to customize chart adornments.
## Enable legend
@@ -452,7 +452,7 @@ series.Label = "Heights"
{% endtabs %}
-Refer this [`link`](https://help.syncfusion.com/uwp/charts/legend) to learn more about the options available in [`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) to customize legend.
+Refer this [`link`](https://help.syncfusion.com/chart-sdk/uwp/charts/legend) to learn more about the options available in [`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) to customize legend.
## Enable tooltip
@@ -497,7 +497,7 @@ series.ShowTooltip = True
{% endtabs %}
-Refer [`this`](https://help.syncfusion.com/uwp/charts/interactive-features#tooltip) link to learn more about the options available in [`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) to customize tooltip.
+Refer [`this`](https://help.syncfusion.com/chart-sdk/uwp/charts/interactive-features#tooltip) link to learn more about the options available in [`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) to customize tooltip.
The following code example gives you the complete code of the above configurations.
diff --git a/chart-sdk/uwp/charts/How-To/Add-custom-labels-to-track-ball-behavior.md b/chart-sdk/uwp/charts/How-To/Add-custom-labels-to-track-ball-behavior.md
index 2870816e8..2f91773eb 100644
--- a/chart-sdk/uwp/charts/How-To/Add-custom-labels-to-track-ball-behavior.md
+++ b/chart-sdk/uwp/charts/How-To/Add-custom-labels-to-track-ball-behavior.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Add custom labels to track ball behavior | Syncfusion
-description: Learn here about how to add proper custom labels to track ball behavior Syncfusion® UWP Charts(SfChart) control and more.
+title: How to add custom track ball labels in UWP Chart | Syncfusion®
+description: Add custom labels to track ball behavior in the UWP Chart to display customized information for data points during interaction.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Add custom labels to track ball behavior
+# How to add custom labels to track ball behavior in UWP Chart
In the [`ChartTrackBallBehavior`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartTrackBallBehavior.html), each data point will have a label aligned vertically and horizontally using the [`LabelVerticalAlignment`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartTrackBallBehavior.html#Syncfusion_UI_Xaml_Charts_ChartTrackBallBehavior_LabelVerticalAlignment) and [`LabelHorizontalAlignment`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartTrackBallBehavior.html#Syncfusion_UI_Xaml_Charts_ChartTrackBallBehavior_LabelHorizontalAlignment) properties by default. However, you can also add custom labels to the [`ChartTrackBallBehavior`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartTrackBallBehavior.html).
diff --git a/chart-sdk/uwp/charts/How-To/Add-range-of-points-dynamically.md b/chart-sdk/uwp/charts/How-To/Add-range-of-points-dynamically.md
index 3825c62d9..f9aa7f4f1 100644
--- a/chart-sdk/uwp/charts/How-To/Add-range-of-points-dynamically.md
+++ b/chart-sdk/uwp/charts/How-To/Add-range-of-points-dynamically.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Add range of points dynamically | SfChart | Winrt | Syncfusion
-description: Learn how to add a range of points dynamically to the SfChart using SuspendSeriesNotification and ResumeSeriesNotification methods.
+title: How to add range of points dynamically in UWP Chart | Syncfusion®
+description: Add a range of points dynamically in the UWP Chart to update chart data efficiently and reflect changes in real time.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Add range of points dynamically
+# How to add range of points dynamically in UWP Chart
Whenever you add a data point to [`ItemsSource`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_ItemsSource) dynamically, corresponding data will be updated inside chart series synchronously. This operation will be happening for each and every data point that we add subsequently. You can avoid this by calling [`SuspendSeriesNotification`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_SuspendSeriesNotification) method of Chart before adding range of data points and then call [`ResumeSeriesNotification`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_ResumeSeriesNotification) to update all the data points that have been added between these two method calls.
diff --git a/chart-sdk/uwp/charts/How-To/Print-the-SfChart.md b/chart-sdk/uwp/charts/How-To/Print-the-SfChart.md
index 5e026c46e..04ad61cd2 100644
--- a/chart-sdk/uwp/charts/How-To/Print-the-SfChart.md
+++ b/chart-sdk/uwp/charts/How-To/Print-the-SfChart.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Print the SfChart | SfChart | Winrt | Syncfusion
-description: Learn how to print the SfChart control by calling the Print method to render the chart directly from your UWP application.
+title: How to print the chart in UWP Chart | Syncfusion®
+description: Print the UWP Chart to create physical copies of chart visuals for reporting, presentation, and documentation purposes.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Print the SfChart Control
+# How to print the chart in UWP Chart
To print the SfChart, call the Print method.
diff --git a/chart-sdk/uwp/charts/How-To/Transform-axis-value-to-pixel-value-and-vice-versa.md b/chart-sdk/uwp/charts/How-To/Transform-axis-value-to-pixel-value-and-vice-versa.md
index 0af4c2ffe..285914796 100644
--- a/chart-sdk/uwp/charts/How-To/Transform-axis-value-to-pixel-value-and-vice-versa.md
+++ b/chart-sdk/uwp/charts/How-To/Transform-axis-value-to-pixel-value-and-vice-versa.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Transform axis value to pixel value | SfChart | Winrt | Syncfusion
-description: Learn how to transform axis values to pixel values and vice versa in SfChart using ValueToPoint and PointToValue utility methods.
+title: How to transform axis value to pixel in UWP Chart | Syncfusion®
+description: Transform axis values to pixel values and convert pixel values back to axis values in the UWP Chart for coordinate-based interactions.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Transform axis value to pixel value and vice versa
+# How to transform axis value to pixel value in UWP Chart
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) offers two utility methods for converting your data points into pixel values (device coordinates).
diff --git a/chart-sdk/uwp/charts/Interactive-Features.md b/chart-sdk/uwp/charts/Interactive-Features.md
index 98db6f397..23330260b 100644
--- a/chart-sdk/uwp/charts/Interactive-Features.md
+++ b/chart-sdk/uwp/charts/Interactive-Features.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Interactive Features in UWP Charts control | Syncfusion
-description: Learn here all about Interactive Features support in Syncfusion® UWP Charts (SfChart) control and more.
+title: Interactive Features in UWP Charts | Syncfusion®
+description: Interactive features in the UWP Chart enable zooming, panning, selection, tooltips, and navigation for enhanced data exploration.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Interactive Features in UWP Charts (SfChart)
+# Interactive Features in UWP Charts
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) provides interactive features such as zooming, selection, and tracking data points.
diff --git a/chart-sdk/uwp/charts/Legend.md b/chart-sdk/uwp/charts/Legend.md
index 73fb0e740..d13e27d22 100644
--- a/chart-sdk/uwp/charts/Legend.md
+++ b/chart-sdk/uwp/charts/Legend.md
@@ -1,16 +1,16 @@
---
layout: post
-title: Legend in UWP Charts control | Syncfusion
-description: Learn here all about Legend feature of Syncfusion® Universal Windows Platform (UWP) Charts (SfChart) control and more.
+title: Legend in UWP Charts | Syncfusion®
+description: Legend in the UWP Chart identifies series and data categories, helping users understand and interpret chart information clearly.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Legend in UWP Charts (SfChart)
+# Legend in UWP Charts
-[`Legend`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_Legend) provides metadata which helps for identifying elements in chart like [`chart series`](https://help.syncfusion.com/uwp/charts/series),
-[`technical indicators`](https://help.syncfusion.com/uwp/charts/technical-indicators), and [`trendlines`](https://help.syncfusion.com/uwp/charts/trendlines).
+[`Legend`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_Legend) provides metadata which helps for identifying elements in chart like [`chart series`](https://help.syncfusion.com/chart-sdk/uwp/charts/series),
+[`technical indicators`](https://help.syncfusion.com/chart-sdk/uwp/charts/technical-indicators), and [`trendlines`](https://help.syncfusion.com/chart-sdk/uwp/charts/trendlines).
You can define the legend using the following code example.
{% tabs %}
@@ -308,7 +308,7 @@ The series can be collapsed by unchecking the CheckBox as below:
## ToggleSeriesVisibility
-[`ToggleSeriesVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartLegend.html#Syncfusion_UI_Xaml_Charts_ChartLegend_ToggleSeriesVisibility) is used to view or collapse the associated [`series`](https://help.syncfusion.com/uwp/charts/series), by clicking on its legend item. By default, [`ToggleSeriesVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartLegend.html#Syncfusion_UI_Xaml_Charts_ChartLegend_ToggleSeriesVisibility) property is *False*.
+[`ToggleSeriesVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartLegend.html#Syncfusion_UI_Xaml_Charts_ChartLegend_ToggleSeriesVisibility) is used to view or collapse the associated [`series`](https://help.syncfusion.com/chart-sdk/uwp/charts/series), by clicking on its legend item. By default, [`ToggleSeriesVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartLegend.html#Syncfusion_UI_Xaml_Charts_ChartLegend_ToggleSeriesVisibility) property is *False*.
We can enable the [`ToggleSeriesVisibility`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartLegend.html#Syncfusion_UI_Xaml_Charts_ChartLegend_ToggleSeriesVisibility) property as in below code example:
@@ -335,11 +335,11 @@ chart.Legend = new ChartLegend()
{% endtabs %}
-The [`series`](https://help.syncfusion.com/uwp/charts/series) can be collapsed, by clicking on the respective legend item,
+The [`series`](https://help.syncfusion.com/chart-sdk/uwp/charts/series) can be collapsed, by clicking on the respective legend item,
-We can view the associated [`series`](https://help.syncfusion.com/uwp/charts/series), by clicking on its disabled legend item,
+We can view the associated [`series`](https://help.syncfusion.com/chart-sdk/uwp/charts/series), by clicking on its disabled legend item,
diff --git a/chart-sdk/uwp/charts/Overview.md b/chart-sdk/uwp/charts/Overview.md
index 84a16e3c1..c9875665b 100644
--- a/chart-sdk/uwp/charts/Overview.md
+++ b/chart-sdk/uwp/charts/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About UWP Charts control | Syncfusion
-description: Learn here all about introduction of Syncfusion® UWP Charts (SfChart) control, its elements and more.
+title: About Syncfusion® UWP Charts | Syncfusion®
+description: Learn about introduction of Syncfusion Essential Studio® UWP Chart control, its features, capabilities, and more details.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# UWP Charts (SfChart) Overview
+# About Syncfusion UWP Charts Control
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) provides a perfect way to visualize data with a high level of user interactivity that focuses on development, productivity and simplicity of use. [`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) also provides a wide variety of charting features that are used to visualize large quantities of data, flexible data binding and user customization.
diff --git a/chart-sdk/uwp/charts/Performance.md b/chart-sdk/uwp/charts/Performance.md
index d74d375ba..d8254e4d5 100644
--- a/chart-sdk/uwp/charts/Performance.md
+++ b/chart-sdk/uwp/charts/Performance.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Performance in UWP Charts control | Syncfusion
-description: Learn everything about Performance support in Syncfusion® UWP Charts (SfChart) control and explore additional features.
+title: Performance in UWP Charts | Syncfusion®
+description: Performance in the UWP Chart provides optimized rendering, efficient memory usage, and smooth interaction for large datasets.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Performance in UWP Charts (SfChart)
+# Performance in UWP Charts
* When your underlying data object implements INotifyPropertyChanged, enable the [`ListenPropertyChange`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_ListenPropertyChange) property of the series so that the chart listens to the property changes of your data object. However, enabling this property registers the PropertyChanged event of every object in the data source, which affects the chart's loading time when there are a large number of points. By default, [`ListenPropertyChange`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_ListenPropertyChange) is set to false to avoid unnecessary event registration.
* In case of a [`LineSeries`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.LineSeries.html), when you have a large number of points to plot, you can make use of fast series types like [`FastLineSeries`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.FastLineSeries.html) and [`FastLineBitmapSeries`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.FastLineBitmapSeries.html).
diff --git a/chart-sdk/uwp/charts/ScaleBreaks.md b/chart-sdk/uwp/charts/ScaleBreaks.md
index 103438a58..a9fc1dcb8 100644
--- a/chart-sdk/uwp/charts/ScaleBreaks.md
+++ b/chart-sdk/uwp/charts/ScaleBreaks.md
@@ -1,12 +1,12 @@
---
layout: post
-title: Scale Breaks in UWP Charts control | Syncfusion
-description: Learn here about how to add proper charts area Scale Breaks support in Syncfusion® UWP Charts (SfChart) control and more.
+title: Scale Breaks in UWP Charts | Syncfusion®
+description: Scale breaks in the UWP Chart skip specific value ranges on an axis, improving readability when displaying unevenly distributed data.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Scale Breaks in UWP Charts (SfChart)
+# Scale Breaks in UWP Charts
Scale break is a stripe drawn in the chart area to denote the break in the continuity of data points. Scale breaks are useful when there is a large difference in the data points. Scale break allows you to have different ranges on the same axis to visualize the data effectively.
diff --git a/chart-sdk/uwp/charts/Series.md b/chart-sdk/uwp/charts/Series.md
index d2ebf354d..8dadcc7cc 100644
--- a/chart-sdk/uwp/charts/Series.md
+++ b/chart-sdk/uwp/charts/Series.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Series in UWP Charts control | Syncfusion
-description: Learn here all about Series feature of Syncfusion® Universal Windows Platform (UWP) Charts (SfChart) control and more.
+title: Series in UWP Charts | Syncfusion®
+description: Series in the UWP Chart define how data is visualized, enabling different chart types, styles, and data representations.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Series in UWP Charts (SfChart)
+# Series in UWP Charts
[`ChartSeries`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeries.html) is the visual representation of the data. [`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) offers many types of series ranging from [`LineSeries`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.LineSeries.html) to [`FinancialSeries`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.FinancialSeriesBase.html) like [`HiLo`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.hiloSeries.html) and [`Candle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.candleSeries.html). Based on your requirements and specifications, any type of [`Series`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html#Syncfusion_UI_Xaml_Charts_SfChart_Series) can be added for data visualization.
diff --git a/chart-sdk/uwp/charts/Sorting.md b/chart-sdk/uwp/charts/Sorting.md
index 7231dd1e3..71474a144 100644
--- a/chart-sdk/uwp/charts/Sorting.md
+++ b/chart-sdk/uwp/charts/Sorting.md
@@ -1,25 +1,25 @@
---
layout: post
-title: Sorting in UWP Charts control | Syncfusion
-description: Learn here about how to add proper Sorting data points support in Syncfusion® UWP Charts (SfChart) control and more.
+title: Sorting in UWP Charts | Syncfusion®
+description: Sorting in the UWP Chart arranges data points based on specified values, enabling clearer visualization and comparison of chart data.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Sorting in UWP Charts (SfChart)
+# Sorting in UWP Charts
Chart provides support for sorting the data point rendering in either ascending or descending order based on the X or Y axis.
-### Enable sorting
+## Enable sorting
The [`IsSortData`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_IsSortData) property is used to enable sorting in the series.
-### Changing sorting direction
+## Changing sorting direction
The [`SortDirection`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_SortDirection) property defines the direction of sorting in either Ascending or Descending order based on the X or Y value.
-### Changing sorting axis
+## Changing sorting axis
The [`SortBy`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartSeriesBase.html#Syncfusion_UI_Xaml_Charts_ChartSeriesBase_SortBy) property decides whether sorting should be done based on the [`X`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SortingAxis.html#Syncfusion_UI_Xaml_Charts_SortingAxis_X) or [`Y`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SortingAxis.html#Syncfusion_UI_Xaml_Charts_SortingAxis_Y) values.
diff --git a/chart-sdk/uwp/charts/Striplines.md b/chart-sdk/uwp/charts/Striplines.md
index e616b4281..0da5a88ca 100644
--- a/chart-sdk/uwp/charts/Striplines.md
+++ b/chart-sdk/uwp/charts/Striplines.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Striplines in UWP Charts control | Syncfusion
-description: Learn everything about Striplines support in Syncfusion® UWP Charts (SfChart) control and explore additional features.
+title: Striplines in UWP Charts | Syncfusion®
+description: Striplines in the UWP Chart highlight specific ranges or regions on an axis, helping emphasize important values and thresholds.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Striplines in UWP Charts (SfChart)
+# Striplines in UWP Charts
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) allows you to add [`Striplines`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartAxisBase2D.html#Syncfusion_UI_Xaml_Charts_ChartAxisBase2D_StripLines) to the chart, which shades the specific region or range in the plot area background at regular or custom intervals.
diff --git a/chart-sdk/uwp/charts/Styling-and-Customization.md b/chart-sdk/uwp/charts/Styling-and-Customization.md
index 5cb55ae38..95c15d0b7 100644
--- a/chart-sdk/uwp/charts/Styling-and-Customization.md
+++ b/chart-sdk/uwp/charts/Styling-and-Customization.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Styling and Customization in UWP Charts control | Syncfusion
-description: Learn here all about Styling and Customization support in Syncfusion® UWP Charts (SfChart) control and more.
+title: Styling and Customization in UWP Chart | Syncfusion®
+description: Styling and customization in the UWP Chart enable personalized chart appearance through themes, colors, palettes, and visual settings.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Styling and Customization in UWP Charts (SfChart)
+# Styling and Customization in UWP Chart
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) supports various customizing and styling options that allow you to enrich the application.
diff --git a/chart-sdk/uwp/charts/Technical-Indicators.md b/chart-sdk/uwp/charts/Technical-Indicators.md
index ec36482cc..063f60129 100644
--- a/chart-sdk/uwp/charts/Technical-Indicators.md
+++ b/chart-sdk/uwp/charts/Technical-Indicators.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Technical Indicators in UWP Charts control | Syncfusion
-description: Learn here all about Technical Indicators support in Syncfusion® UWP Charts (SfChart) control and more.
+title: Technical Indicators in UWP Charts | Syncfusion®
+description: Technical indicators in the UWP Chart provide analytical calculations and overlays to identify trends, patterns, and market conditions.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Technical Indicators in UWP Charts (SfChart)
+# Technical Indicators in UWP Charts
Technical indicators are the base of technical analysis, which is used to determine the future market trends.
diff --git a/chart-sdk/uwp/charts/Trendlines.md b/chart-sdk/uwp/charts/Trendlines.md
index 4908aa325..600fc3e8a 100644
--- a/chart-sdk/uwp/charts/Trendlines.md
+++ b/chart-sdk/uwp/charts/Trendlines.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Trendlines in UWP Charts control | Syncfusion
-description: Learn here all about Trendlines support in Syncfusion® UWP Charts (SfChart) control, its elements, features, and more.
+title: Trendlines in UWP Charts | Syncfusion®
+description: Trendlines in the UWP Chart display data trends and patterns using fitted lines, helping analyze and predict data behavior.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Trendlines in UWP Charts (SfChart)
+# Trendlines in UWP Charts
[`Trendlines`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.CartesianSeries.html#Syncfusion_UI_Xaml_Charts_CartesianSeries_Trendlines) are used to analyze and display the trends in the data graphically. It is built on the assumptions based on current and past price trends.
diff --git a/chart-sdk/uwp/charts/Vertical-Charts.md b/chart-sdk/uwp/charts/Vertical-Charts.md
index e9421d79d..0867cadc6 100644
--- a/chart-sdk/uwp/charts/Vertical-Charts.md
+++ b/chart-sdk/uwp/charts/Vertical-Charts.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Vertical Charts in UWP Charts control | Syncfusion
-description: Learn everything about Vertical Charts support in Syncfusion® UWP Charts (SfChart) control and explore additional features.
+title: Vertical Charts in UWP Charts | Syncfusion®
+description: Vertical charts in the UWP Chart display series with transposed axes, enabling an alternative orientation for data visualization.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Vertical Charts in UWP Charts (SfChart)
+# Vertical Charts in UWP Charts
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) provides support for vertical charts. You can plot vertical chart for any chart using [`IsTransposed`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.CartesianSeries.html#Syncfusion_UI_Xaml_Charts_CartesianSeries_IsTransposed) and [`OpposedPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.ChartAxis.html#Syncfusion_UI_Xaml_Charts_ChartAxis_OpposedPosition) properties.
diff --git a/chart-sdk/uwp/charts/Watermark.md b/chart-sdk/uwp/charts/Watermark.md
index 1e4c2b374..4b144f32d 100644
--- a/chart-sdk/uwp/charts/Watermark.md
+++ b/chart-sdk/uwp/charts/Watermark.md
@@ -1,12 +1,12 @@
---
layout: post
-title: Watermark in UWP Charts control | Syncfusion
-description: Learn everything about Watermark support in Syncfusion® UWP Charts (SfChart) control and explore additional features.
+title: Watermark in UWP Charts | Syncfusion®
+description: Watermark in the UWP Chart adds background text or images to the chart area, helping customize and brand chart visuals.
platform: chart-sdk
control: SfChart
documentation: ug
---
-# Watermark in UWP Charts (SfChart)
+# Watermark in UWP Charts
[`SfChart`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Charts.SfChart.html) provides watermark support which is used to add text or images to the chart area. The major application of watermark is to define the copyright information of the user it belongs to.
diff --git a/chart-sdk/uwp/digital-gauge/Digital-Characters.md b/chart-sdk/uwp/digital-gauge/Digital-Characters.md
index 5bfcd09d9..613b84fe7 100644
--- a/chart-sdk/uwp/digital-gauge/Digital-Characters.md
+++ b/chart-sdk/uwp/digital-gauge/Digital-Characters.md
@@ -1,124 +1,128 @@
---
layout: post
-title: Digital Characters in UWP Digital Gauge control | Syncfusion
-description: Learn here all about Digital Characters support in Syncfusion UWP Digital Gauge (SfDigitalGauge) control and more.
+title: Digital Characters in UWP Digital Gauge | Syncfusion®
+description: Digital characters in the UWP Digital Gauge allow you to display numeric and alphanumeric values using customizable digital segments.
platform: chart-sdk
control: SfDigitalGauge
documentation: ug
---
-# Digital Characters in UWP Digital Gauge (SfDigitalGauge)
+# Digital Characters in UWP Digital Gauge
-The digital characters in the digital gauge can be viewed in different types of segments. These digital characters are set to the digital gauge through the **Value** property of type string.
+The digital characters in the digital gauge can be viewed in different types of segments. These digital characters are displayed in the digital gauge by setting the [Value](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_Value) property of type string.
+
+By default, the [CharacterType](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterType) property is set to `SegmentSeven`. The following sample uses the default segment type to render the value "GAUGE".
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "GAUGE";
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "GAUGE";
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
+
+The segment type can be changed using the [CharacterType](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterType) property. The `CharacterType` enum supports the following values: `SegmentSeven`, `SegmentFourteen`, `SegmentSixteen`, and `EightCrossEightDotMatrix`. Unsupported characters are rendered as blank segments. The [Value](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_Value) property accepts alphanumeric and special characters and is case-sensitive.
## 7-Segments
-The digital characters which are set as the value property of the digital gauge are displayed by default 7-segments. Rather than using the alphabets, these are mainly used to display numbers. The type of segments can be set by the **CharacterType** property.
+When [CharacterType](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterType) is set to `SegmentSeven`, the value is displayed in 7-segment format. This type is mainly used to display numbers (0–9), though a limited set of letters is also supported.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "12345";
- digital.CharacterType = CharacterType.SegmentSeven;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "12345";
+digital.CharacterType = CharacterType.SegmentSeven;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
## 14-Segments
-The digital characters which are set as the value property of the digital gauge are displayed by 14 segments. These type of characters are used to display both alphabets and numbers.
+When [CharacterType](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterType) is set to `SegmentFourteen`, the value is displayed in 14-segment format. This type is used to display both letters and numbers.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "SYNCFUSION";
- digital.CharacterType = CharacterType.SegmentFourteen;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.CharacterType = CharacterType.SegmentFourteen;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
## 16-Segments
-The digital characters which are set as the value property of the digital gauge are displayed by 16 segments. These type of characters are also used to display both alphabets and numbers.
+When [CharacterType](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterType) is set to `SegmentSixteen`, the value is displayed in 16-segment format. This type is used to display both letters and numbers. Compared to the 14-segment display, it splits the top and bottom horizontal bars into two segments each, which produces a more refined look and is preferred when each character needs to be rendered with finer detail.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "SYNCFUSION";
- digital.CharacterType = CharacterType.SegmentSixteen;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.CharacterType = CharacterType.SegmentSixteen;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
## 8*8 Dot Matrix Segments
-The digital characters which are set as the value property of the digital gauge are displayed by eight cross eight dot matrix segments. These type of characters are used to display special characters along with the alphabets and numbers.
+When [CharacterType](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterType) is set to `EightCrossEightDotMatrix`, the value is displayed in an 8 × 8 dot matrix. This type is used to display special characters along with letters and numbers.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "SYNCFUSION";
- digital.CharacterType = CharacterType.EightCrossEightDotMatrix;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.CharacterType = CharacterType.EightCrossEightDotMatrix;
+this.Grid.Children.Add(digital);
{% endhighlight %}
-{% endtabs%}
+{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/digital-gauge/Getting-Started.md b/chart-sdk/uwp/digital-gauge/Getting-Started.md
index a25773837..35ce4cd44 100644
--- a/chart-sdk/uwp/digital-gauge/Getting-Started.md
+++ b/chart-sdk/uwp/digital-gauge/Getting-Started.md
@@ -1,89 +1,94 @@
----
+ ---
layout: post
-title: Getting Started with UWP Digital Gauge control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP Digital Gauge (SfDigitalGauge) control, its elements and more.
+title: Getting Started with UWP Digital Gauge | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Digital Gauge control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfDigitalGauge
documentation: ug
---
-# Getting Started with UWP Digital Gauge (SfDigitalGauge)
+# Getting Started with UWP Digital Gauge
-This section explains you the steps required to configure the **SfDigitalGauge** and also explains the steps to add basic elements of **SfDigitalGauge** through various API’s available within it.
+This section explains the steps required to configure the [SfDigitalGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html) and also explains the steps to add basic elements of [SfDigitalGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html) through various APIs available within it.
## Configuring SfDigitalGauge
-SfDigitalGauge is existing in the following assembly and namespace.
+SfDigitalGauge is available in the following assembly and namespace.
**Assembly**: Syncfusion.SfGauge.UWP
**Namespace**: Syncfusion.UI.Xaml.Gauges
+By default, the [Value](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_Value) property is empty and [CharacterType](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterType) defaults to `SegmentSeven`.
+
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- this.Grid.Children.Add(digital);
-
+SfDigitalGauge digital = new SfDigitalGauge();
+this.Grid.Children.Add(digital);
+
{% endhighlight %}
{% endtabs %}
-
+
+Run the above code and the default [SfDigitalGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html) is displayed as follows.
-Run the above code and now the default **SfDigitalGauge** can be displayed as follows. UI component of the digital gauge can be customized by adding segments and passing Values which will be explained in the next section.
+The UI component of the digital gauge can be customized by adding segments and setting the [Value](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_Value) property, which will be explained in the next section.
-## Displaying Values
+## Displaying Values
-You can add alphanumeric characters to SfDigitalGauge using **Value** property in SfDigitalGauge.
+You can add alphanumeric characters to [SfDigitalGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html) using the [Value](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_Value) property in SfDigitalGauge.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "GAUGE";
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "GAUGE";
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-SfDigitalGauge Values are displayed as follows.
+The values are displayed as follows.
-
+
## Changing segments
-You can view the digital characters in SfDigitalGauge using different types of Segments available in **CharacterType** property.
+You can view the digital characters in [SfDigitalGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html) using different types of segments available in the [CharacterType](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterType) property. The `CharacterType` enum (defined in the `Syncfusion.UI.Xaml.Gauges` namespace) supports the following values: `SegmentSeven`, `SegmentFourteen`, `SegmentSixteen`, and `EightByEightDotMatrix`. For the full list of supported segment types and the characters each one renders, see [Digital Characters](./Digital-Characters.md).
+
+The `SegmentSeven` type primarily supports digits (0–9) and a limited set of characters, which is why the sample below renders numeric values.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "12345";
- digital.CharacterType = CharacterType.SegmentSeven;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "12345";
+digital.CharacterType = CharacterType.SegmentSeven;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-SfDigitalGauge Segments are displayed as follows.
+The segments are displayed as follows.
-
+
diff --git a/chart-sdk/uwp/digital-gauge/Key-features.md b/chart-sdk/uwp/digital-gauge/Key-features.md
index 60a55f55f..2fabcd07c 100644
--- a/chart-sdk/uwp/digital-gauge/Key-features.md
+++ b/chart-sdk/uwp/digital-gauge/Key-features.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Key Features in UWP Digital Gauge control | Syncfusion
-description: Learn here all about Key Features support in Syncfusion UWP Digital Gauge (SfDigitalGauge) control and more.
+title: Key Features in UWP Digital Gauge | Syncfusion®
+description: Key features in the UWP Digital Gauge include customizable digital displays, segment styling, and flexible value presentation.
platform: chart-sdk
control: SfDigitalGauge
documentation: ug
---
-# Key Features in UWP Digital Gauge (SfDigitalGauge)
+# Key Features in UWP Digital Gauge
-A digital gauge is composed of segments which are a major UI component of the digital gauge. **SfDigitalGauge** comprises of the following segments to display the digital characters.
+A digital gauge is composed of segments which are a major UI component of the digital gauge. [SfDigitalGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html) comprises the following segment types to display the digital characters.
* 7 Segment Display
* 14 Segment Display
@@ -18,21 +18,21 @@ A digital gauge is composed of segments which are a major UI component of the di
**7-Segment Display**
-These type of digital gauge displays the digital characters in 7 segments. These are mainly used to display the numbers.
+This type of digital gauge displays the digital characters in 7 segments. It is mainly used to display numbers.
**14-Segment Display**
-These type of digital gauge displays the digital characters in 14 segments. These are mainly used to display both the numbers and alphabets.
+This type of digital gauge displays the digital characters in 14 segments. It is mainly used to display both numbers and letters. The additional segments (compared to the 7-segment display) enable it to render a fuller set of alphabetic characters.
**16-Segment Display**
-These type of digital gauge displays the digital characters in 16 segments. These type of digital gauge are also mainly used to display both the numbers and alphabets.
+This type of digital gauge displays the digital characters in 16 segments. It is also mainly used to display both numbers and letters. The two extra segments split the horizontal bars, producing a more evenly lit character that is preferred when a cleaner, split-style appearance is desired.
-**8 * 8 Dot Matrix Display**
+**8 x 8 Dot Matrix Display**
-These type of digital gauge displays the digital character in 8*8 dot matrix segments where the characters are spotted by the regular brush and remaining dot are spotted by the dimmed brush. These are mainly used to display numbers, characters and special characters.
+This type of digital gauge displays the digital characters in an 8 x 8 dot matrix where the active character dots are highlighted using the `RegularBrush` property and the remaining (inactive) dots use the [DimmedBrush](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_DimmedBrush) property. It is mainly used to display numbers, letters, and special characters.
**Easy to use**
-**SfDigitalGauge** is available in Visual Studio toolbox itself, you can easily drag and drop the control from toolbox.
+[SfDigitalGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html) is available in the Visual Studio toolbox itself; you can easily drag and drop the control from the toolbox.
diff --git a/chart-sdk/uwp/digital-gauge/Overview.md b/chart-sdk/uwp/digital-gauge/Overview.md
index 83a4a52b8..06b28aa3e 100644
--- a/chart-sdk/uwp/digital-gauge/Overview.md
+++ b/chart-sdk/uwp/digital-gauge/Overview.md
@@ -1,19 +1,19 @@
---
layout: post
-title: About UWP Digital Gauge control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Digital Gauge (SfDigitalGauge) control, its elements and more.
+title: About Syncfusion® UWP Digital Gauge Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Digital Gauge control, its features, capabilities, and more details.
platform: chart-sdk
control: SfDigitalGauge
documentation: ug
---
-# UWP Digital Gauge (SfDigitalGauge) Overview
+# About Syncfusion® UWP Digital Gauge Control
-The Digital Gauge control is used to display alphanumeric characters in digital (LED Display) mode. Digital gauge is used to display a range of values that uses character in combination with numbers.
+The [Digital Gauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html) control is used to display alphanumeric characters in digital (LED display) mode. The digital gauge is used to display a range of values that uses characters in combination with numbers.
**Use Cases**
-* Displays alpha-numeric values as a virtual digital display.
+* Displays alphanumeric values as a virtual digital display.
* Displays the current time in a virtual digital clock.
-* Displays the speed and distance in a digital speedometers.
+* Displays the speed and distance in digital speedometers.
diff --git a/chart-sdk/uwp/digital-gauge/Settings.md b/chart-sdk/uwp/digital-gauge/Settings.md
index f98bfaaa0..2b5ba2581 100644
--- a/chart-sdk/uwp/digital-gauge/Settings.md
+++ b/chart-sdk/uwp/digital-gauge/Settings.md
@@ -1,165 +1,165 @@
---
layout: post
-title: Settings in UWP Digital Gauge control | Syncfusion
-description: Learn here all about Settings support in Syncfusion UWP Digital Gauge (SfDigitalGauge) control and more.
+title: Settings in UWP Digital Gauge | Syncfusion®
+description: Settings in the UWP Digital Gauge allow you to configure display behavior, appearance, values, and customization options.
platform: chart-sdk
control: SfDigitalGauge
documentation: ug
---
-# Settings in UWP Digital Gauge (SfDigitalGauge)
+# Settings in UWP Digital Gauge
-There are some other elements/behavior in SfDigitalGauge also can be customized.
+Other elements and behaviors in [SfDigitalGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html) can be customized as well.
They are:
* Character Spacing
-* Segment Thickness
-* RTL (Right to Left) support
* Character Stroke
-* Dimmed Brush stroke
-* Dimmed Brush opacity
+* Segment Thickness
+* RTL (Right to Left) Support
+* Dimmed Brush Stroke
+* Dimmed Brush Opacity
## Character Spacing
-The distance between the characters can be set by using the **CharacterSpacing** property.
+The distance between the characters can be set by using the [CharactersSpacing](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharactersSpacing) property. The default value is `10`, and the valid range is any non-negative numeric value.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = " SYNCFUSION";
- digital.CharacterSpacing = 50;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.CharacterSpacing = 50;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
## Character Stroke
-The Stroke of the character can be changed by **CharacterStroke** property.
+The stroke of the character can be changed by the [CharacterStroke](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterStroke) property. The default value is `Red`.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = " SYNCFUSION";
- digital.CharacterStroke = new SolidColorBrush(Colors.Yellow);
- digital.CharacterType = CharacterType.SegmentFourteen;
- this.Grid.Children.Add(digital);
-
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.CharacterType = CharacterType.SegmentFourteen;
+digital.CharacterStroke = new SolidColorBrush(Colors.Yellow);
+this.Grid.Children.Add(digital);
+
{% endhighlight %}
{% endtabs %}
-
+
## Segment Thickness
-Using **SegmentThickness** property, you can adjust the thickness of the segment.
+You can adjust the thickness of the segment using the [SegmentThickness](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_SegmentThickness) property. The default value is `2`, and the valid range is any positive numeric value.
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = " SYNCFUSION";
- digital.SegmentThickness = 5;
- digital.CharacterType = CharacterType.SegmentFourteen;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.SegmentThickness = 5;
+digital.CharacterType = CharacterType.SegmentFourteen;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
## RTL (Right to Left) support
-The Characters are aligned using **EnableRTLFormat** property. The default value of **EnableRTLFormat** **is** false.
+The Characters are aligned using the [EnableRTLFormat](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_EnableRTLFormat) property. The default value of `EnableRTLFormat` is `false`.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = " SYNCFUSION";
- digital.EnableRTLFormat= true;
- digital.CharacterType = CharacterType.SegmentFourteen;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.EnableRTLFormat = true;
+digital.CharacterType = CharacterType.SegmentFourteen;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
## Dimmed Brush stroke
-**DimmedBrush** property is used to apply brushes to the dimmed segment. This property is used to suit the background of the Digital gauge
+The [DimmedBrush](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_DimmedBrush) property is used to apply a brush to the dimmed (inactive) segments of the digital gauge. The dimmed segments are the segments that are not part of the active character being displayed. This property helps the dimmed segments blend with the background of the digital gauge. The default value is `Transparent`.
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = " SYNCFUSION";
- digital.DimmedBrush = new SolidColorBrush(Colors.White);
- digital.CharacterType = CharacterType.SegmentFourteen;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.DimmedBrush = new SolidColorBrush(Colors.White);
+digital.CharacterType = CharacterType.SegmentFourteen;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
## Dimmed Brush opacity
-**DimmedBrushOpacity** property is used to set the opacity of the brushes to the dimmed segment.
+The [DimmedBrushOpacity](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_DimmedBrushOpacity) property is used to set the opacity of the dimmed segment brush. The default value is `50`, and the valid range is `0` to `100` (percentage).
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = " SYNCFUSION";
- digital.DimmedBrush = new SolidColorBrush(Colors.White);
- digital.CharacterType = CharacterType.SegmentFourteen;
- digital.DimmedBrushOpacity = 20;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.DimmedBrush = new SolidColorBrush(Colors.White);
+digital.CharacterType = CharacterType.SegmentFourteen;
+digital.DimmedBrushOpacity = 20;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/digital-gauge/Transformation-of-Characters.md b/chart-sdk/uwp/digital-gauge/Transformation-of-Characters.md
index 82bc5d180..0763bd214 100644
--- a/chart-sdk/uwp/digital-gauge/Transformation-of-Characters.md
+++ b/chart-sdk/uwp/digital-gauge/Transformation-of-Characters.md
@@ -1,115 +1,117 @@
---
layout: post
-title: Transformation of Characters in UWP Digital Gauge control | Syncfusion
-description: Learn here all about Transformation of Characters support in Syncfusion UWP Digital Gauge (SfDigitalGauge) control and more.
+title: Transformation of Characters in UWP Digital Gauge | Syncfusion®
+description: Transformation of characters in the UWP Digital Gauge enables character rotation, scaling, and visual customization for digital displays.
platform: chart-sdk
control: SfDigitalGauge
documentation: ug
---
-# Transformation of Characters in UWP Digital Gauge (SfDigitalGauge)
+# Transformation of Characters in UWP Digital Gauge
-The digital characters in the digital gauge can be transformed by setting certain properties in the digital gauge. Two kinds of transformations are done using this property. They are:
+The digital characters in the digital gauge can be transformed by setting certain properties in the [SfDigitalGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html). Two kinds of transformations are supported: Scaling and Skewing.
* Scaling
* Skewing
## Scaling
-The value of the digital characters is scaled by altering the height and width of the digital characters. It is achieved by setting the **CharacterHeight** and **CharacterWidth** property in the digital gauge.
+Digital characters are scaled by altering their height and width. It is achieved by setting the [CharacterHeight](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterHeight) and [CharacterWidth](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterWidth) properties in the digital gauge. The two properties can be set independently to scale each dimension. The default values and valid ranges are as follows:
+
+* [CharacterHeight](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterHeight) — default value is `40`; valid range is any positive numeric value.
+* [CharacterWidth](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_CharacterWidth) — default value is `25`; valid range is any positive numeric value.
### CharacterHeight
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "SYNCFUSION";
- digital.CharacterHeight = 70;
- digital.CharacterType = CharacterType.SegmentFourteen;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.CharacterHeight = 70;
+digital.CharacterType = CharacterType.SegmentFourteen;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
### CharacterWidth
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "SYNCFUSION";
- digital.CharacterWidth = 60;
- digital.CharacterType = CharacterType.SegmentFourteen;
- this.Grid.Children.Add(digital);
-
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.CharacterWidth = 60;
+digital.CharacterType = CharacterType.SegmentFourteen;
+this.Grid.Children.Add(digital);
+
{% endhighlight %}
{% endtabs %}
-
+
## Skewing
-The digital gauge also performs skew transformation for the digital characters. It can be done on both x-axis and y-axis through **SkewAngleX** and **SkewAngleY** properties respectively.
+The digital gauge also supports skew transformation of digital characters. It can be done on the x-axis and y-axis through the [SkewAngleX](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_SkewAngleX) and [SkewAngleY](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_SkewAngleY) properties, respectively. Both skew angles can be applied simultaneously. The default values, valid ranges, and units are as follows:
+
+* [SkewAngleX](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_SkewAngleX) — default value is `0`; valid range is any numeric value (in degrees).
+* [SkewAngleY](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfDigitalGauge.html#Syncfusion_UI_Xaml_Gauges_SfDigitalGauge_SkewAngleY) — default value is `0`; valid range is any numeric value (in degrees).
### SkewAngleX
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "SYNCFUSION";
- digital.SkewAngleX = 35;
- digital.CharacterType = CharacterType.SegmentFourteen;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.SkewAngleX = 35;
+digital.CharacterType = CharacterType.SegmentFourteen;
+this.Grid.Children.Add(digital);
{% endhighlight %}
-{% endtabs%}
+{% endtabs %}
-
+
### SkewAngleY
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight c# %}
- SfDigitalGauge digital = new SfDigitalGauge();
- digital.Value = "SYNCFUSION";
- digital.SkewAngleY = 30;
- digital.CharacterType = CharacterType.SegmentFourteen;
- this.Grid.Children.Add(digital);
+SfDigitalGauge digital = new SfDigitalGauge();
+digital.Value = "SYNCFUSION";
+digital.SkewAngleY = 30;
+digital.CharacterType = CharacterType.SegmentFourteen;
+this.Grid.Children.Add(digital);
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/linear-gauge/GettingStarted.md b/chart-sdk/uwp/linear-gauge/GettingStarted.md
index b9df6635b..1e9509036 100644
--- a/chart-sdk/uwp/linear-gauge/GettingStarted.md
+++ b/chart-sdk/uwp/linear-gauge/GettingStarted.md
@@ -1,22 +1,22 @@
---
layout: post
-title: Getting Started with UWP Linear Gauge control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP Linear Gauge (SfLinearGauge) control, its elements and more.
+title: Getting Started with UWP Linear Gauge | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Linear Gauge control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
---
-# Getting Started with UWP Linear Gauge (SfLinearGauge)
+# Getting Started with UWP Linear Gauge
-This section explains the steps required to configure a [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) control in a real-time scenario and also provides a walk-through on some of the customization features available in [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) control.
+This section explains the steps required to configure a [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) control in a real-time scenario and also provides a walk-through of some of the customization features available in the [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) control.
## Adding gauge references
-Refer to this [article](https://help.syncfusion.com/uwp/add-syncfusion-controls) to know how to add Syncfusion controls to Visual Studio projects in various ways. You can also refer to [this](https://help.syncfusion.com/uwp/control-dependencies) link to know about the assemblies required for adding gauge to your project.
+Refer to this [article](https://help.syncfusion.com/uwp/add-syncfusion-controls) to know how to add Syncfusion controls to Visual Studio projects in various ways. You can also refer to [this](https://help.syncfusion.com/uwp/control-dependencies) link to know about the assemblies required for adding a gauge to your project.
### Initialize gauge
-Import the [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) namespace to your respective Window as follows.
+Import the [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) namespace to your respective Window as follows.
{% tabs %}
@@ -40,14 +40,13 @@ You can initialize an empty [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp
{% highlight xml %}
-
+
{% endhighlight %}
{% highlight c# %}
SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
this.Content = sfLinearGauge;
{% endhighlight %}
@@ -56,29 +55,24 @@ this.Content = sfLinearGauge;
### Adding header
-You can assign a unique header to [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) by using the [`Header`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_Header) property and position it wherever as you desired by using the [`HeaderOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_HeaderOffset) property.
+You can assign a unique header to the [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) by using the [`Header`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_Header) property and position it wherever you desire by using the [`HeaderOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_HeaderOffset) property.
{% tabs %}
{% highlight xml %}
-
-
-
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- sfLinearGauge.Header = "Thermometer";
-
- sfLinearGauge.HeaderFontSize = 15;
-
- sfLinearGauge.HeaderOffset = new Point(0.47, 0.38);
-
- this.Content = sfLinearGauge;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+sfLinearGauge.Header = "Thermometer";
+sfLinearGauge.HeaderFontSize = 15;
+sfLinearGauge.HeaderOffset = new Point(0.47, 0.38);
+this.Content = sfLinearGauge;
{% endhighlight %}
@@ -86,74 +80,46 @@ You can assign a unique header to [`SfLinearGauge`](https://help.syncfusion.com/
### Configuring scale
-Configuring scale
-
-You can configure the [`LinearScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html) elements by making use of following API’s available in [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html).
-They are:
+You can configure the [`LinearScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html) elements by making use of the following APIs available in [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html). They are:
• ScaleDirection
-
• ScaleBarStroke
-
• ScaleBarSize
-
• ScaleBarLength
-
• ScaleBarBorderThickness
-
• Interval
-
• Minimum
-
• Maximum
{% tabs %}
{% highlight xml %}
-
-
+
-
-
-
-
-
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
@@ -167,96 +133,58 @@ You can categorize the scale values using the start and end values properties in
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- LinearRange linearRange = new LinearRange();
-
- linearRange.StartValue = 0;
-
- linearRange.EndValue = 40;
-
- linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff,0x27,0xBE,0xB7));
-
- linearRange.StartWidth = 10;
-
- linearRange.EndWidth = 10;
-
- linearRange.RangeOffset = 0.4;
-
- linearScale.Ranges.Add(linearRange);
-
- LinearRange linearRange1 = new LinearRange();
-
- linearRange1.StartValue = 40;
-
- linearRange1.EndValue = 100;
-
- linearRange1.RangeStroke = new SolidColorBrush(Colors.LightCyan);
-
- linearRange1.RangeOffset = 0.4;
-
- linearRange1.StartWidth = 10;
-
- linearRange1.EndWidth = 10;
-
- linearScale.Ranges.Add(linearRange1);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.ScaleBarSize = 10;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.EndValue = 40;
+linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x27, 0xBE, 0xB7));
+linearRange.StartWidth = 10;
+linearRange.EndWidth = 10;
+linearRange.RangeOffset = 0.4;
+linearScale.Ranges.Add(linearRange);
+LinearRange linearRange1 = new LinearRange();
+linearRange1.StartValue = 40;
+linearRange1.EndValue = 100;
+linearRange1.RangeStroke = new SolidColorBrush(Colors.LightCyan);
+linearRange1.RangeOffset = 0.4;
+linearRange1.StartWidth = 10;
+linearRange1.EndWidth = 10;
+linearScale.Ranges.Add(linearRange1);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
@@ -269,76 +197,48 @@ You can categorize the scale values using the start and end values properties in
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.SymbolPointer;
-
- linearPointer.Value = 60;
-
- linearPointer.SymbolPointerHeight = 10;
-
- linearPointer.SymbolPointerWidth = 10;
-
- linearPointer.SymbolPointerPosition = LinearSymbolPointersPosition.Below;
-
- linearPointer.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff,0x75,0x75,0x75));
-
- linearScale.Pointers.Add(linearPointer);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.ScaleBarSize = 10;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+LinearPointer linearPointer = new LinearPointer();
+linearPointer.PointerType = LinearPointerType.SymbolPointer;
+linearPointer.Value = 60;
+linearPointer.SymbolPointerHeight = 10;
+linearPointer.SymbolPointerWidth = 10;
+linearPointer.SymbolPointerPosition = LinearSymbolPointersPosition.Below;
+linearPointer.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x75, 0x75, 0x75));
+linearScale.Pointers.Add(linearPointer);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
@@ -352,145 +252,95 @@ You can categorize the scale values using the start and end values properties in
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- LinearPointer linearPointer1 = new LinearPointer();
-
- linearPointer1.PointerType = LinearPointerType.BarPointer;
-
- linearPointer1.Value = 50;
-
- linearPointer1.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x75, 0x75, 0x75));
-
- linearPointer1.BarPointerStrokeThickness = 10;
-
- linearScale.Pointers.Add(linearPointer1);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.ScaleBarSize = 10;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+LinearPointer linearPointer1 = new LinearPointer();
+linearPointer1.PointerType = LinearPointerType.BarPointer;
+linearPointer1.Value = 50;
+linearPointer1.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x75, 0x75, 0x75));
+linearPointer1.BarPointerStrokeThickness = 10;
+linearScale.Pointers.Add(linearPointer1);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-The following code example is the complete code of the previous configurations.
+The following code example is the complete code for the previous configurations.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
+
+
+
-
-
-
+
-
+ BarPointerStrokeThickness="10"/>
-
-
-
-
-
-
+
+
-
-
-
-
-
-
-
+
+
+
{% endhighlight %}
{% highlight c# %}
-
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Media;
using Syncfusion.UI.Xaml.Gauges;
@@ -504,99 +354,52 @@ namespace GaugeGettingStarted
public MainPage()
{
this.InitializeComponent();
-
SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
sfLinearGauge.Header = "Thermometer";
-
sfLinearGauge.HeaderFontSize = 15;
-
sfLinearGauge.HeaderOffset = new Point(0.47, 0.38);
-
LinearScale linearScale = new LinearScale();
-
linearScale.Interval = 10;
-
linearScale.LabelSize = 15;
-
linearScale.ScaleBarSize = 10;
-
linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
linearScale.MajorTickSize = 25;
-
linearScale.MinorTickSize = 12;
-
linearScale.ScaleBarLength = 300;
-
linearScale.MinorTicksPerInterval = 3;
-
LinearRange linearRange = new LinearRange();
-
linearRange.StartValue = 0;
-
linearRange.EndValue = 40;
-
linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x27, 0xBE, 0xB7));
-
linearRange.StartWidth = 10;
-
linearRange.EndWidth = 10;
-
linearRange.RangeOffset = 0.4;
-
linearScale.Ranges.Add(linearRange);
-
LinearRange linearRange1 = new LinearRange();
-
linearRange1.StartValue = 40;
-
linearRange1.EndValue = 100;
-
linearRange1.RangeStroke = new SolidColorBrush(Colors.LightCyan);
-
linearRange1.RangeOffset = 0.4;
-
linearRange1.StartWidth = 10;
-
linearRange1.EndWidth = 10;
-
linearScale.Ranges.Add(linearRange1);
-
LinearPointer linearPointer = new LinearPointer();
-
linearPointer.PointerType = LinearPointerType.SymbolPointer;
-
linearPointer.Value = 60;
-
linearPointer.SymbolPointerHeight = 10;
-
linearPointer.SymbolPointerWidth = 10;
-
linearPointer.SymbolPointerPosition = LinearSymbolPointersPosition.Below;
-
linearPointer.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x75, 0x75, 0x75));
-
linearScale.Pointers.Add(linearPointer);
-
LinearPointer linearPointer1 = new LinearPointer();
-
linearPointer1.PointerType = LinearPointerType.BarPointer;
-
linearPointer1.Value = 50;
-
linearPointer1.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x75, 0x75, 0x75));
-
linearPointer1.BarPointerStrokeThickness = 10;
-
linearScale.Pointers.Add(linearPointer1);
-
sfLinearGauge.MainScale = linearScale;
-
this.Content = sfLinearGauge;
}
}
@@ -606,9 +409,9 @@ namespace GaugeGettingStarted
{% endtabs %}
-The following screenshot illustrates the result of the previous codes.
+The following screenshot illustrates the result of the previous code.
-
+
-You can find the complete getting started sample from this [`link`]().
+You can find the complete getting started sample from this [link](https://github.com/syncfusion/uwp-demos/tree/master/Gauge/Gauge).
diff --git a/chart-sdk/uwp/linear-gauge/Labels.md b/chart-sdk/uwp/linear-gauge/Labels.md
index 21d73db16..5ba3c54b0 100644
--- a/chart-sdk/uwp/linear-gauge/Labels.md
+++ b/chart-sdk/uwp/linear-gauge/Labels.md
@@ -1,144 +1,108 @@
---
layout: post
-title: Labels in UWP Linear Gauge control | Syncfusion
-description: Learn here all about Labels support in Syncfusion UWP Linear Gauge (SfLinearGauge) control and more.
+title: Labels in UWP Linear Gauge | Syncfusion®
+description: Labels in the UWP Linear Gauge display scale values and support customization through styling, positioning, and appearance settings.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
---
-# Labels in UWP Linear Gauge (SfLinearGauge)
+# Labels in UWP Linear Gauge
-`Labels` of the linear scale provide a numeric value to the major ticks that will be specified according to the range of the scale.
+The `Labels` of the linear scale provide a numeric value to the major ticks that will be specified according to the range of the scale.
## Label color customization
-The foreground of the label is customized by setting the [`LabelStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelStroke) of the linear scale.
+The foreground of the label can be customized by setting the [`LabelStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelStroke) property of the linear scale.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Colors.Purple);
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.ScaleBarSize = 10;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Colors.Purple);
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Label font customization
-The label font can be customized using the [`LabelSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelSize), `FontFamily`, and `FontStyle` properties.
+The label font can be customized using the [`LabelSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelSize), [`FontFamily`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_FontFamily), and [`FontStyle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_FontStyle) properties.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.FontFamily = new FontFamily("Monotype Corsiva");
-
- linearScale.FontStyle = Windows.UI.Text.FontStyle.Italic;
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.FontFamily = new FontFamily("Monotype Corsiva");
+linearScale.FontStyle = Windows.UI.Text.FontStyle.Italic;
+linearScale.ScaleBarSize = 10;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting position for labels
-The labels in the scale can be placed above or below the linear scale by choosing the following options available in the [`LabelPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelPosition) property. The default value of [`LabelPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelPosition) property is below.
+The labels in the scale can be placed above or below the linear scale by choosing one of the following options available in the [`LabelPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelPosition) property. The default value of the [`LabelPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelPosition) property is `Below`.
1. Above
2. Below (Default)
@@ -147,59 +111,41 @@ The labels in the scale can be placed above or below the linear scale by choosin
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.LabelPosition = LinearLabelsPosition.Above;
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.LabelPosition = LinearLabelsPosition.Above;
+linearScale.ScaleBarSize = 10;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting postfix and prefix for labels
@@ -207,68 +153,49 @@ You can postfix and prefix values to the scale labels using the [`LabelPostfix`]
### Setting label postfix
-The [`LabelPostfix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelPostfix) property allows to postfix the values to scale labels.
+The [`LabelPostfix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelPostfix) property allows you to postfix values to the scale labels.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.Minimum = 0;
-
- linearScale.Maximum = 50;
-
- linearScale.LabelPostfix = "%";
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.Minimum = 0;
+linearScale.Maximum = 50;
+linearScale.LabelPostfix = "%";
+linearScale.ScaleBarSize = 10;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
### Setting label prefix
@@ -278,61 +205,42 @@ The [`LabelPrefix`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.Minimum = 0;
-
- linearScale.Maximum = 50;
-
- linearScale.LabelPostfix = "$";
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.Minimum = 0;
+linearScale.Maximum = 50;
+linearScale.LabelPrefix = "$";
+linearScale.ScaleBarSize = 10;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting label offset
@@ -342,171 +250,143 @@ The labels can be positioned far away from the ticks using the [`LabelOffset`](h
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.LabelOffset = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.ScaleBarSize = 10;
+linearScale.LabelOffset = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Labels visibility
-Labels visibility can be customized using the [`ShowLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ShowLabels) property of linear scale.
+Label visibility can be customized using the [`ShowLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ShowLabels) property of the linear scale.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.ScaleBarSize = 10;
-
- linearScale.ShowLabels = false;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.ScaleBarSize = 10;
+linearScale.ShowLabels = false;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Customize the scale labels
-
-The scale label are customized by using `LabelFormat` and `Culture` properties of linear scale.
-`LabelFormat` property is used to change the format of labels by setting a formatting string on the `LabelFormat` property.
-`Culture` property is used to format the group separator of the value based on the respective culture.
+The scale labels can be customized using the [`LabelFormat`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelFormat) and [`Culture`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_Culture) properties of the linear scale.
+
+The [`LabelFormat`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_LabelFormat) property is used to change the format of labels by setting a formatting string on the `LabelFormat` property.
+The [`Culture`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_Culture) property is used to format the group separator of the value based on the respective culture.
{% tabs %}
{% highlight xaml %}
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge linearGauge = new SfLinearGauge();
- LinearScale linearScale = new LinearScale();
- linearScale.MaximumLabels = 4;
- linearScale.ScaleOffset = 50;
- linearScale.Minimum = 10;
- linearScale.Maximum = 50;
- linearScale.Interval = 10;
- linearScale.ScaleBarStroke = new SolidColorBrush(Colors.LightGray);
- linearScale.MinorTicksPerInterval = 1;
- linearScale.LabelSize = 20;
- linearScale.LabelFormat = "{0:c}";
- linearScale.LabelOffset = 10;
- linearScale.ScaleBarSize = 10;
- linearScale.MinorTicksPerInterval = 1;
- linearScale.LabelStroke = new SolidColorBrush(Colors.Black);
- LinearPointer barPointer = new LinearPointer();
- barPointer.BarPointerStrokeThickness = 10;
- barPointer.PointerType = LinearPointerType.BarPointer;
- barPointer.BarPointerStroke = new SolidColorBrush(Colors.Red);
- barPointer.Value = 35;
- linearScale.Pointers.Add(barPointer);
- LinearRange linearRange = new LinearRange();
- linearRange.StartValue = 0;
- linearRange.EndValue = 30;
- linearRange.StartWidth = 10;
- linearRange.EndWidth = 10;
- linearRange.RangeStroke = new SolidColorBrush(Colors.Blue);
- linearRange.RangeOffset = 5;
- linearScale.Ranges.Add(linearRange);
- linearGauge.MainScale=linearScale;
- linearScale.Culture = new System.Globalization.CultureInfo("fr-FR");
-
+SfLinearGauge linearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MaximumLabels = 4;
+linearScale.ScaleOffset = 50;
+linearScale.Minimum = 10;
+linearScale.Maximum = 50;
+linearScale.Interval = 10;
+linearScale.ScaleBarStroke = new SolidColorBrush(Colors.LightGray);
+linearScale.MinorTicksPerInterval = 1;
+linearScale.LabelSize = 20;
+linearScale.LabelFormat = "{0:c}";
+linearScale.LabelOffset = 10;
+linearScale.ScaleBarSize = 10;
+linearScale.LabelStroke = new SolidColorBrush(Colors.Black);
+
+LinearPointer barPointer = new LinearPointer();
+barPointer.BarPointerStrokeThickness = 10;
+barPointer.PointerType = LinearPointerType.BarPointer;
+barPointer.BarPointerStroke = new SolidColorBrush(Colors.Red);
+barPointer.Value = 35;
+linearScale.Pointers.Add(barPointer);
+
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.EndValue = 30;
+linearRange.StartWidth = 10;
+linearRange.EndWidth = 10;
+linearRange.RangeStroke = new SolidColorBrush(Colors.Blue);
+linearRange.RangeOffset = 5;
+linearScale.Ranges.Add(linearRange);
+linearGauge.MainScale = linearScale;
+linearScale.Culture = new System.Globalization.CultureInfo("fr-FR");
+
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/linear-gauge/Orientation.md b/chart-sdk/uwp/linear-gauge/Orientation.md
index b51d7a50f..7a995f3d9 100644
--- a/chart-sdk/uwp/linear-gauge/Orientation.md
+++ b/chart-sdk/uwp/linear-gauge/Orientation.md
@@ -1,68 +1,51 @@
---
layout: post
-title: Orientation in UWP Linear Gauge control | Syncfusion
-description: Learn here all about Orientation support in Syncfusion UWP Linear Gauge (SfLinearGauge) control and more.
+title: Orientation and its Customization in UWP Linear Gauge | Syncfusion®
+description: Orientation and its Customization in the UWP Linear Gauge allows you to display the gauge in horizontal or vertical layouts based on application needs.
platform: chart-sdk
-control: Orientation
+control: SfLinearGauge
documentation: ug
---
-# Orientation in UWP Linear Gauge (SfLinearGauge)
+# Orientation and its Customization in UWP Linear Gauge
-The [`LinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) control supports horizontal and vertical orientations. By default, the [`LinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) is rendered with horizontal orientation. You can change the orientation using the [`Orientation`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_Orientation) property.
+The [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) control supports horizontal and vertical orientations. By default, the [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) is rendered with horizontal orientation. You can change the orientation using the [`Orientation`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_Orientation) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- sfLinearGauge.Orientation = Orientation.Vertical;
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+sfLinearGauge.Orientation = Orientation.Vertical;
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/linear-gauge/Overview.md b/chart-sdk/uwp/linear-gauge/Overview.md
index 37f130fee..2aee51f94 100644
--- a/chart-sdk/uwp/linear-gauge/Overview.md
+++ b/chart-sdk/uwp/linear-gauge/Overview.md
@@ -1,36 +1,35 @@
---
layout: post
-title: About UWP Linear Gauge control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Linear Gauge (SfLinearGauge) control, its elements and more.
+title: About Syncfusion® UWP Linear Gauge Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Linear Gauge control, its features, capabilities, and more details.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
---
-# UWP Linear Gauge (SfLinearGauge) Overview
+# About Syncfusion® UWP Linear Gauge Control
-[`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) displays a range of values graphically along the linear scale, which is considered as the linear form of the linear gauge. It measures the values of the scale and it is present in the horizontal, vertical sliding, or meter.
+The [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) displays a range of values graphically along the linear scale, which is considered as the linear form of the linear gauge. It measures the values of the scale and it is present in the horizontal, vertical sliding, or meter.
-[`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) is used to visualize the numerical values of a scale in linear manner. By using the [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) control, it is possible to render the thermometer.
+The [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) is used to visualize the numerical values of a scale in a linear manner. By using the [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) control, it is possible to render the thermometer.
## Key features
### Scale
-The [`Scale`](https://help.syncfusion.com/uwp/linear-gauge/scales) supports to adding multiple scales on linear gauge by horizontal and vertical orientations.
+The [`Scale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html) supports adding multiple scales on the linear gauge with horizontal and vertical orientations.
### Ranges
-Highlights the desired [`Ranges`](https://help.syncfusion.com/uwp/sflineargauge/ranges) of values in the gauge scale.
+Highlights the desired [`Ranges`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html) of values in the gauge scale.
### Pointers
-The [`Pointers`](https://help.syncfusion.com/uwp/sflineargauge/pointers) supports to add multiple pointers (bar and symbol) on the linear scale.
+The [`Pointers`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html) support adding multiple pointers (bar and symbol) on the linear scale.
### Annotations
-Annotations are used to mark the specific area of interest in the gauge area with texts, shapes, or images. You can add any number of annotations to the gauge.
+[`Annotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_Annotations) are used to mark the specific area of interest in the gauge area with texts, shapes, or images. You can add any number of annotations to the gauge.
-
-
+
diff --git a/chart-sdk/uwp/linear-gauge/Pointers.md b/chart-sdk/uwp/linear-gauge/Pointers.md
index 6a44152a9..2ba3a1072 100644
--- a/chart-sdk/uwp/linear-gauge/Pointers.md
+++ b/chart-sdk/uwp/linear-gauge/Pointers.md
@@ -1,629 +1,433 @@
---
layout: post
-title: Pointers in UWP Linear Gauge control | Syncfusion
-description: Learn here all about Pointers support in Syncfusion UWP Linear Gauge (SfLinearGauge) control and more.
+title: Pointers in UWP Linear Gauge | Syncfusion®
+description: Pointers in the UWP Linear Gauge indicate values on the scale using different pointer types and customizable appearance settings.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
---
-# Pointers in UWP Linear Gauge (SfLinearGauge)
+# Pointers in UWP Linear Gauge
-The [`LinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) provides support to mark values using the `BarPointer` and `SymbolPointer`.
+The [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) provides support to mark values using the `BarPointer` and `SymbolPointer`.
## Bar pointer
-`BarPointer` is used to mark scale values. It starts at the beginning of gauge and ends at the pointer value. You can add bar pointer using the [`PointerType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_PointerType) property.
+The `BarPointer` is used to mark scale values. It starts at the beginning of the gauge and ends at the pointer value. You can add a bar pointer using the [`PointerType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_PointerType) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.LabelSize = 15;
-
- LinearPointer linearPointer1 = new LinearPointer();
-
- linearPointer1.PointerType = LinearPointerType.BarPointer;
-
- linearPointer1.Value = 75;
-
- linearPointer1.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff,0x36,0xD1,0xDC));
-
- linearScale.Pointers.Add(linearPointer1);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarLength = 300;
+linearScale.LabelSize = 15;
+
+LinearPointer linearPointer1 = new LinearPointer();
+linearPointer1.PointerType = LinearPointerType.BarPointer;
+linearPointer1.Value = 75;
+linearPointer1.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x36, 0xD1, 0xDC));
+linearScale.Pointers.Add(linearPointer1);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
### Bar pointer customization
-The UI of `Bar pointer` is customized using the [`BarPointerStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_BarPointerStroke) and [`BarPointerStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_BarPointerStrokeThickness) properties.
+The UI of the bar pointer is customized using the [`BarPointerStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_BarPointerStroke) and [`BarPointerStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_BarPointerStrokeThickness) properties.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.LabelSize = 15;
-
- LinearPointer linearPointer1 = new LinearPointer();
-
- linearPointer1.PointerType = LinearPointerType.BarPointer;
-
- linearPointer1.Value = 75;
-
- linearPointer1.BarPointerStroke = new SolidColorBrush(Colors.Orange);
-
- linearPointer1.BarPointerStrokeThickness = 20;
-
- linearScale.Pointers.Add(linearPointer1);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarLength = 300;
+linearScale.LabelSize = 15;
+
+LinearPointer linearPointer1 = new LinearPointer();
+linearPointer1.PointerType = LinearPointerType.BarPointer;
+linearPointer1.Value = 75;
+linearPointer1.BarPointerStroke = new SolidColorBrush(Colors.Orange);
+linearPointer1.BarPointerStrokeThickness = 20;
+linearScale.Pointers.Add(linearPointer1);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting corner radius type for bar pointer
-Corners of the `BarPointer` can be customized by setting the value to the
-[`CornerRadius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_CornerRadius) property.
+Corners of the `BarPointer` can be customized by setting a value to the [`CornerRadius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_CornerRadius) property.
{% tabs %}
{% highlight xaml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.LabelSize = 15;
-
- LinearPointer linearPointer1 = new LinearPointer();
-
- linearPointer1.PointerType = LinearPointerType.BarPointer;
-
- linearPointer1.Value = 75;
-
- linearPointer1.BarPointerStrokeThickness = 20;
-
- linearPointer1.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x36, 0xD1, 0xDC));
-
- linearPointer1.CornerRadius = new Windows.UI.Xaml.CornerRadius(10,0,0,10);
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarLength = 300;
+linearScale.LabelSize = 15;
+
+LinearPointer linearPointer1 = new LinearPointer();
+linearPointer1.PointerType = LinearPointerType.BarPointer;
+linearPointer1.Value = 75;
+linearPointer1.BarPointerStrokeThickness = 20;
+linearPointer1.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x36, 0xD1, 0xDC));
+linearPointer1.CornerRadius = new Windows.UI.Xaml.CornerRadius(10, 0, 0, 10);
+linearScale.Pointers.Add(linearPointer1);
+sfLinearGauge.MainScale = linearScale;
- linearScale.Pointers.Add(linearPointer1);
-
- sfLinearGauge.MainScale = linearScale;
-
-{% endhighlight %}
+{% endhighlight %}
{% endtabs %}
-
+
## Setting gradient color for bar pointer
-You can give smooth color transition to bar pointer to specifying the different colors based on bar pointer’s value by using [`GradientStops`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_GradientStops) property.
+You can give a smooth color transition to a bar pointer by specifying different colors based on the bar pointer's value using the [`GradientStops`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_GradientStops) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
-
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xF7, 0xED, 0xED));
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.LabelSize = 15;
-
- linearScale.CornerRadius = new Windows.UI.Xaml.CornerRadius(10);
-
- LinearPointer linearPointer1 = new LinearPointer();
-
- linearPointer1.PointerType = LinearPointerType.BarPointer;
-
- linearPointer1.Value = 75;
-
- GaugeGradientStop gaugeGradientStop = new GaugeGradientStop();
-
- gaugeGradientStop.Value = 10;
-
- gaugeGradientStop.Color = Color.FromArgb(0xff, 0xF8, 0xBA, 0xBF);
-
- linearPointer1.GradientStops.Add(gaugeGradientStop);
-
- GaugeGradientStop gaugeGradientStop1 = new GaugeGradientStop();
-
- gaugeGradientStop1.Value = 40;
-
- gaugeGradientStop1.Color = Color.FromArgb(0xff, 0xEE, 0x89, 0xA7);
-
- linearPointer1.GradientStops.Add(gaugeGradientStop1);
-
- GaugeGradientStop gaugeGradientStop2 = new GaugeGradientStop();
-
- gaugeGradientStop2.Value = 50;
-
- gaugeGradientStop2.Color = Color.FromArgb(0xff, 0xE4, 0x54, 0x8C);
-
- linearPointer1.GradientStops.Add(gaugeGradientStop2);
-
- GaugeGradientStop gaugeGradientStop3 = new GaugeGradientStop();
-
- gaugeGradientStop3.Value = 60;
-
- gaugeGradientStop3.Color = Color.FromArgb(0xff, 0xDB, 0x25, 0x75);
-
- linearPointer1.GradientStops.Add(gaugeGradientStop3);
-
- linearPointer1.BarPointerStrokeThickness = 20;
-
- linearPointer1.CornerRadius = new Windows.UI.Xaml.CornerRadius(10);
-
- linearScale.Pointers.Add(linearPointer1);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xF7, 0xED, 0xED));
+linearScale.ScaleBarLength = 300;
+linearScale.LabelSize = 15;
+linearScale.CornerRadius = new Windows.UI.Xaml.CornerRadius(10);
+
+LinearPointer linearPointer1 = new LinearPointer();
+linearPointer1.PointerType = LinearPointerType.BarPointer;
+linearPointer1.Value = 75;
+GaugeGradientStop gaugeGradientStop = new GaugeGradientStop();
+gaugeGradientStop.Value = 10;
+gaugeGradientStop.Color = Color.FromArgb(0xff, 0xF8, 0xBA, 0xBF);
+linearPointer1.GradientStops.Add(gaugeGradientStop);
+GaugeGradientStop gaugeGradientStop1 = new GaugeGradientStop();
+gaugeGradientStop1.Value = 40;
+gaugeGradientStop1.Color = Color.FromArgb(0xff, 0xEE, 0x89, 0xA7);
+linearPointer1.GradientStops.Add(gaugeGradientStop1);
+GaugeGradientStop gaugeGradientStop2 = new GaugeGradientStop();
+gaugeGradientStop2.Value = 50;
+gaugeGradientStop2.Color = Color.FromArgb(0xff, 0xE4, 0x54, 0x8C);
+linearPointer1.GradientStops.Add(gaugeGradientStop2);
+GaugeGradientStop gaugeGradientStop3 = new GaugeGradientStop();
+gaugeGradientStop3.Value = 60;
+gaugeGradientStop3.Color = Color.FromArgb(0xff, 0xDB, 0x25, 0x75);
+linearPointer1.GradientStops.Add(gaugeGradientStop3);
+linearPointer1.BarPointerStrokeThickness = 20;
+linearPointer1.CornerRadius = new Windows.UI.Xaml.CornerRadius(10);
+linearScale.Pointers.Add(linearPointer1);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Symbol pointer
-In `SymbolPointer`, the value is pointed by a symbol on the scale.
+In a `SymbolPointer`, the value is pointed by a symbol on the scale.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.LabelSize = 15;
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.SymbolPointer;
-
- linearPointer.Value = 60;
-
- linearScale.Pointers.Add(linearPointer);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarLength = 300;
+linearScale.LabelSize = 15;
+LinearPointer linearPointer = new LinearPointer();
+linearPointer.PointerType = LinearPointerType.SymbolPointer;
+linearPointer.Value = 60;
+linearScale.Pointers.Add(linearPointer);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
### Symbol pointer customization
-You can modify the size of symbol pointer by changing the [`SymbolPointerHeight`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerHeight) and [`SymbolPointerWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerWidth) properties. The stroke of symbol pointer is changed using the [`SymbolPointerStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerStroke) property.
+You can modify the size of the symbol pointer by changing the [`SymbolPointerHeight`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerHeight) and [`SymbolPointerWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerWidth) properties. The stroke of the symbol pointer can be changed using the [`SymbolPointerStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerStroke) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.LabelSize = 15;
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.SymbolPointer;
-
- linearPointer.Value = 60;
-
- linearPointer.SymbolPointerHeight = 15;
-
- linearPointer.SymbolPointerWidth = 20;
-
- linearPointer.SymbolPointerStroke = new SolidColorBrush(Colors.DeepSkyBlue);
-
- linearScale.Pointers.Add(linearPointer);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarLength = 300;
+linearScale.LabelSize = 15;
+LinearPointer linearPointer = new LinearPointer();
+linearPointer.PointerType = LinearPointerType.SymbolPointer;
+linearPointer.Value = 60;
+linearPointer.SymbolPointerHeight = 15;
+linearPointer.SymbolPointerWidth = 20;
+linearPointer.SymbolPointerStroke = new SolidColorBrush(Colors.DeepSkyBlue);
+linearScale.Pointers.Add(linearPointer);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Positioning symbol pointer
-The `SymbolPointer` in the scale can be placed above, below, or in between the scale by choosing the following options available in the [`SymbolPointerPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerPosition) property:
+The `SymbolPointer` in the scale can be placed above, below, or across the scale by choosing one of the following options available in the [`SymbolPointerPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerPosition) property:
1. Above
2. Below (Default)
3. Cross
-4. Away
+4. Away
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.LabelSize = 15;
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.SymbolPointer;
-
- linearPointer.Value = 60;
-
- linearPointer.SymbolPointerPosition = LinearSymbolPointersPosition.Cross;
-
- linearPointer.SymbolPointerHeight = 30;
-
- linearPointer.SymbolPointerWidth = 30;
-
- linearPointer.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x5B, 0x86, 0xE5));
-
- linearScale.Pointers.Add(linearPointer);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarLength = 300;
+linearScale.LabelSize = 15;
+LinearPointer linearPointer = new LinearPointer();
+linearPointer.PointerType = LinearPointerType.SymbolPointer;
+linearPointer.Value = 60;
+linearPointer.SymbolPointerPosition = LinearSymbolPointersPosition.Cross;
+linearPointer.SymbolPointerHeight = 30;
+linearPointer.SymbolPointerWidth = 30;
+linearPointer.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x5B, 0x86, 0xE5));
+linearScale.Pointers.Add(linearPointer);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
### Change symbol pointer shapes
-The [`SymbolPointerStyle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerStyle) property is used to select symbol pointer style.
+The [`SymbolPointerStyle`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearPointer.html#Syncfusion_UI_Xaml_Gauges_LinearPointer_SymbolPointerStyle) property is used to select the symbol pointer style.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.LabelSize = 15;
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.SymbolPointer;
-
- linearPointer.Value = 60;
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "" + "";
-
- content += "";
-
- linearPointer.SymbolPointerStyle = LinearSymbolPointerStyle.Custom;
-
- linearPointer.SymbolPointerTemplate = (DataTemplate)XamlReader.Load(content);
-
- linearScale.Pointers.Add(linearPointer);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarLength = 300;
+linearScale.LabelSize = 15;
+LinearPointer linearPointer = new LinearPointer();
+linearPointer.PointerType = LinearPointerType.SymbolPointer;
+linearPointer.Value = 60;
+var content = "";
+content += "";
+content += "";
+content += "" + "";
+content += "";
+linearPointer.SymbolPointerStyle = LinearSymbolPointerStyle.Custom;
+linearPointer.SymbolPointerTemplate = (DataTemplate)XamlReader.Load(content);
+linearScale.Pointers.Add(linearPointer);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
### Adding multiple pointers
@@ -633,81 +437,51 @@ In addition to the default pointer, you can add "n" number of pointers to a line
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.LabelSize = 15;
-
- LinearPointer linearPointer1 = new LinearPointer();
-
- linearPointer1.PointerType = LinearPointerType.BarPointer;
-
- linearPointer1.Value = 75;
-
- linearPointer1.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x36, 0xD1, 0xDC));
-
- linearPointer1.BarPointerStrokeThickness = 10;
-
- linearScale.Pointers.Add(linearPointer1);
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.SymbolPointer;
-
- linearPointer.Value = 60;
-
- linearPointer.SymbolPointerHeight = 15;
-
- linearPointer.SymbolPointerWidth = 15;
-
- linearPointer.SymbolPointerPosition = LinearSymbolPointersPosition.Above;
-
- linearPointer.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x5B, 0x86, 0xE5));
-
- linearScale.Pointers.Add(linearPointer);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarLength = 300;
+linearScale.LabelSize = 15;
+LinearPointer linearPointer1 = new LinearPointer();
+linearPointer1.PointerType = LinearPointerType.BarPointer;
+linearPointer1.Value = 75;
+linearPointer1.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x36, 0xD1, 0xDC));
+linearPointer1.BarPointerStrokeThickness = 10;
+linearScale.Pointers.Add(linearPointer1);
+LinearPointer linearPointer = new LinearPointer();
+linearPointer.PointerType = LinearPointerType.SymbolPointer;
+linearPointer.Value = 60;
+linearPointer.SymbolPointerHeight = 15;
+linearPointer.SymbolPointerWidth = 15;
+linearPointer.SymbolPointerPosition = LinearSymbolPointersPosition.Above;
+linearPointer.SymbolPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x5B, 0x86, 0xE5));
+linearScale.Pointers.Add(linearPointer);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/linear-gauge/Ranges.md b/chart-sdk/uwp/linear-gauge/Ranges.md
index c7fc22a8f..36305de45 100644
--- a/chart-sdk/uwp/linear-gauge/Ranges.md
+++ b/chart-sdk/uwp/linear-gauge/Ranges.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Ranges in UWP Linear Gauge control | Syncfusion
-description: Learn here all about Ranges support in Syncfusion UWP Linear Gauge (SfLinearGauge) control and more.
+title: Ranges in UWP Linear Gauge | Syncfusion®
+description: Ranges in the UWP Linear Gauge highlight specific value intervals on the scale, helping visualize thresholds, targets, and data groups.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
---
-# Ranges in UWP Linear Gauge (SfLinearGauge)
+# Ranges in UWP Linear Gauge
-Range is a visual element, which begins and ends at specified values within a scale. You can add any number of ranges to a scale using the array of range objects.
+A [`LinearRange`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html) is a visual element, which begins and ends at specified values within a scale. You can add any number of ranges to a scale using an array of range objects.
## Setting start and end values for range
@@ -19,701 +19,476 @@ The start and end values of ranges are set using the [`StartValue`](https://help
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
-
- LinearRange linearRange = new LinearRange();
-
- linearRange.StartValue = 0;
-
- linearRange.EndValue = 60;
-
- linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x27, 0xBE, 0xB7));
-
- linearRange.StartWidth = 10;
-
- linearRange.EndWidth = 10;
-
- linearRange.RangeOffset = 0.4;
-
- linearScale.Ranges.Add(linearRange);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.EndValue = 60;
+linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x27, 0xBE, 0xB7));
+linearRange.StartWidth = 10;
+linearRange.EndWidth = 10;
+linearRange.RangeOffset = 0.4;
+linearScale.Ranges.Add(linearRange);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Range customization
-The UI element of a range is customized by changing the [`RangeStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_RangeStroke) of the linear range, and the appearance of linear range is customized by setting the [`StartWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_StartWidth) and [`EndWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_EndWidth) properties. By setting the [`RangeOpacity`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_RangeOpacity) of LinearRange, the opacity of the range can be modified.
+The UI element of a range is customized by changing the [`RangeStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_RangeStroke) of the linear range, and the appearance of the linear range is customized by setting the [`StartWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_StartWidth) and [`EndWidth`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_EndWidth) properties. By setting the [`RangeOpacity`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_RangeOpacity) property of the [`LinearRange`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html), the opacity of the range can be modified.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
-
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
-
- LinearRange linearRange = new LinearRange();
-
- linearRange.StartValue = 0;
-
- linearRange.EndValue = 50;
-
- linearRange.RangeOpacity = 1;
-
- linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xF9, 0x5C, 0x85));
-
- linearRange.StartWidth = 5;
-
- linearRange.EndWidth = 20;
-
- linearScale.Ranges.Add(linearRange);
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
+
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.EndValue = 50;
+linearRange.RangeOpacity = 1;
+linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xF9, 0x5C, 0x85));
+linearRange.StartWidth = 5;
+linearRange.EndWidth = 20;
+linearScale.Ranges.Add(linearRange);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Binding range stroke to ticks and labels
-You can bind the range’s stroke to tick lines and labels within its range by setting the [`BindWithRangeStrokeToLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_BindRangeStrokeToLabels). Stroke of the labels can be set related to stroke of the specified ranges. Similarly, by setting the [`BindWithRangeStrokeToTicks`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_BindRangeStrokeToTicks), stroke of the ticks can be set related to stroke of the specified ranges.
+You can bind the range's stroke to tick lines and labels within its range by setting the [`BindRangeStrokeToLabels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_BindRangeStrokeToLabels) property. The stroke of the labels can be set related to the stroke of the specified ranges. Similarly, by setting the [`BindRangeStrokeToTicks`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_BindRangeStrokeToTicks) property, the stroke of the ticks can be set related to the stroke of the specified ranges.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- linearScale.BindRangeStrokeToLabels = true;
-
- linearScale.BindRangeStrokeToTicks = true;
-
- sfLinearGauge.MainScale = linearScale;
-
- LinearRange linearRange = new LinearRange();
-
- linearRange.StartValue = 0;
-
- linearRange.EndValue = 35;
-
- linearRange.StartWidth = 15;
-
- linearRange.EndWidth = 15;
-
- linearRange.RangeOffset = 5;
-
- linearRange.RangeStroke = new SolidColorBrush(Colors.Green);
-
- linearScale.Ranges.Add(linearRange);
-
- LinearRange linearRange1 = new LinearRange();
-
- linearRange1.StartValue = 35;
-
- linearRange1.EndValue = 65;
-
- linearRange1.StartWidth = 15;
-
- linearRange1.EndWidth = 15;
-
- linearRange1.RangeOffset = 5;
-
- linearRange1.RangeStroke = new SolidColorBrush(Colors.Yellow);
-
- linearScale.Ranges.Add(linearRange1);
-
- LinearRange linearRange2 = new LinearRange();
-
- linearRange2.StartValue = 65;
-
- linearRange2.EndValue = 100;
-
- linearRange2.StartWidth = 15;
-
- linearRange2.EndWidth = 15;
-
- linearRange2.RangeOffset = 5;
-
- linearRange2.RangeStroke = new SolidColorBrush(Colors.Red);
-
- linearScale.Ranges.Add(linearRange2);
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+linearScale.BindRangeStrokeToLabels = true;
+linearScale.BindRangeStrokeToTicks = true;
+sfLinearGauge.MainScale = linearScale;
+
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.EndValue = 35;
+linearRange.StartWidth = 15;
+linearRange.EndWidth = 15;
+linearRange.RangeOffset = 5;
+linearRange.RangeStroke = new SolidColorBrush(Colors.Green);
+linearScale.Ranges.Add(linearRange);
+
+LinearRange linearRange1 = new LinearRange();
+linearRange1.StartValue = 35;
+linearRange1.EndValue = 65;
+linearRange1.StartWidth = 15;
+linearRange1.EndWidth = 15;
+linearRange1.RangeOffset = 5;
+linearRange1.RangeStroke = new SolidColorBrush(Colors.Yellow);
+linearScale.Ranges.Add(linearRange1);
+
+LinearRange linearRange2 = new LinearRange();
+linearRange2.StartValue = 65;
+linearRange2.EndValue = 100;
+linearRange2.StartWidth = 15;
+linearRange2.EndWidth = 15;
+linearRange2.RangeOffset = 5;
+linearRange2.RangeStroke = new SolidColorBrush(Colors.Red);
+linearScale.Ranges.Add(linearRange2);
{% endhighlight %}
{% endtabs %}
-
+
## Setting range position
- Using the [`RangeOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_RangeOffset) property, the linear range can be positioned with respect to the linear scale.
+Using the [`RangeOffset`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_RangeOffset) property, the linear range can be positioned with respect to the linear scale.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
-
- LinearRange linearRange = new LinearRange();
-
- linearRange.StartValue = 0;
-
- linearRange.EndValue = 60;
-
- linearRange.RangeOffset = 40;
-
- linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x27, 0xBE, 0xB7));
-
- linearRange.StartWidth = 10;
-
- linearRange.EndWidth = 10;
-
- linearScale.Ranges.Add(linearRange);
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
+
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.EndValue = 60;
+linearRange.RangeOffset = 40;
+linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x27, 0xBE, 0xB7));
+linearRange.StartWidth = 10;
+linearRange.EndWidth = 10;
+linearScale.Ranges.Add(linearRange);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
### Adding multiple ranges
-You can add “n” number of ranges to a scale using the [`LinearRange`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html) property of range as shown in the following code.
+You can add "n" number of ranges to a scale using the [`Ranges`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_Ranges) property of the linear scale as shown in the following code.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
-
- LinearRange linearRange = new LinearRange();
-
- linearRange.StartValue = 0;
-
- linearRange.EndValue = 35;
-
- linearRange.StartWidth = 25;
-
- linearRange.EndWidth = 10;
-
- linearRange.RangeOffset = 5;
-
- linearRange.RangeOpacity = 1;
-
- linearRange.RangeStroke = new SolidColorBrush(Colors.Green);
-
- linearScale.Ranges.Add(linearRange);
-
- LinearRange linearRange1 = new LinearRange();
-
- linearRange1.StartValue = 65;
-
- linearRange1.EndValue = 100;
-
- linearRange1.StartWidth = 10;
-
- linearRange1.EndWidth = 25;
-
- linearRange1.RangeOffset = 5;
-
- linearRange1.RangeOpacity = 1;
-
- linearRange1.RangeStroke = new SolidColorBrush(Colors.Red);
-
- linearScale.Ranges.Add(linearRange1);
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
+
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.EndValue = 35;
+linearRange.StartWidth = 25;
+linearRange.EndWidth = 10;
+linearRange.RangeOffset = 5;
+linearRange.RangeOpacity = 1;
+linearRange.RangeStroke = new SolidColorBrush(Colors.Green);
+linearScale.Ranges.Add(linearRange);
+
+LinearRange linearRange1 = new LinearRange();
+linearRange1.StartValue = 65;
+linearRange1.EndValue = 100;
+linearRange1.StartWidth = 10;
+linearRange1.EndWidth = 25;
+linearRange1.RangeOffset = 5;
+linearRange1.RangeOpacity = 1;
+linearRange1.RangeStroke = new SolidColorBrush(Colors.Red);
+linearScale.Ranges.Add(linearRange1);
{% endhighlight %}
{% endtabs %}
-
+
### Setting gradient color for range
-You can give smooth color transition to range to specifying the different colors based on range value by using [`GradientStops`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_GradientStops) property.
+You can give a smooth color transition to a range by specifying different colors based on the range value using the [`GradientStops`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html#Syncfusion_UI_Xaml_Gauges_LinearRange_GradientStops) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
-
- LinearRange linearRange = new LinearRange();
-
- linearRange.StartValue = 0;
-
- linearRange.EndValue = 100;
-
- linearRange.StartWidth = 20;
-
- linearRange.EndWidth = 20;
-
- linearRange.RangeOffset = 5;
-
- ObservableCollection gradientColor = new ObservableCollection()
- {
- new GaugeGradientStop() {Value = 0, Color = Color.FromArgb(0xff, 0xF9, 0xC2, 0xC3) },
- new GaugeGradientStop() {Value = 100 ,Color = Color.FromArgb(0xff, 0xD9, 0x1D, 0x71) }
- };
-
- linearRange.GradientStops = gradientColor;
-
- linearScale.Ranges.Add(linearRange);
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
+
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.EndValue = 100;
+linearRange.StartWidth = 20;
+linearRange.EndWidth = 20;
+linearRange.RangeOffset = 5;
+ObservableCollection gradientColor = new ObservableCollection()
+{
+ new GaugeGradientStop() { Value = 0, Color = Color.FromArgb(0xff, 0xF9, 0xC2, 0xC3) },
+ new GaugeGradientStop() { Value = 100, Color = Color.FromArgb(0xff, 0xD9, 0x1D, 0x71) }
+};
+linearRange.GradientStops = gradientColor;
+linearScale.Ranges.Add(linearRange);
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
### Multiple range with multiple gradient
-You can add “n” number of ranges with gradient color to a scale using the [`LinearRange`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearRange.html) property of range as shown in the following code.
+You can add "n" number of ranges with gradient color to a scale using the [`Ranges`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_Ranges) property of the linear scale as shown in the following code.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
-
- LinearRange linearRange = new LinearRange();
-
- linearRange.StartValue = 0;
-
- linearRange.EndValue = 35;
-
- linearRange.StartWidth = 25;
-
- linearRange.EndWidth = 10;
-
- linearRange.RangeOffset = 5;
-
- ObservableCollection gradientColor = new ObservableCollection()
- {
- new GaugeGradientStop() {Value = 0, Color = Color.FromArgb(0xff, 0xF9, 0xC2, 0xC3) },
- new GaugeGradientStop() {Value = 35 ,Color = Color.FromArgb(0xff, 0xD9, 0x1D, 0x71) }
- };
-
- linearRange.GradientStops = gradientColor;
-
-
- linearScale.Ranges.Add(linearRange);
-
- LinearRange linearRange1 = new LinearRange();
-
- linearRange1.StartValue = 65;
-
- linearRange1.EndValue = 100;
-
- linearRange1.StartWidth = 10;
-
- linearRange1.EndWidth = 25;
-
- linearRange1.RangeOffset = 5;
-
- ObservableCollection gradientColor1 = new ObservableCollection()
- {
- new GaugeGradientStop() {Value = 65, Color = Colors.Orange },
- new GaugeGradientStop() {Value = 100 ,Color = Colors.Yellow }
- };
-
- linearRange1.GradientStops = gradientColor1;
-
- linearScale.Ranges.Add(linearRange1);
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.EndValue = 35;
+linearRange.StartWidth = 25;
+linearRange.EndWidth = 10;
+linearRange.RangeOffset = 5;
+
+ObservableCollection gradientColor = new ObservableCollection()
+{
+ new GaugeGradientStop() { Value = 0, Color = Color.FromArgb(0xff, 0xF9, 0xC2, 0xC3) },
+ new GaugeGradientStop() { Value = 35, Color = Color.FromArgb(0xff, 0xD9, 0x1D, 0x71) }
+};
+
+linearRange.GradientStops = gradientColor;
+linearScale.Ranges.Add(linearRange);
+LinearRange linearRange1 = new LinearRange();
+linearRange1.StartValue = 65;
+linearRange1.EndValue = 100;
+linearRange1.StartWidth = 10;
+linearRange1.EndWidth = 25;
+linearRange1.RangeOffset = 5;
+
+ObservableCollection gradientColor1 = new ObservableCollection()
+{
+ new GaugeGradientStop() { Value = 65, Color = Colors.Orange },
+ new GaugeGradientStop() { Value = 100, Color = Colors.Yellow }
+};
+
+linearRange1.GradientStops = gradientColor1;
+linearScale.Ranges.Add(linearRange1);
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/linear-gauge/Scales.md b/chart-sdk/uwp/linear-gauge/Scales.md
index 68396042b..0d64977bb 100644
--- a/chart-sdk/uwp/linear-gauge/Scales.md
+++ b/chart-sdk/uwp/linear-gauge/Scales.md
@@ -1,69 +1,51 @@
---
layout: post
-title: Scales in UWP Linear Gauge control | Syncfusion
-description: Learn here all about Scales support in Syncfusion UWP Linear Gauge (SfLinearGauge) control and more.
+title: Scale in UWP Linear Gauge | Syncfusion®
+description: Scale in the UWP Linear Gauge defines value ranges, intervals, and labels, enabling accurate measurement and data representation.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
---
-# Scales in UWP Linear Gauge (SfLinearGauge)
+# Scale in UWP Linear Gauge
-The [`MainScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html) is a linear scale integrates ticks, labels, ranges, and pointers to customize the basic look and feel of the linear gauge.
+The [`MainScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_MainScale) is a linear scale that integrates ticks, labels, ranges, and pointers to customize the basic look and feel of the linear gauge.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting minimum and maximum values for a scale
@@ -73,119 +55,87 @@ To change the minimum and maximum values of a linear scale, use the [`Minimum`](
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Minimum = 0;
-
- linearScale.Maximum = 200;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Minimum = 0;
+linearScale.Maximum = 200;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting interval for a scale
-The [`Interval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_Interval) property allows to set intervals for scale. The default value of the `Interval` property is auto interval. Auto interval defines the count of the scale labels as 3 for 100 pixels.
+The [`Interval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_Interval) property allows you to set intervals for a scale. The default value of the `Interval` property is auto interval. Auto interval defines the count of the scale labels as 3 for 100 pixels.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Minimum = 0;
-
- linearScale.Maximum = 500;
-
- linearScale.Interval = 100;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.Minimum = 0;
+linearScale.Maximum = 500;
+linearScale.Interval = 100;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Scale customization
@@ -195,342 +145,239 @@ You can customize the color, length, size, and position of the [`LinearScale`](h
{% highlight xml %}
-
-
-
-
-
-
-
-
-
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.ScaleBarStroke = new SolidColorBrush(Colors.Blue);
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.ScaleBarSize = 20;
-
- linearScale.ScaleBarBorderThickness = new Thickness(3);
-
- linearScale.ScaleBarBorderBrush = new SolidColorBrush(Colors.Red);
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.MinorTicksPerInterval = 3;
-
- linearScale.ScaleBarLength = 300;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.ScaleBarStroke = new SolidColorBrush(Colors.Blue);
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.ScaleBarSize = 20;
+linearScale.ScaleBarBorderThickness = new Thickness(3);
+linearScale.ScaleBarBorderBrush = new SolidColorBrush(Colors.Red);
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.MinorTicksPerInterval = 3;
+linearScale.ScaleBarLength = 300;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting scale direction
-You can set the scale position to its forward and backward using the [`ScaleDirection`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ScaleDirection) property.
+You can set the scale position to forward and backward using the [`ScaleDirection`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ScaleDirection) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.ScaleDirection = LinearScaleDirection.Backward;
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.ScaleDirection = LinearScaleDirection.Backward;
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting position for a scale
-You can set the scale position using the [`ScaleBarPositionFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ScaleBarPositionFactor) property. First, set the [`ElementsPositionMode`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ElementsPositionMode) to custom, and then set [`ScaleBarPositionFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ScaleBarPositionFactor).
+You can set the scale position using the [`ScaleBarPositionFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ScaleBarPositionFactor) property. First, set the [`ElementsPositionMode`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ElementsPositionMode) to Custom, and then set [`ScaleBarPositionFactor`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_ScaleBarPositionFactor).
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.ElementsPositionMode = LinearScalePositionModes.Custom;
-
- linearScale.ScaleBarPositionFactor = 0.5;
-
- linearScale.TickPositionFactor = 0.443;
-
- linearScale.Interval = 10;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.ElementsPositionMode = LinearScalePositionModes.Custom;
+linearScale.ScaleBarPositionFactor = 0.5;
+linearScale.TickPositionFactor = 0.443;
+linearScale.Interval = 10;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
-## Setting corner radius type for scale
+## Setting corner radius type for scale
-Corners of the LinearScale can be customized by setting the value to the [`CornerRadius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_CornerRadius) property.
+Corners of the [`LinearScale`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html) can be customized by setting a value to the [`CornerRadius`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_CornerRadius) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.CornerRadius = new CornerRadius(10);
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.CornerRadius = new CornerRadius(10);
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting gradient color for scale
-You can give smooth color transition to scale to specifying the different colors based on scale value by using [`GradientStops`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_GradientStops) property.
+You can give a smooth color transition to a scale by specifying different colors based on scale value using the [`GradientStops`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_GradientStops) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- GaugeGradientStop gaugeGradientStop = new GaugeGradientStop();
-
- gaugeGradientStop.Value = 10;
-
- gaugeGradientStop.Color = Color.FromArgb(0xff, 0x51, 0xc9, 0xe1);
-
- linearScale.GradientStops.Add(gaugeGradientStop);
-
- GaugeGradientStop gaugeGradientStop1 = new GaugeGradientStop();
-
- gaugeGradientStop1.Value = 40;
-
- gaugeGradientStop1.Color = Color.FromArgb(0xff, 0x93, 0xe9, 0xe1);
-
- linearScale.GradientStops.Add(gaugeGradientStop1);
-
- GaugeGradientStop gaugeGradientStop2 = new GaugeGradientStop();
-
- gaugeGradientStop2.Value = 50;
-
- gaugeGradientStop2.Color = Color.FromArgb(0xff, 0xc5, 0xe6, 0x92);
-
- linearScale.GradientStops.Add(gaugeGradientStop2);
-
- GaugeGradientStop gaugeGradientStop3 = new GaugeGradientStop();
-
- gaugeGradientStop3.Value = 60;
-
- gaugeGradientStop3.Color = Color.FromArgb(0xff, 0xfe, 0xdd, 0x2b);
-
- linearScale.GradientStops.Add(gaugeGradientStop3);
-
- GaugeGradientStop gaugeGradientStop4 = new GaugeGradientStop();
-
- gaugeGradientStop4.Value = 100;
-
- gaugeGradientStop4.Color = Color.FromArgb(0xff, 0xe8, 0x78, 0x13);
-
- linearScale.GradientStops.Add(gaugeGradientStop4);
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+
+GaugeGradientStop gaugeGradientStop = new GaugeGradientStop();
+gaugeGradientStop.Value = 10;
+gaugeGradientStop.Color = Color.FromArgb(0xff, 0x51, 0xc9, 0xe1);
+linearScale.GradientStops.Add(gaugeGradientStop);
+
+GaugeGradientStop gaugeGradientStop1 = new GaugeGradientStop();
+gaugeGradientStop1.Value = 40;
+gaugeGradientStop1.Color = Color.FromArgb(0xff, 0x93, 0xe9, 0xe1);
+linearScale.GradientStops.Add(gaugeGradientStop1);
+
+GaugeGradientStop gaugeGradientStop2 = new GaugeGradientStop();
+gaugeGradientStop2.Value = 50;
+gaugeGradientStop2.Color = Color.FromArgb(0xff, 0xc5, 0xe6, 0x92);
+linearScale.GradientStops.Add(gaugeGradientStop2);
+
+GaugeGradientStop gaugeGradientStop3 = new GaugeGradientStop();
+gaugeGradientStop3.Value = 60;
+gaugeGradientStop3.Color = Color.FromArgb(0xff, 0xfe, 0xdd, 0x2b);
+linearScale.GradientStops.Add(gaugeGradientStop3);
+
+GaugeGradientStop gaugeGradientStop4 = new GaugeGradientStop();
+gaugeGradientStop4.Value = 100;
+gaugeGradientStop4.Color = Color.FromArgb(0xff, 0xe8, 0x78, 0x13);
+linearScale.GradientStops.Add(gaugeGradientStop4);
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/linear-gauge/Ticks.md b/chart-sdk/uwp/linear-gauge/Ticks.md
index a1e9b3c64..5594adbf9 100644
--- a/chart-sdk/uwp/linear-gauge/Ticks.md
+++ b/chart-sdk/uwp/linear-gauge/Ticks.md
@@ -1,79 +1,62 @@
---
layout: post
-title: Ticks in UWP Linear Gauge control | Syncfusion
-description: Learn here all about Ticks support in Syncfusion UWP Linear Gauge (SfLinearGauge) control and more.
+title: Ticks in UWP Linear Gauge | Syncfusion®
+description: Ticks in the UWP Linear Gauge indicate scale intervals and support customization of size, position, style, and appearance settings.
platform: chart-sdk
-control: SfCLinearGauge
+control: SfLinearGauge
documentation: ug
---
-# Ticks in UWP Linear Gauge (SfLinearGauge)
+# Ticks in UWP Linear Gauge
-Ticks are used to identify the gauge’s data value by marking the gauge scale in regular increments.
+Ticks are used to identify the gauge's data value by marking the gauge scale in regular increments.
## Tick customization
-By setting the [`MajorTickStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MajorTickStroke) and [`MinorTickStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MinorTickStroke) properties, the stroke of the major ticks and minor ticks can be customized. Using the [`MajorTickStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MajorTickStrokeThickness) and [`MinorTickStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MinorTickStrokeThickness), the stroke thickness of the major ticks and minor ticks can be customized. The size of the major ticks and minor ticks can be modified using the [`MajorTickSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MajorTickSize) and [`MinorTickSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MinorTickSize) properties.
+By setting the [`MajorTickStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MajorTickStroke) and [`MinorTickStroke`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MinorTickStroke) properties, the stroke of the major ticks and minor ticks can be customized. Using the [`MajorTickStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MajorTickStrokeThickness) and [`MinorTickStrokeThickness`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MinorTickStrokeThickness) properties, the stroke thickness of the major ticks and minor ticks can be customized. The size of the major ticks and minor ticks can be modified using the [`MajorTickSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MajorTickSize) and [`MinorTickSize`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MinorTickSize) properties.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.SkyBlue);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Brown);
-
- linearScale.MinorTickStrokeThickness = 1;
-
- linearScale.MajorTickStrokeThickness = 2;
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.SkyBlue);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Brown);
+linearScale.MinorTickStrokeThickness = 1;
+linearScale.MajorTickStrokeThickness = 2;
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting position for tick
-The ticks in the scale can be placed above, below, or in between the scale by choosing one of the following options available in the [`TickPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_TickPosition) property:
+The ticks in the scale can be placed above, below, or across the scale by choosing one of the following options available in the [`TickPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_TickPosition) property:
1. Above
2. Below (Default)
@@ -83,108 +66,76 @@ The ticks in the scale can be placed above, below, or in between the scale by ch
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.TickPosition = LinearTicksPosition.Above;
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 3;
-
- sfLinearGauge.MainScale = linearScale;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.TickPosition = LinearTicksPosition.Above;
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 3;
+sfLinearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Setting minor ticks per interval
-The [`Interval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_Interval) property is used to calculate the tick counts for a scale. Like ticks, minor ticks can also be calculated by using the [`MinorTicksPerInterval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MinorTicksPerInterval) property.
+The [`Interval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_Interval) property is used to calculate the tick counts for a scale. Like ticks, minor ticks can also be calculated using the [`MinorTicksPerInterval`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearScale.html#Syncfusion_UI_Xaml_Gauges_LinearScale_MinorTicksPerInterval) property.
{% tabs %}
{% highlight xml %}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge sfLinearGauge = new SfLinearGauge();
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MinorTickSize = 12;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.MinorTicksPerInterval = 4;
+SfLinearGauge sfLinearGauge = new SfLinearGauge();
+LinearScale linearScale = new LinearScale();
+linearScale.LabelSize = 15;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.MajorTickSize = 25;
+linearScale.MinorTickSize = 12;
+linearScale.ScaleBarLength = 300;
+linearScale.MinorTicksPerInterval = 4;
+sfLinearGauge.MainScale = linearScale;
- sfLinearGauge.MainScale = linearScale;
-
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/linear-gauge/annotations.md b/chart-sdk/uwp/linear-gauge/annotations.md
index 6ec1253b9..82b4d63d1 100644
--- a/chart-sdk/uwp/linear-gauge/annotations.md
+++ b/chart-sdk/uwp/linear-gauge/annotations.md
@@ -1,209 +1,137 @@
---
-
layout: post
-title: Annotations in UWP Linear Gauge control | Syncfusion
-description: Learn here all about Annotations support in Syncfusion UWP Linear Gauge (SfLinearGauge) control and more.
+title: Annotations in UWP Linear Gauge | Syncfusion®
+description: Annotations in the UWP Linear Gauge enable custom content to be displayed at specific positions, enhancing data presentation and visualization.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
-
---
-# Annotations in UWP Linear Gauge (SfLinearGauge)
+# Annotations in UWP Linear Gauge
-[`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) supports [`Annotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_Annotations) , which is used to mark the specific area of interest in the gauge area with texts, shapes, or images. You can add any number of annotations to the gauge.
+The [`SfLinearGauge`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html) supports [`Annotations`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.SfLinearGauge.html#Syncfusion_UI_Xaml_Gauges_SfLinearGauge_Annotations), which is used to mark the specific area of interest in the gauge area with texts, shapes, or images. You can add any number of annotations to the gauge.
-## Annotation
+## Annotation
-By using the `ContentTemplate` property of annotation object, you can specify the new element that needs to be displayed in the gauge area.
+By using the [`ContentTemplate`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_ContentTemplate) property of the annotation object, you can specify the new element that needs to be displayed in the gauge area.
{% tabs %}
{% highlight xaml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge linearGauge = new SfLinearGauge();
-
- LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation.OffsetX = 0.5;
-
- linearGaugeAnnotation.OffsetY = 0.4;
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "" + "";
-
- content += "";
-
- linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation);
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.ScaleBarStroke =new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MajorTickStroke =new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickSize = 15;
-
- linearGauge.MainScale = linearScale;
+SfLinearGauge linearGauge = new SfLinearGauge();
+LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
+linearGaugeAnnotation.OffsetX = 0.5;
+linearGaugeAnnotation.OffsetY = 0.4;
+var content = "";
+content += "";
+content += "";
+content += "" + "";
+content += "";
+linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
+
+linearGauge.Annotations.Add(linearGaugeAnnotation);
+LinearScale linearScale = new LinearScale();
+linearScale.ScaleBarLength = 300;
+linearScale.ScaleBarStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.LabelSize = 15;
+linearScale.MajorTickSize = 25;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickSize = 15;
+linearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
-## Positioning the annotation
+## Positioning the annotation
-You can place the annotation anywhere in gauge area by using the `Offset` or `ScaleValue` property.
+You can place the annotation anywhere in the gauge area by using the [`OffsetX`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_OffsetX) and [`OffsetY`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_OffsetY) properties, or by using the [`ScaleValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_ScaleValue) property.
### Change annotation position by using offset
-You can position the annotation anywhere in the linear gauge by using the [`OffsetX`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_OffsetX) and [`OffsetY`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_OffsetY) properties. It ranges from 0 to 1.
+You can position the annotation anywhere in the linear gauge by using the [`OffsetX`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_OffsetX) and [`OffsetY`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_OffsetY) properties. It ranges from 0 to 1.
{% tabs %}
{% highlight xaml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
+
-
-
+
{% endhighlight %}
{% highlight c# %}
-
- SfLinearGauge linearGauge = new SfLinearGauge();
-
- LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation.OffsetX = 0.5;
-
- linearGaugeAnnotation.OffsetY = 0.6;
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "" + "";
-
- content += "";
-
- linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation);
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.ScaleBarStroke =new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MajorTickStroke =new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickSize = 15;
-
- linearGauge.MainScale = linearScale;
-
+SfLinearGauge linearGauge = new SfLinearGauge();
+LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
+linearGaugeAnnotation.OffsetX = 0.5;
+linearGaugeAnnotation.OffsetY = 0.6;
+var content = "";
+content += "";
+content += "";
+content += "" + "";
+content += "";
+linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
+linearGauge.Annotations.Add(linearGaugeAnnotation);
+
+LinearScale linearScale = new LinearScale();
+linearScale.ScaleBarLength = 300;
+linearScale.ScaleBarStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.LabelSize = 15;
+linearScale.MajorTickSize = 25;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickSize = 15;
+linearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
-### Change annotation position by using scale value
+### Change annotation position by using scale value
You can also place the annotation by specifying the [`ScaleValue`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_ScaleValue) property.
@@ -211,248 +139,150 @@ You can also place the annotation by specifying the [`ScaleValue`](https://help.
{% highlight xaml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge linearGauge = new SfLinearGauge();
-
- LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation.ScaleValue = 60;
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "" + "";
-
- content += "";
-
- linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation);
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Minimum = 0;
-
- linearScale.Maximum = 90;
-
- linearScale.ScaleBarSize = 30;
-
- linearScale.Interval = 10;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.ScaleBarStroke =new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MajorTickStroke =new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickSize = 15;
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.BarPointer;
-
- linearPointer.Value = 60;
-
- linearPointer.BarPointerStrokeThickness = 20;
-
- linearPointer.CornerRadius = new CornerRadius(0,10,10,0);
-
- linearPointer.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf9, 0x5c, 0x85));
-
- linearScale.Pointers.Add(linearPointer);
-
- linearGauge.MainScale = linearScale;
-
+SfLinearGauge linearGauge = new SfLinearGauge();
+LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
+linearGaugeAnnotation.ScaleValue = 60;
+var content = "";
+content += "";
+content += "";
+content += "" + "";
+content += "";
+linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
+linearGauge.Annotations.Add(linearGaugeAnnotation);
+
+LinearScale linearScale = new LinearScale();
+linearScale.Minimum = 0;
+linearScale.Maximum = 90;
+linearScale.ScaleBarSize = 30;
+linearScale.Interval = 10;
+linearScale.ScaleBarLength = 300;
+linearScale.ScaleBarStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.LabelSize = 15;
+linearScale.MajorTickSize = 25;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickSize = 15;
+LinearPointer linearPointer = new LinearPointer();
+linearPointer.PointerType = LinearPointerType.BarPointer;
+linearPointer.Value = 60;
+linearPointer.BarPointerStrokeThickness = 20;
+linearPointer.CornerRadius = new CornerRadius(0, 10, 10, 0);
+linearPointer.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf9, 0x5c, 0x85));
+linearScale.Pointers.Add(linearPointer);
+linearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
-## Set margin to the annotation
+## Set margin to the annotation
-You can adjust the annotation by specifying the [`ViewMargin`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_ViewMargin) property in pixel, which adjusts the annotation element from its current position.
+You can adjust the annotation by specifying the [`ViewMargin`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_ViewMargin) property in pixels, which adjusts the annotation element from its current position.
{% tabs %}
{% highlight xaml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge linearGauge = new SfLinearGauge();
-
- LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation.ScaleValue = 60;
-
- linearGaugeAnnotation.ViewMargin = new Point(10, 60);
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "" + "";
-
- content += "";
-
- linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation);
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Minimum = 0;
-
- linearScale.Maximum = 90;
-
- linearScale.ScaleBarSize = 30;
-
- linearScale.Interval = 10;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.ScaleBarStroke =new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MajorTickStroke =new SolidColorBrush(Colors.Gray);
+SfLinearGauge linearGauge = new SfLinearGauge();
+LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
+linearGaugeAnnotation.ScaleValue = 60;
+linearGaugeAnnotation.ViewMargin = new Point(10, 60);
+var content = "";
+content += "";
+content += "";
+content += "" + "";
+content += "";
+linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
+linearGauge.Annotations.Add(linearGaugeAnnotation);
+
+LinearScale linearScale = new LinearScale();
+linearScale.Minimum = 0;
+linearScale.Maximum = 90;
+linearScale.ScaleBarSize = 30;
+linearScale.Interval = 10;
+linearScale.ScaleBarLength = 300;
+linearScale.ScaleBarStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.LabelSize = 15;
+linearScale.MajorTickSize = 25;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickSize = 15;
+LinearPointer linearPointer = new LinearPointer();
+linearPointer.PointerType = LinearPointerType.BarPointer;
+linearPointer.Value = 60;
+linearPointer.BarPointerStrokeThickness = 20;
+linearPointer.CornerRadius = new CornerRadius(0, 10, 10, 0);
+linearPointer.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf9, 0x5c, 0x85));
+linearScale.Pointers.Add(linearPointer);
+linearGauge.MainScale = linearScale;
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickSize = 15;
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.BarPointer;
-
- linearPointer.Value = 60;
-
- linearPointer.BarPointerStrokeThickness = 20;
-
- linearPointer.CornerRadius = new CornerRadius(0,10,10,0);
-
- linearPointer.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf9, 0x5c, 0x85));
-
- linearScale.Pointers.Add(linearPointer);
-
- linearGauge.MainScale = linearScale;
-
{% endhighlight %}
{% endtabs %}
-
+
-## Alignment of annotation
+## Alignment of annotation
-You can align the annotation using the [`HorizontalPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_HorizontalPosition) and [`VerticalPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_VerticalPosition) properties.
+You can align the annotation using the [`HorizontalPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_HorizontalPosition) and [`VerticalPosition`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Gauges.LinearGaugeAnnotation.html#Syncfusion_UI_Xaml_Gauges_LinearGaugeAnnotation_VerticalPosition) properties.
### Setting horizontal position
@@ -460,124 +290,72 @@ You can align the annotation using the [`HorizontalPosition`](https://help.syncf
{% highlight xaml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge linearGauge = new SfLinearGauge();
-
- LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation.ScaleValue = 60;
-
- linearGaugeAnnotation.HorizontalPosition = ViewAlignment.Start;
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "" + "";
-
- content += "";
-
- linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation);
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.Minimum = 0;
-
- linearScale.Maximum = 90;
-
- linearScale.ScaleBarSize = 30;
-
- linearScale.Interval = 10;
-
- linearScale.ScaleBarStroke =new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MajorTickStroke =new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickSize = 15;
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.BarPointer;
-
- linearPointer.Value = 60;
-
- linearPointer.BarPointerStrokeThickness = 20;
-
- linearPointer.CornerRadius = new CornerRadius(0,10,10,0);
-
- linearPointer.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf9, 0x5c, 0x85));
-
- linearScale.Pointers.Add(linearPointer);
-
- linearGauge.MainScale = linearScale;
-
+SfLinearGauge linearGauge = new SfLinearGauge();
+LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
+linearGaugeAnnotation.ScaleValue = 60;
+linearGaugeAnnotation.HorizontalPosition = ViewAlignment.Start;
+var content = "";
+content += "";
+content += "";
+content += "" + "";
+content += "";
+linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
+linearGauge.Annotations.Add(linearGaugeAnnotation);
+
+LinearScale linearScale = new LinearScale();
+linearScale.ScaleBarLength = 300;
+linearScale.Minimum = 0;
+linearScale.Maximum = 90;
+linearScale.ScaleBarSize = 30;
+linearScale.Interval = 10;
+linearScale.ScaleBarStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.LabelSize = 15;
+linearScale.MajorTickSize = 25;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickSize = 15;
+LinearPointer linearPointer = new LinearPointer();
+linearPointer.PointerType = LinearPointerType.BarPointer;
+linearPointer.Value = 60;
+linearPointer.BarPointerStrokeThickness = 20;
+linearPointer.CornerRadius = new CornerRadius(0, 10, 10, 0);
+linearPointer.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf9, 0x5c, 0x85));
+linearScale.Pointers.Add(linearPointer);
+linearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
### Setting vertical position
@@ -585,124 +363,73 @@ You can align the annotation using the [`HorizontalPosition`](https://help.syncf
{% highlight xaml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge linearGauge = new SfLinearGauge();
-
- LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation.ScaleValue = 60;
-
- linearGaugeAnnotation.VerticalPosition = ViewAlignment.Center;
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "" + "";
-
- content += "";
-
- linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation);
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Minimum = 0;
-
- linearScale.Maximum = 90;
-
- linearScale.ScaleBarSize = 30;
-
- linearScale.Interval = 10;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.ScaleBarStroke =new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
-
- linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
-
- linearScale.LabelSize = 15;
-
- linearScale.MajorTickSize = 25;
-
- linearScale.MajorTickStroke =new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
-
- linearScale.MinorTickSize = 15;
-
- LinearPointer linearPointer = new LinearPointer();
-
- linearPointer.PointerType = LinearPointerType.BarPointer;
-
- linearPointer.Value = 60;
-
- linearPointer.BarPointerStrokeThickness = 20;
-
- linearPointer.CornerRadius = new CornerRadius(0,10,10,0);
-
- linearPointer.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf9, 0x5c, 0x85));
-
- linearScale.Pointers.Add(linearPointer);
-
- linearGauge.MainScale = linearScale;
-
+SfLinearGauge linearGauge = new SfLinearGauge();
+LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
+linearGaugeAnnotation.ScaleValue = 60;
+linearGaugeAnnotation.VerticalPosition = ViewAlignment.Center;
+var content = "";
+content += "";
+content += "";
+content += "" + "";
+content += "";
+linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
+linearGauge.Annotations.Add(linearGaugeAnnotation);
+
+LinearScale linearScale = new LinearScale();
+linearScale.Minimum = 0;
+linearScale.Maximum = 90;
+linearScale.ScaleBarSize = 30;
+linearScale.Interval = 10;
+linearScale.ScaleBarLength = 300;
+linearScale.ScaleBarStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xe0, 0xe0, 0xe0));
+linearScale.LabelStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x42, 0x42, 0x42));
+linearScale.LabelSize = 15;
+linearScale.MajorTickSize = 25;
+linearScale.MajorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickStroke = new SolidColorBrush(Colors.Gray);
+linearScale.MinorTickSize = 15;
+LinearPointer linearPointer = new LinearPointer();
+
+linearPointer.PointerType = LinearPointerType.BarPointer;
+linearPointer.Value = 60;
+linearPointer.BarPointerStrokeThickness = 20;
+linearPointer.CornerRadius = new CornerRadius(0, 10, 10, 0);
+linearPointer.BarPointerStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf9, 0x5c, 0x85));
+linearScale.Pointers.Add(linearPointer);
+linearGauge.MainScale = linearScale;
{% endhighlight %}
{% endtabs %}
-
+
## Multiple annotations
@@ -712,334 +439,180 @@ You can add multiple annotations to the gauge as demonstrated below.
{% highlight xaml %}
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
-
-
+
{% endhighlight %}
{% highlight c# %}
- SfLinearGauge linearGauge = new SfLinearGauge();
-
- LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation.ScaleValue = 75;
-
- linearGaugeAnnotation.ViewMargin = new Point(0, 30);
-
- var content = "";
-
- content += "";
-
- content += "";
-
- content += "";
-
- content += "";
-
- content += "" + "" + "";
-
- content += "";
-
- linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation);
-
- LinearGaugeAnnotation linearGaugeAnnotation1 = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation1.ScaleValue = 45;
-
- linearGaugeAnnotation1.ViewMargin = new Point(0, 30);
-
- var content1 = "";
-
- content1 += "";
-
- content1 += "";
-
- content1 += "";
-
- content1 += "";
-
- content1 += "" + "" + "";
-
- content1 += "";
-
- linearGaugeAnnotation1.ContentTemplate = (DataTemplate)XamlReader.Load(content1);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation1);
-
- LinearGaugeAnnotation linearGaugeAnnotation2 = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation2.ScaleValue = 15;
-
- linearGaugeAnnotation2.ViewMargin = new Point(0, 30);
-
- var content2 = "";
-
- content2 += "";
-
- content2 += "";
-
- content2 += "";
-
- content2 += "";
-
- content2 += "" + "" + "";
-
- content2 += "";
-
- linearGaugeAnnotation2.ContentTemplate = (DataTemplate)XamlReader.Load(content2);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation2);
-
- LinearGaugeAnnotation linearGaugeAnnotation3 = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation3.ScaleValue = 70;
-
- linearGaugeAnnotation3.ViewMargin = new Point(0, 80);
-
- var content3 = "";
-
- content3 += "";
-
- content3 += "";
-
- content3 += "" + "";
-
- content3 += "";
-
- linearGaugeAnnotation3.ContentTemplate = (DataTemplate)XamlReader.Load(content3);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation3);
-
- LinearGaugeAnnotation linearGaugeAnnotation4 = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation4.ScaleValue = 40;
-
- linearGaugeAnnotation4.ViewMargin = new Point(0, 80);
-
- var content4 = "";
-
- content4 += "";
-
- content4 += "";
-
- content4 += "" + "";
-
- content4 += "";
-
- linearGaugeAnnotation4.ContentTemplate = (DataTemplate)XamlReader.Load(content4);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation4);
-
- LinearGaugeAnnotation linearGaugeAnnotation5 = new LinearGaugeAnnotation();
-
- linearGaugeAnnotation5.ScaleValue = 10;
-
- linearGaugeAnnotation5.ViewMargin = new Point(0, 80);
-
- var content5 = "";
-
- content5 += "";
-
- content5 += "";
-
- content5 += "" + "";
-
- content5 += "";
-
- linearGaugeAnnotation5.ContentTemplate = (DataTemplate)XamlReader.Load(content5);
-
- linearGauge.Annotations.Add(linearGaugeAnnotation5);
-
- LinearScale linearScale = new LinearScale();
-
- linearScale.Minimum = 0;
-
- linearScale.Maximum = 90;
-
- linearScale.ScaleBarSize = 30;
-
- linearScale.Interval = 10;
-
- linearScale.ShowLabels = false;
-
- linearScale.ScaleBarStroke = new SolidColorBrush(Colors.Transparent);
-
- linearScale.MinorTicksPerInterval = 1;
-
- linearScale.ScaleBarLength = 300;
-
- linearScale.ShowTicks = false;
-
- linearScale.ScaleDirection = LinearScaleDirection.Backward;
-
- linearGauge.MainScale = linearScale;
-
- LinearRange linearRange = new LinearRange();
-
- linearRange.StartValue = 0;
-
- linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x30, 0xb3, 0x2d));
-
- linearRange.EndValue = 30;
-
- linearRange.StartWidth = 60;
-
- linearRange.EndWidth = 60;
-
- linearScale.Ranges.Add(linearRange);
-
- LinearRange linearRange1 = new LinearRange();
-
- linearRange1.StartValue = 30;
-
- linearRange1.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xff, 0xdd, 0x00));
-
- linearRange1.EndValue = 60;
-
- linearRange1.StartWidth = 60;
-
- linearRange1.EndWidth = 60;
-
- linearScale.Ranges.Add(linearRange1);
-
- LinearRange linearRange2 = new LinearRange();
-
- linearRange2.StartValue = 60;
-
- linearRange2.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf0, 0x3e, 0x3e));
-
- linearRange2.EndValue = 90;
-
- linearRange2.StartWidth = 60;
-
- linearRange2.EndWidth = 60;
-
- linearScale.Ranges.Add(linearRange2);
+SfLinearGauge linearGauge = new SfLinearGauge();
+LinearGaugeAnnotation linearGaugeAnnotation = new LinearGaugeAnnotation();
+linearGaugeAnnotation.ScaleValue = 75;
+linearGaugeAnnotation.ViewMargin = new Point(0, 30);
+var content = "";
+content += "";
+content += "";
+content += "";
+content += "";
+content += "" + "" + "";
+content += "";
+linearGaugeAnnotation.ContentTemplate = (DataTemplate)XamlReader.Load(content);
+linearGauge.Annotations.Add(linearGaugeAnnotation);
+
+LinearGaugeAnnotation linearGaugeAnnotation1 = new LinearGaugeAnnotation();
+linearGaugeAnnotation1.ScaleValue = 45;
+linearGaugeAnnotation1.ViewMargin = new Point(0, 30);
+var content1 = "";
+content1 += "";
+content1 += "";
+content1 += "";
+content1 += "";
+content1 += "" + "" + "";
+content1 += "";
+linearGaugeAnnotation1.ContentTemplate = (DataTemplate)XamlReader.Load(content1);
+linearGauge.Annotations.Add(linearGaugeAnnotation1);
+
+LinearGaugeAnnotation linearGaugeAnnotation2 = new LinearGaugeAnnotation();
+linearGaugeAnnotation2.ScaleValue = 15;
+linearGaugeAnnotation2.ViewMargin = new Point(0, 30);
+var content2 = "";
+content2 += "";
+content2 += "";
+content2 += "";
+content2 += "";
+content2 += "" + "" + "";
+content2 += "";
+linearGaugeAnnotation2.ContentTemplate = (DataTemplate)XamlReader.Load(content2);
+linearGauge.Annotations.Add(linearGaugeAnnotation2);
+
+LinearGaugeAnnotation linearGaugeAnnotation3 = new LinearGaugeAnnotation();
+linearGaugeAnnotation3.ScaleValue = 70;
+linearGaugeAnnotation3.ViewMargin = new Point(0, 80);
+var content3 = "";
+content3 += "";
+content3 += "";
+content3 += "" + "";
+content3 += "";
+linearGaugeAnnotation3.ContentTemplate = (DataTemplate)XamlReader.Load(content3);
+linearGauge.Annotations.Add(linearGaugeAnnotation3);
+
+LinearGaugeAnnotation linearGaugeAnnotation4 = new LinearGaugeAnnotation();
+linearGaugeAnnotation4.ScaleValue = 40;
+linearGaugeAnnotation4.ViewMargin = new Point(0, 80);
+var content4 = "";
+content4 += "";
+content4 += "";
+content4 += "" + "";
+content4 += "";
+linearGaugeAnnotation4.ContentTemplate = (DataTemplate)XamlReader.Load(content4);
+linearGauge.Annotations.Add(linearGaugeAnnotation4);
+
+LinearGaugeAnnotation linearGaugeAnnotation5 = new LinearGaugeAnnotation();
+linearGaugeAnnotation5.ScaleValue = 10;
+linearGaugeAnnotation5.ViewMargin = new Point(0, 80);
+var content5 = "";
+content5 += "";
+content5 += "";
+content5 += "" + "";
+content5 += "";
+linearGaugeAnnotation5.ContentTemplate = (DataTemplate)XamlReader.Load(content5);
+linearGauge.Annotations.Add(linearGaugeAnnotation5);
+LinearScale linearScale = new LinearScale();
+linearScale.Minimum = 0;
+linearScale.Maximum = 90;
+linearScale.ScaleBarSize = 30;
+linearScale.Interval = 10;
+linearScale.ShowLabels = false;
+linearScale.ScaleBarStroke = new SolidColorBrush(Colors.Transparent);
+linearScale.MinorTicksPerInterval = 1;
+linearScale.ScaleBarLength = 300;
+linearScale.ShowTicks = false;
+linearScale.ScaleDirection = LinearScaleDirection.Backward;
+linearGauge.MainScale = linearScale;
+LinearRange linearRange = new LinearRange();
+linearRange.StartValue = 0;
+linearRange.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0x30, 0xb3, 0x2d));
+linearRange.EndValue = 30;
+linearRange.StartWidth = 60;
+linearRange.EndWidth = 60;
+linearScale.Ranges.Add(linearRange);
+LinearRange linearRange1 = new LinearRange();
+linearRange1.StartValue = 30;
+linearRange1.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xff, 0xdd, 0x00));
+linearRange1.EndValue = 60;
+linearRange1.StartWidth = 60;
+linearRange1.EndWidth = 60;
+linearScale.Ranges.Add(linearRange1);
+LinearRange linearRange2 = new LinearRange();
+linearRange2.StartValue = 60;
+linearRange2.RangeStroke = new SolidColorBrush(Color.FromArgb(0xff, 0xf0, 0x3e, 0x3e));
+linearRange2.EndValue = 90;
+linearRange2.StartWidth = 60;
+linearRange2.EndWidth = 60;
+linearScale.Ranges.Add(linearRange2);
{% endhighlight %}
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/pivot-chart/Common/Adornments.md b/chart-sdk/uwp/pivot-chart/Common/Adornments.md
index f9385bf70..2688d9788 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Adornments.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Adornments.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Adornments in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Adornments support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Adornments in UWP Pivot Chart | Syncfusion®
+description: Adornments in the UWP Pivot Chart display additional information for data points and support customization of labels, symbols, and appearance.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Adornments in UWP Pivot Chart (SfPivotChart)
+# Adornments in UWP Pivot Chart
Adornments are used to display data values of a chart segment with custom formatting options. The data point values (x,y) can be formatted by using the [`AdornmentsInfo`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotChart.PivotChartAdornmentsInfo.html) property of the SfPivotChart. You can initialize the adornments as specified in the following code snippet.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Animation.md b/chart-sdk/uwp/pivot-chart/Common/Animation.md
index 468831043..b350b6b5e 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Animation.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Animation.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Animation in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Animation support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Animation in UWP Pivot Chart | Syncfusion®
+description: Animation in the UWP Pivot Chart enables smooth transitions for chart series and data points, enhancing data visualization and user experience.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Animation in UWP Pivot Chart (SfPivotChart)
+# Animation in UWP Pivot Chart
The SfPivotChart allows you to animate the chart series when loading and changing the data source. An animation in the chart can be enabled by setting the [`EnableAnimation`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotChart.SfPivotChart.html#Syncfusion_UI_Xaml_PivotChart_SfPivotChart_EnableAnimation) property to true and defining the corresponding animation speed with the [`AnimationDuration`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotChart.SfPivotChart.html#Syncfusion_UI_Xaml_PivotChart_SfPivotChart_AnimationDuration) property.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Annotations.md b/chart-sdk/uwp/pivot-chart/Common/Annotations.md
index 166b98db4..67c5e5670 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Annotations.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Annotations.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Annotations in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Annotations support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Annotations in UWP Pivot Chart | Syncfusion®
+description: Annotations in the UWP Pivot Chart display custom content within the chart area and support flexible positioning for enhanced data visualization.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Annotations in UWP Pivot Chart (SfPivotChart)
+# Annotations in UWP Pivot Chart
The SfPivotChart supports annotations that allow you to mark a specific area of interest in the chart area. You can draw custom shapes, specify a text note, and add images with the help of annotations.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Appearance.md b/chart-sdk/uwp/pivot-chart/Common/Appearance.md
index ac5d3b077..0adf2c707 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Appearance.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Appearance.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Appearance in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Appearance support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Appearance in UWP Pivot Chart | Syncfusion®
+description: Appearance in the UWP Pivot Chart allows you to customize chart visuals using palettes, colors, themes, and styling options.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Appearance in UWP Pivot Chart (SfPivotChart)
+# Appearance in UWP Pivot Chart
The SfPivotChart supports customizing the default appearance of the control. You can customize the default style of the control by modifying its properties as specified in the following code snippet.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Axis.md b/chart-sdk/uwp/pivot-chart/Common/Axis.md
index f77ed30a8..1fc7bb4eb 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Axis.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Axis.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Axis in UWP Pivot Chart control | Syncfusion
-description: Learn about axis support in Syncfusion® UWP Pivot Chart (SfPivotChart), including axis configuration and customization features.
+title: Axis in UWP Pivot Chart | Syncfusion®
+description: Axis in the UWP Pivot Chart defines data scales, categories, and value ranges, supporting customization and effective data visualization.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Axis in UWP Pivot Chart (SfPivotChart)
+# Axis in UWP Pivot Chart
Axis is used to locate a data point inside the chart area. Generally, two axes are required along each direction to locate the data point in the chart, i.e., horizontal and vertical. The vertical axis (y-axis) represents numerical values and the horizontal axis (x-axis) represents categorical values.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Chart-Types.md b/chart-sdk/uwp/pivot-chart/Common/Chart-Types.md
index ce4b1e1e9..b4c3875e1 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Chart-Types.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Chart-Types.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Chart Types in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Chart Types support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Types in UWP Pivot Chart | Syncfusion®
+description: Types in the UWP Pivot Chart provide multiple visualization options for presenting and analyzing summarized data effectively.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Chart Types in UWP Pivot Chart (SfPivotChart)
+# Types in UWP Pivot Chart
The SfPivotChart offers different types of charts ranging from column chart to pie chart. Based on your requirements and specifications, any type of chart can be used for data visualization.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Exporting.md b/chart-sdk/uwp/pivot-chart/Common/Exporting.md
index b25a1d395..f2837af24 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Exporting.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Exporting.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Exporting in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Exporting support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Exporting in UWP Pivot Chart | Syncfusion®
+description: Exporting in the UWP Pivot Chart enables chart data and visuals to be saved in supported formats for sharing, reporting, and analysis.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Exporting in UWP Pivot Chart (SfPivotChart)
+# Exporting in UWP Pivot Chart
The SfPivotChart can be exported to an image, Microsoft Word, and PDF file formats. To perform exporting operation, refer to the following assembly in the application:
diff --git a/chart-sdk/uwp/pivot-chart/Common/Legend.md b/chart-sdk/uwp/pivot-chart/Common/Legend.md
index 32751ea84..f9d5f0a05 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Legend.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Legend.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Legend in UWP Pivot Chart control | Syncfusion
-description: Learn about legend support in Syncfusion® UWP Pivot Chart (SfPivotChart), including customization, positioning, and display options.
+title: Legend in UWP Pivot Chart | Syncfusion®
+description: Legend in the UWP Pivot Chart identifies data series and chart elements, supporting customization, positioning, and display options.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Legend in UWP Pivot Chart (SfPivotChart)
+# Legend in UWP Pivot Chart
Legend displays the metadata that helps to identify the data series in the chart. Legend contains a group of legend items based on the series and each legend item is composed of icon, check box, and label.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Localization.md b/chart-sdk/uwp/pivot-chart/Common/Localization.md
index 916bbc264..ccb99091c 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Localization.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Localization.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Localization in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Localization support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Localization in UWP Pivot Chart | Syncfusion®
+description: Localization in the UWP Pivot Chart enables chart content and user interface elements to be displayed in different languages and regional settings.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Localization in UWP Pivot Chart (SfPivotChart)
+# Localization in UWP Pivot Chart
Localization is the key feature to provide software solutions targeted at global users. The SfPivotChart allows users to localize the control to a specific locale and supports “resx” based localization.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Palette.md b/chart-sdk/uwp/pivot-chart/Common/Palette.md
index eb8b72e30..cbda9776d 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Palette.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Palette.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Palette in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Palette support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Palette in UWP Pivot Chart | Syncfusion®
+description: Palette in the UWP Pivot Chart customizes series colors using predefined and custom color collections for enhanced data visualization.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Palette in UWP Pivot Chart (SfPivotChart)
+# Palette in UWP Pivot Chart
A pre-defined collection or a set of colors can be applied to the chart series. Palette can be used to provide a rich look for your business applications.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Theming.md b/chart-sdk/uwp/pivot-chart/Common/Theming.md
index 861e83ebc..9b504541a 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Theming.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Theming.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Theming in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Theming support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Theming in UWP Pivot Chart | Syncfusion®
+description: Theming in the UWP Pivot Chart applies consistent visual styles to chart elements, enabling customized appearance and enhanced presentation.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Theming in UWP Pivot Chart (SfPivotChart)
+# Theming in UWP Pivot Chart
Theming is the process of applying particular settings to visual elements of the control. Following built-in themes are supported in the SfPivotChart control.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Tooltip.md b/chart-sdk/uwp/pivot-chart/Common/Tooltip.md
index ca6a4fb12..4a326453b 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Tooltip.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Tooltip.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Tooltip in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Tooltip support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Tooltip in UWP Pivot Chart | Syncfusion®
+description: Tooltip in the UWP Pivot Chart displays detailed information about data points and supports customization of content and appearance.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Tooltip in UWP Pivot Chart (SfPivotChart)
+# Tooltip in UWP Pivot Chart
The SfPivotChart provides tooltip support by which the series information such as measure, x-axis values, y-axis values, and series name can be displayed over the chart area, when the mouse pointer is moved over chart points.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Watermark.md b/chart-sdk/uwp/pivot-chart/Common/Watermark.md
index 6107165ef..d5718d531 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Watermark.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Watermark.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Watermark in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Watermark support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Watermark in UWP Pivot Chart | Syncfusion®
+description: Watermark in the UWP Pivot Chart displays custom text or images in the chart background, supporting branding and visual customization.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Watermark in UWP Pivot Chart (SfPivotChart)
+# Watermark in UWP Pivot Chart
The SfPivotChart supports watermark that is used to add text or images to the chart area. The major application of watermark is to define the copyright information of users it belongs to.
diff --git a/chart-sdk/uwp/pivot-chart/Common/Zooming-Panning.md b/chart-sdk/uwp/pivot-chart/Common/Zooming-Panning.md
index 3e8faf508..c92bedb68 100644
--- a/chart-sdk/uwp/pivot-chart/Common/Zooming-Panning.md
+++ b/chart-sdk/uwp/pivot-chart/Common/Zooming-Panning.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Zooming and Panning in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Zooming and Panning support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Zooming and Panning in UWP Pivot Chart | Syncfusion®
+description: Zooming and panning in the UWP Pivot Chart enable interactive navigation of data, allowing users to explore and analyze chart content in detail.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Zooming and Panning in UWP Pivot Chart (SfPivotChart)
+# Zooming and Panning in UWP Pivot Chart
The SfPivotChart allows you to zoom in, zoom out, and pan the chart area with the help of this support. Zooming is used to view the in-depth information of a specific chart area, when there are a large number of data points inside the chart. Panning is used to navigate the chart area.
diff --git a/chart-sdk/uwp/pivot-chart/OLAP/Drill-Operation.md b/chart-sdk/uwp/pivot-chart/OLAP/Drill-Operation.md
index 8c3ee0c9a..dbc7bb4e0 100644
--- a/chart-sdk/uwp/pivot-chart/OLAP/Drill-Operation.md
+++ b/chart-sdk/uwp/pivot-chart/OLAP/Drill-Operation.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Drill Operation in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Drill Operation support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Drill Operation in UWP Pivot Chart | Syncfusion®
+description: Drill operation in the UWP Pivot Chart enables users to expand and collapse hierarchical data levels for detailed analysis and exploration.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Drill Operation in UWP Pivot Chart (SfPivotChart)
+# Drill Operation in UWP Pivot Chart
This is the basic feature of SfPivotChart through which the amount of information can be limited for a better view. It allows you to drill down to access the detailed level of data or drill up to see the summarized data by using the expanders present in primary axis labels.
diff --git a/chart-sdk/uwp/pivot-chart/OLAP/Getting-Started.md b/chart-sdk/uwp/pivot-chart/OLAP/Getting-Started.md
index a1ff7d85a..67eedf4fe 100644
--- a/chart-sdk/uwp/pivot-chart/OLAP/Getting-Started.md
+++ b/chart-sdk/uwp/pivot-chart/OLAP/Getting-Started.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Getting Started with UWP Pivot Chart control | Syncfusion®
-description: This page explains how to set up and configure the Pivot Chart (SfPivotChart) control in a UWP application.
+title: Getting Started with UWP Pivot Chart | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Pivot Chart control. Explore setup, configuration, features, and customization options.
platform: chart-sdk
control: SfPivotChart
documentation: ug
diff --git a/chart-sdk/uwp/pivot-chart/OLAP/KPI.md b/chart-sdk/uwp/pivot-chart/OLAP/KPI.md
index 1b82e5fc0..f5656e908 100644
--- a/chart-sdk/uwp/pivot-chart/OLAP/KPI.md
+++ b/chart-sdk/uwp/pivot-chart/OLAP/KPI.md
@@ -1,13 +1,13 @@
---
layout: post
-title: KPI in UWP Pivot Chart control | Syncfusion
-description: Learn about KPI support in Syncfusion® UWP Pivot Chart (SfPivotChart), including visualization options and performance indicators.
+title: KPI in UWP Pivot Chart | Syncfusion®
+description: KPI in the UWP Pivot Chart displays key performance indicators, enabling effective monitoring, comparison, and analysis of business metrics.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# KPI in UWP Pivot Chart (SfPivotChart)
+# KPI in UWP Pivot Chart
KPI (Key Performance Indicator) is a business metric that helps to figure out the progress of an enterprise in meeting its business goals. It is a collection of calculations that are associated with a measure group in a cube. Typically, these calculations are a combination of multi-dimensional expressions (MDX) or calculated members. KPIs also have additional metadata that provides information about how the applications should display the results of KPIs calculations.
diff --git a/chart-sdk/uwp/pivot-chart/OLAP/Paging.md b/chart-sdk/uwp/pivot-chart/OLAP/Paging.md
index 49b58759c..248a25121 100644
--- a/chart-sdk/uwp/pivot-chart/OLAP/Paging.md
+++ b/chart-sdk/uwp/pivot-chart/OLAP/Paging.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Paging in UWP Pivot Chart control | Syncfusion
-description: Learn about paging support in Syncfusion® UWP Pivot Chart (SfPivotChart), including navigation, configuration, and data management.
+title: Paging in UWP Pivot Chart | Syncfusion®
+description: Paging in the UWP Pivot Chart enables efficient navigation through large datasets, supporting data management and improved performance.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Paging in UWP Pivot Chart (SfPivotChart)
+# Paging in UWP Pivot Chart
The SfPivotChart supports loading and rendering large amounts of data without any performance constraint.
diff --git a/chart-sdk/uwp/pivot-chart/Overview.md b/chart-sdk/uwp/pivot-chart/Overview.md
index eadd3ad6d..09cb0c6e2 100644
--- a/chart-sdk/uwp/pivot-chart/Overview.md
+++ b/chart-sdk/uwp/pivot-chart/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About UWP Pivot Chart control | Syncfusion
-description: Learn here all about introduction of Syncfusion® UWP Pivot Chart (SfPivotChart) control, its elements and more.
+title: About Syncfusion® UWP Pivot Chart Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Pivot Chart control, its features, capabilities, and more details.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# UWP Pivot Chart (SfPivotChart) Overview
+# About Syncfusion® UWP Pivot Chart Control
The SfPivotChart control provides a variety of charting features that allow you to visualize data from both OLAP and relational data sources with rich customization. It has built-in support for drill-down and drill-up.
diff --git a/chart-sdk/uwp/pivot-chart/Relational/Getting-Started.md b/chart-sdk/uwp/pivot-chart/Relational/Getting-Started.md
index cc1bb487f..578a982b2 100644
--- a/chart-sdk/uwp/pivot-chart/Relational/Getting-Started.md
+++ b/chart-sdk/uwp/pivot-chart/Relational/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting Started with UWP Pivot Chart control | Syncfusion
-description: Learn here all about getting started with Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Getting Started with UWP Pivot Chart | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Pivot Chart control. Explore setup, configuration, features, and customization options.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Getting Started with UWP Pivot Chart (SfPivotChart)
+# Getting Started with UWP Pivot Chart
>**Important**
Starting with v16.2.0.x, if you refer to Syncfusion® assemblies from trial setup or from the NuGet feed, include a license key in your projects. Refer to this [link](https://help.syncfusion.com/common/essential-studio/licensing/license-key) to learn about registering Syncfusion® license key in your UWP application to use the components.
diff --git a/chart-sdk/uwp/pivot-chart/Relational/Serialization-and-Deserialization.md b/chart-sdk/uwp/pivot-chart/Relational/Serialization-and-Deserialization.md
index 784e06a67..290b708c1 100644
--- a/chart-sdk/uwp/pivot-chart/Relational/Serialization-and-Deserialization.md
+++ b/chart-sdk/uwp/pivot-chart/Relational/Serialization-and-Deserialization.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Serialization and Deserialization in UWP Pivot Chart control | Syncfusion
-description: Learn here all about Serialization and Deserialization support in Syncfusion® UWP Pivot Chart (SfPivotChart) control and more.
+title: Serialization and Deserialization in UWP Pivot Chart | Syncfusion®
+description: Serialization and deserialization in the UWP Pivot Chart enable saving and restoring chart state, configuration, and pivot data settings.
platform: chart-sdk
control: SfPivotChart
documentation: ug
---
-# Serialization and Deserialization in UWP Pivot Chart (SfPivotChart)
+# Serialization and Deserialization in UWP Pivot Chart
This support allows you to serialize and deserialize the settings of SfPivotChart control using [DataContractSerializer](https://msdn.microsoft.com/en-in/library/system.runtime.serialization.datacontractserializer.aspx).
diff --git a/chart-sdk/uwp/pivot-gauge/Common/Appearance.md b/chart-sdk/uwp/pivot-gauge/Common/Appearance.md
index 68777eeb7..b22173aa1 100644
--- a/chart-sdk/uwp/pivot-gauge/Common/Appearance.md
+++ b/chart-sdk/uwp/pivot-gauge/Common/Appearance.md
@@ -1,17 +1,17 @@
---
layout: post
-title: Appearance in UWP Pivot Gauge control | Syncfusion
-description: Learn here all about Appearance support in Syncfusion UWP Pivot Gauge (SfPivotGauge) control and more.
+title: Appearance in UWP Pivot Gauge | Syncfusion®
+description: Appearance in the UWP Pivot Gauge allows you to customize gauge visuals using themes, colors, styles, and layout options.
platform: chart-sdk
control: SfPivotGauge
documentation: ug
---
-# Appearance in UWP Pivot Gauge (SfPivotGauge)
+# Appearance in UWP Pivot Gauge
## Layout customization
-The SfPivotGauge supports displaying the multiple gauges in a structured layout using the `RowsCount` and `ColumnsCount` properties. These properties specify the number of rows and columns required to display the control.
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) supports displaying multiple gauges in a structured layout using the [RowsCount](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_RowsCount) and [ColumnsCount](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_ColumnsCount) properties. These properties specify the number of rows and columns required to display the control.
{% tabs %}
@@ -19,8 +19,7 @@ The SfPivotGauge supports displaying the multiple gauges in a structured layout
-
+ PivotColumns="{Binding PivotColumns}" PivotCalculations="{Binding PivotCalculations}"/>
{% endhighlight %}
@@ -40,11 +39,11 @@ PivotGauge1.ColumnsCount = 2
{% endtabs %}
-
+
## Gauge radius
-The SfPivotGauge supports adjusting its radius by assigning a proper value to its `Radius` property. The following code snippet illustrates how to modify the radius of the SfPivotGauge.
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) supports adjusting its radius by assigning a proper value to its [Radius](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_Radius) property. The following code snippet illustrates how to modify the radius of the SfPivotGauge.
{% tabs %}
@@ -52,8 +51,7 @@ The SfPivotGauge supports adjusting its radius by assigning a proper value to it
-
+ PivotColumns="{Binding PivotColumns}" PivotCalculations="{Binding PivotCalculations}"/>
{% endhighlight %}
@@ -71,11 +69,11 @@ PivotGauge1.Radius = 75
{% endtabs %}
-
+
## Gauge header
-The gauge header is a combination of details about the calculation and KPI. The header components of the SfPivotGauge can be hidden by using the `ShowGaugeHeader` property as specified in the following code snippet.
+The gauge header is a combination of details about the calculation and KPI. The header components of the [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) can be hidden by using the [ShowGaugeHeaders](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_ShowGaugeFactors) property, as specified in the following code snippet.
{% tabs %}
@@ -83,8 +81,7 @@ The gauge header is a combination of details about the calculation and KPI. The
-
+ PivotColumns="{Binding PivotColumns}" PivotCalculations="{Binding PivotCalculations}"/>
{% endhighlight %}
@@ -102,11 +99,11 @@ PivotGauge1.ShowGaugeHeaders = False
{% endtabs %}
-
+
## Gauge label
-The visibility of gauge labels displayed inside the gauge can be toggled with the help of `ShowGaugeLabels` property. The following code snippet shows how to hide labels of the SfPivotGauge.
+The visibility of gauge labels displayed inside the gauge can be toggled with the help of the [ShowGaugeLabels](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_ShowGaugeLabels) property. The following code snippet shows how to hide the labels of the SfPivotGauge.
{% tabs %}
@@ -114,8 +111,7 @@ The visibility of gauge labels displayed inside the gauge can be toggled with th
-
+ PivotColumns="{Binding PivotColumns}" PivotCalculations="{Binding PivotCalculations}"/>
{% endhighlight %}
@@ -133,11 +129,11 @@ PivotGauge1.ShowGaugeLabels = False
{% endtabs %}
-
+
## Gauge factor
-The gauge factor component can be hidden by using the `ShowGaugeFactors` property as specified in the following code snippet.
+The gauge factor component can be hidden by using the [ShowGaugeFactors](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_ShowGaugeFactors) property, as specified in the following code snippet.
{% tabs %}
@@ -145,8 +141,7 @@ The gauge factor component can be hidden by using the `ShowGaugeFactors` propert
-
+ PivotColumns="{Binding PivotColumns}" PivotCalculations="{Binding PivotCalculations}"/>
{% endhighlight %}
@@ -164,4 +159,4 @@ PivotGauge1.ShowGaugeFactors = False
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/pivot-gauge/Common/Localization.md b/chart-sdk/uwp/pivot-gauge/Common/Localization.md
index 9dae31fbd..d81530f88 100644
--- a/chart-sdk/uwp/pivot-gauge/Common/Localization.md
+++ b/chart-sdk/uwp/pivot-gauge/Common/Localization.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Localization in UWP Pivot Gauge control | Syncfusion
-description: Learn here all about Localization support in Syncfusion UWP Pivot Gauge (SfPivotGauge) control and more.
+title: Localization in UWP Pivot Gauge | Syncfusion®
+description: Localization in the UWP Pivot Gauge enables gauge content and user interface elements to be displayed in different languages and regional settings.
platform: chart-sdk
control: SfPivotGauge
documentation: ug
---
-# Localization in UWP Pivot Gauge (SfPivotGauge)
+# Localization in UWP Pivot Gauge
-Localization is a key feature to provide software solutions targeted at global users. The SfPivotGauge allows users to localize the control to a specific locale and supports “resx” based localization.
+Localization is a key feature to provide software solutions targeted at global users. The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) allows users to localize the control to a specific locale and supports "resx" based localization.
You should perform the following steps to localize the control:
@@ -27,23 +27,23 @@ N> The localization key field should be the same for all locales. Do not transla
After translating the strings that can be localized:
-1. Right-click the project file to create a new folder in the project. Select **Add > New Folder** and rename the folder “Resources”.
+1. Right-click the project file to create a new folder in the project. Select **Add > New Folder** and rename the folder "Resources".
2. Right-click the **Resources** folder to create a new resource file. Go to **Add > New Item**.
-
+
-
+
-N> The resource file name should be in the format “<Culture Code>.resx”.
+N> The resource file name should be in the format "<Culture Code>.resx".
3. Copy and paste the translated locale to the resource file created in the previous step.
## Culture specification
-You should specify the CurrentUICulture in the Application_Startup method of App.xaml.cs file or the constructor of the MainPage.xaml.cs file.
+You should specify the CurrentUICulture in the `Application_Startup` method of the App.xaml.cs file or the constructor of the MainPage.xaml.cs file.
-N> If you are specifying the current culture in the constructor of main page, ensure that the culture is specified before calling the InitializeComponent() method.
+N> If you are specifying the current culture in the constructor of the main page, ensure that the culture is specified before calling the `InitializeComponent()` method.
{% tabs %}
@@ -76,7 +76,7 @@ End Class
## RTL
-The SfPivotGauge provides RTL support to display the content from right to left by setting the `FlowDirection` property to **RightToLeft**.
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) provides RTL support to display the content from right to left by setting the `FlowDirection` property to **RightToLeft**.
{% tabs %}
@@ -84,12 +84,11 @@ The SfPivotGauge provides RTL support to display the content from right to left
-
+ PivotColumns="{Binding PivotColumns}" PivotCalculations="{Binding PivotCalculations}"/>
{% endhighlight %}
-{% highlight C# %}
+{% highlight c# %}
PivotGauge1.FlowDirection = FlowDirection.RightToLeft;
@@ -103,7 +102,7 @@ PivotGauge1.FlowDirection = FlowDirection.RightToLeft
{% endtabs %}
-
+
A demo sample is available in the following location.
diff --git a/chart-sdk/uwp/pivot-gauge/Common/Localization_images/Localization-step1.png b/chart-sdk/uwp/pivot-gauge/Common/Localization_images/Localization-step1.png
index d80db3435..1f9a283a3 100644
Binary files a/chart-sdk/uwp/pivot-gauge/Common/Localization_images/Localization-step1.png and b/chart-sdk/uwp/pivot-gauge/Common/Localization_images/Localization-step1.png differ
diff --git a/chart-sdk/uwp/pivot-gauge/Common/Theming.md b/chart-sdk/uwp/pivot-gauge/Common/Theming.md
index ee4e2f288..e28e45514 100644
--- a/chart-sdk/uwp/pivot-gauge/Common/Theming.md
+++ b/chart-sdk/uwp/pivot-gauge/Common/Theming.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Theming in UWP Pivot Gauge control | Syncfusion
-description: Learn here all about Theming support in Syncfusion UWP Pivot Gauge (SfPivotGauge) control and more.
+title: Theming in UWP Pivot Gauge | Syncfusion®
+description: Theming in the UWP Pivot Gauge applies built-in visual styles, enabling customization of gauge appearance and consistent user experiences.
platform: chart-sdk
control: SfPivotGauge
documentation: ug
---
-# Theming in UWP Pivot Gauge (SfPivotGauge)
+# Theming in UWP Pivot Gauge
-Theming is the process of applying particular settings to visual elements of a control. Following built-in themes are supported in the SfPivotGauge control:
+Theming is the process of applying particular settings to visual elements of a control. The following built-in themes are supported in the [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control:
* Blend
* Lime
@@ -28,7 +28,7 @@ Theming is the process of applying particular settings to visual elements of a c
* VisualStudio2013
* VisualStudio2015
-By using the `GaugeVisualStyle` property in the SfPivotGauge, you can set the visual style of the control. By default, the `Metro` theme is applied. The following code snippet shows how to change the visual style for the SfPivotChart.
+By using the [GaugeVisualStyle](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_GaugeVisualStyle) property in the SfPivotGauge, you can set the visual style of the control. By default, the `Metro` theme is applied. The following code snippet shows how to change the visual style for the SfPivotGauge.
{% tabs %}
@@ -36,8 +36,7 @@ By using the `GaugeVisualStyle` property in the SfPivotGauge, you can set the vi
-
+ PivotColumns="{Binding PivotColumns}" PivotCalculations="{Binding PivotCalculations}"/>
{% endhighlight %}
@@ -55,4 +54,4 @@ PivotGauge1.GaugeVisualStyle = PivotGaugeVisualStyle.Blend;
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/pivot-gauge/Common/Tooltip.md b/chart-sdk/uwp/pivot-gauge/Common/Tooltip.md
index f39816840..cbf95ac29 100644
--- a/chart-sdk/uwp/pivot-gauge/Common/Tooltip.md
+++ b/chart-sdk/uwp/pivot-gauge/Common/Tooltip.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Tooltip in UWP Pivot Gauge control | Syncfusion
-description: Learn here all about Tooltip support in Syncfusion UWP Pivot Gauge (SfPivotGauge) control and more.
+title: Tooltip in UWP Pivot Gauge | Syncfusion®
+description: Tooltip in the UWP Pivot Gauge displays detailed information about gauge values and supports interactive data analysis and visualization.
platform: chart-sdk
control: SfPivotGauge
documentation: ug
---
-# Tooltip in UWP Pivot Gauge (SfPivotGauge)
+# Tooltip in UWP Pivot Gauge
-The SfPivotGauge provides the information about values when the mouse pointer is moved over the gauge. The following code snippet illustrates how to show a tooltip by using the `ShowGaugeTooltip` property.
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) provides the information about values when the mouse pointer is moved over the gauge. The following code snippet illustrates how to show a tooltip by using the [ShowGaugeTooltip](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_ShowGaugeTooltip) property.
{% tabs %}
@@ -17,8 +17,7 @@ The SfPivotGauge provides the information about values when the mouse pointer is
-
+ PivotColumns="{Binding PivotColumns}" PivotCalculations="{Binding PivotCalculations}"/>
{% endhighlight %}
@@ -36,4 +35,4 @@ PivotGauge1.ShowGaugeTooltip = True
{% endtabs %}
-
+
diff --git a/chart-sdk/uwp/pivot-gauge/OLAP/Getting-Started.md b/chart-sdk/uwp/pivot-gauge/OLAP/Getting-Started.md
index 761cf0aec..76e6933d2 100644
--- a/chart-sdk/uwp/pivot-gauge/OLAP/Getting-Started.md
+++ b/chart-sdk/uwp/pivot-gauge/OLAP/Getting-Started.md
@@ -1,32 +1,32 @@
---
layout: post
-title: Getting Started with UWP Pivot Gauge control | Syncfusion
-description: Learn here all about getting started with Syncfusion UWP Pivot Gauge (SfPivotGauge) control and more.
+title: Getting Started with UWP OLAP Pivot Gauge | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP OLAP Pivot Gauge control. Explore setup, OLAP data binding, report configuration, and customization.
platform: chart-sdk
control: SfPivotGauge
documentation: ug
---
-# Getting Started with UWP Pivot Gauge (SfPivotGauge)
+# Getting Started with UWP OLAP Pivot Gauge
>**Important**
-To start with v16.2.0.x, if you refer to Syncfusion assemblies from trial setup or NuGet feed, include a license key in your projects. Refer to this [link](https://help.syncfusion.com/common/essential-studio/licensing/license-key) to learn about registering Syncfusion license key in your UWP application to use the components.
+To start with v16.2.0.x, if you refer to Syncfusion assemblies from trial setup or NuGet feed, include a license key in your projects. Refer to this [link](https://help.syncfusion.com/common/essential-studio/licensing/license-key) to learn about registering a Syncfusion license key in your UWP application to use the components.
-This section explains the information required to create a simple SfPivotGauge control bound to the OLAP data source and a WCF service that helps you to bind the OLAP data with the SfPivotGauge control through the OlapDataManager.
+This section explains the information required to create a simple [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control bound to the OLAP data source and a WCF service that helps you to bind the OLAP data with the SfPivotGauge control through the [OlapDataManager](https://help.syncfusion.com/cr/uwp/Syncfusion.Olap.UWP.Manager.OlapDataManager.html).
## Initializing SfPivotGauge control
1. Open Visual Studio IDE and select **File > New > Project** to open a new project dialog.
-2. Select **Installed > Templates > Visual C# > Windows > Universal > Blank APP(Universal Windows)** to create a new UWP application and name the project "SfPivotGaugeDemo".
+2. Select **Installed > Templates > Visual C# > Windows > Universal > Blank App (Universal Windows)** to create a new UWP application and name the project "SfPivotGaugeDemo".
-The target version/minimum version dialog appears, in which you can change the target version of the application as **"Windows 10 (10.0; Build 10240)".**
+The target version/minimum version dialog appears, in which you can change the target version of the application to **"Windows 10 (10.0; Build 10240)"**.
The SfPivotGauge control can be initialized and added to the application through any of the following ways:
-1. Designer
-2. XAML
-3. Code-behind
+1. Designer.
+2. XAML.
+3. Code-behind.
### Adding control through designer
@@ -36,11 +36,11 @@ The SfPivotGauge control can be initialized and added to the application through
Now, the SfPivotGauge control will be added to the designer as follows.
-
+
### Adding control through XAML
-The SfPivotGauge control can be added to the project by referencing assemblies or extension SDK as described below:
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control can be added to the project by referencing assemblies or extension SDK as described below:
**Assembly reference**
@@ -112,7 +112,7 @@ xmlns:PivotGauge="using:Syncfusion.UI.Xaml.PivotGauge"
### Adding control through code-behind
-The SfPivotGauge control can be added to the project by referencing assemblies or extension SDK.
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control can be added to the project by referencing assemblies or extension SDK.
**Assembly reference**
@@ -126,7 +126,7 @@ The SfPivotGauge control can be added to the project by referencing assemblies o
* Syncfusion.SfGauge.UWP
* Syncfusion.SfPivotGauge.UWP
-YN> You can find these libraries under the following location.
+N> You can find these libraries under the following location.
<Installed Drive>:\Program Files (x86)\Syncfusion\Essential Studio\\<Version>\Assemblies for Universal Windows\10.0
**Extension SDK reference**
@@ -221,26 +221,26 @@ End Namespace
## Adding service reference to project
-N> This section explains how to refer to the online service in UWP application for binding the cube information in the SfPivotGauge. The service URL used here refers to the demo cube - “Adventure Works”, mainly used for illustration purpose.
+N> This section explains how to refer to the online service in the UWP application for binding the cube information in the SfPivotGauge. The service URL used here refers to the demo cube - "Adventure Works", mainly used for illustration purposes.
To create your own WCF service, refer to the topic of [Creating WCF Service Application.](#creating-wcf-service-application).
After initializing the SfPivotGauge control, right-click the project in the solution explorer and select **Add > Service Reference...**.
-In “Add Service Reference” dialog, enter the following address and click **Go** to add the online service.
+In the "Add Service Reference" dialog, enter the following address and click **Go** to add the online service.
[http://bi.syncfusion.com/OlapUWPTestService/OlapManager.svc](http://bi.syncfusion.com/OlapUWPTestService/OlapManager.svc)
-Change the default namespace of service reference from "ServiceReference1" to "OlapManagerService", so that it will be easier to identify the OLAP service later. Finally, click **OK** to add the service reference.
+Change the default namespace of the service reference from "ServiceReference1" to "OlapManagerService", so that it will be easier to identify the OLAP service later. Finally, click **OK** to add the service reference.
-## Binding OLAP data to SfPivotGauge control
+## Binding OLAP data to [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control
### Defining OLAP report and OLAP data manager through view model
1. Right-click the project in the solution explorer and select **Add > New Item... > Class** to create a new class file. Then, name the class "OlapViewModel" and click **OK**.
-The following code snippet illustrates how to define OLAP data manager and OLAP report for the SfPivotGauge control.
+The following code snippet illustrates how to define the OLAP data manager and OLAP report for the [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control.
-N> The `OlapDataChanged` event should be hooked before assigning the current report to OLAP data manager.
+N> The `OlapDataChanged` event should be hooked before assigning the current report to the OLAP data manager.
{% tabs %}
@@ -512,27 +512,27 @@ End Namespace
### Binding OLAP data manager with SfPivotGauge control
-The OLAP data can be bound with SfPivotGauge control by using the `OlapDataManager` property through any of the following ways:
+The OLAP data can be bound with the [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control by using the [OlapDataManager](https://help.syncfusion.com/cr/uwp/Syncfusion.Olap.UWP.Manager.OlapDataManager.html) property through any of the following ways:
* XAML
* Code-behind
**Through XAML**
-The following code snippet explains how to bind the OLAP data mentioned in the *OlapViewModel* to the SfPivotGauge control with the help of `DataContext` in XAML.
+The following code snippet explains how to bind the OLAP data mentioned in the *OlapViewModel* to the [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control with the help of `DataContext` in XAML.
{% tabs %}
{% highlight xaml %}
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+ xmlns:local="using:SfPivotGaugeDemo"
+ xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+ xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+ xmlns:PivotGauge="using:Syncfusion.UI.Xaml.PivotGauge"
+ x:Class="SfPivotGaugeDemo.MainPage"
+ mc:Ignorable="d">
@@ -548,7 +548,7 @@ The following code snippet explains how to bind the OLAP data mentioned in the *
**Through code-behind**
-The following code snippet illustrates how to bind the OLAP data to the SfPivotGauge control in code-behind.
+The following code snippet illustrates how to bind the OLAP data to the [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control in code-behind.
{% tabs %}
@@ -600,8 +600,7 @@ End Namespace
Finally, run the application to generate the following output.
-
-
+
## Creating WCF service application
@@ -617,13 +616,13 @@ Finally, run the application to generate the following output.
N> You can find these libraries under the following location.
<Installed Drive>:\Program Files (x86)\Syncfusion\Essential Studio\\<Version>\Assemblies\4.6\
-I> ADOMD.NET assembly (Microsoft.AnalysisServices.AdomdClient.dll) is required to create a SfPivotGauge control.
+I> ADOMD.NET assembly (Microsoft.AnalysisServices.AdomdClient.dll) is required to create an SfPivotGauge control.
The above assembly can be obtained only after installing the following setup files:
**SQLSERVER2008_ASADOMD10.msi** and **SQLSERVER2008_ASOLEDB10.msi**
-These setup files can be downloaded at [Microsoft download center](https://www.microsoft.com/en-in/download/details.aspx?id=44277).
-If you have installed any version of SQL Server Analysis Service (SSAS) or Microsoft ADOMD.NET utility, then the location of Microsoft.AnalysisServices.AdomdClient library is [system drive:\Program Files (x86)\Microsoft.NET\ADOMD.NET].
+These setup files can be downloaded at the [Microsoft download center](https://www.microsoft.com/en-in/download/details.aspx?id=44277).
+If you have installed any version of SQL Server Analysis Service (SSAS) or Microsoft ADOMD.NET utility, then the location of the Microsoft.AnalysisServices.AdomdClient library is [system drive:\Program Files (x86)\Microsoft.NET\ADOMD.NET].
-Now, the "Service1.svc" looks like:
+Now, the "Service1.svc" file looks like the following.
{% tabs %}
@@ -635,7 +634,7 @@ Now, the "Service1.svc" looks like:
{% endtabs %}
-Double-click the "Service1.svc" file in the solution explorer and replace the existing code with the exact following code.
+Double-click the "Service1.svc" file in the solution explorer and replace the existing code with the following code.
{% tabs %}
@@ -820,7 +819,7 @@ End Namespace
{% endtabs %}
-N> Here, the sample cube path is specified for demonstration purpose. You can modify the connection string as desired.
+N> Here, the sample cube path is specified for demonstration purposes. You can modify the connection string as desired.
Then, include the basic HTTP binding and service endpoint address in the web.config file by replacing the following code snippet of the *"serviceModel"* section.
@@ -830,27 +829,27 @@ Then, include the basic HTTP binding and service endpoint address in the web.con
-
-
-
-
-
-
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -859,11 +858,11 @@ Then, include the basic HTTP binding and service endpoint address in the web.con
-
-
-
-
-
+
+
+
+
+
@@ -871,4 +870,4 @@ Then, include the basic HTTP binding and service endpoint address in the web.con
{% endtabs %}
-Then, build and host the WCF service in IIS. Refer to the hosted URL as service reference in your Universal Windows Platform (UWP) application (client application). This is how you can host the service in IIS and refer to the obtained URL as service reference in the sample as illustrated in the [previous section](#adding-service-reference-to-project).
\ No newline at end of file
+Then, build and host the WCF service in IIS. Refer to the hosted URL as a service reference in your Universal Windows Platform (UWP) application (client application). This is how you can host the service in IIS and refer to the obtained URL as a service reference in the sample, as illustrated in the [previous section](#adding-service-reference-to-project).
\ No newline at end of file
diff --git a/chart-sdk/uwp/pivot-gauge/OLAP/KPI.md b/chart-sdk/uwp/pivot-gauge/OLAP/KPI.md
index 6d4397b84..7110e3fe1 100644
--- a/chart-sdk/uwp/pivot-gauge/OLAP/KPI.md
+++ b/chart-sdk/uwp/pivot-gauge/OLAP/KPI.md
@@ -1,17 +1,17 @@
---
layout: post
-title: KPI in UWP Pivot Gauge control | Syncfusion
-description: Learn here all about KPI support in Syncfusion UWP Pivot Gauge (SfPivotGauge) control and more.
+title: KPI in UWP Pivot Gauge | Syncfusion®
+description: KPI in the UWP Pivot Gauge displays key performance indicators using values, goals, status indicators, and trend icons for business analysis.
platform: chart-sdk
control: SfPivotGauge
documentation: ug
---
-# KPI in UWP Pivot Gauge (SfPivotGauge)
+# KPI in UWP Pivot Gauge
-The SfPivotGauge supports displaying Key Performance Indicators (KPIs) from the OLAP cube. The KPI value is viewed with the help of pointers, and KPI goal is viewed with the help of markers. The KPI status and KPI trend values are represented through user friendly images like traffic light, road signs, and standard arrow. Each gauge in the SfPivotGauge represents a member against one KPI combination.
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) supports displaying Key Performance Indicators (KPIs) from the OLAP cube. The KPI value is viewed with the help of pointers, and the KPI goal is viewed with the help of markers. The KPI status and KPI trend values are represented through user-friendly images like traffic lights, road signs, and standard arrows. Each gauge in the SfPivotGauge represents a member against one KPI combination.
-
+
A demo sample is available in the following location.
diff --git a/chart-sdk/uwp/pivot-gauge/Overview.md b/chart-sdk/uwp/pivot-gauge/Overview.md
index 5ddd3e1c9..b7443ad9f 100644
--- a/chart-sdk/uwp/pivot-gauge/Overview.md
+++ b/chart-sdk/uwp/pivot-gauge/Overview.md
@@ -1,25 +1,25 @@
---
layout: post
-title: About UWP Pivot Gauge control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Pivot Gauge (SfPivotGauge) control, its elements and more.
+title: About Syncfusion® UWP Pivot Gauge Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Pivot Gauge control, its features, capabilities, and more details.
platform: chart-sdk
control: SfPivotGauge
documentation: ug
---
-# UWP Pivot Gauge (SfPivotGauge) Overview
+# About Syncfusion® UWP Pivot Gauge Control
-The SfPivotGauge control for UWP is ideal for highlighting business critical Key Performance Indicator (KPI) information in executive dashboards and report cards. It allows you to present values against goals in a very intuitive manner. For relational data, the SfPivotGauge control allows you to visualize the summary value using the pointer over a circular scale. It comes with sophisticated customization support that provides endless possibility for customizing the control.
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control for UWP is ideal for highlighting business-critical Key Performance Indicator (KPI) information in executive dashboards and report cards. It allows you to present values against goals in a very intuitive manner. For relational data, the SfPivotGauge control allows you to visualize the summary value using the pointer over a circular scale. It comes with sophisticated customization support that provides endless possibilities for customizing the control.
## Key features
-The key features of **SfPivotGauge** control are listed as follows:
+The key features of the **SfPivotGauge** control are listed as follows:
-* **Data source**: Supports data binding with OLAP data source such as Microsoft SQL Server Analysis Services (SSAS) and XML/A and relational data source such as IList or IEnumerable.
-* **Multiple gauges and layouts**: Customizes the layout while rendering the multiple controls.
+* **Data source**: Supports data binding with OLAP data sources such as Microsoft SQL Server Analysis Services (SSAS) and XML/A, and relational data sources such as IList or IEnumerable.
+* **Multiple gauges and layouts**: Customizes the layout while rendering multiple controls.
* **Indicators**: Displays the active/inactive state of the SfPivotGauge control.
* **Ranges**: Highlights the range of values in the circular scale.
* **Pointers**: Points the actual value and goal information.
-* **Tooltip**: Displays value and goal information when hovering the mouse over pointers.
+* **Tooltip**: Displays value and goal information when hovering the mouse over the pointers.
* **Themes**: Supports different themes like Office 2010 Blue, Office 2010 Black, Office 365, and so on to customize the appearance.
* **Custom appearance**: Shows or hides the headers, factors, and labels as desired.
\ No newline at end of file
diff --git a/chart-sdk/uwp/pivot-gauge/Relational/Getting-Started.md b/chart-sdk/uwp/pivot-gauge/Relational/Getting-Started.md
index d622a4d26..a79ecc1c3 100644
--- a/chart-sdk/uwp/pivot-gauge/Relational/Getting-Started.md
+++ b/chart-sdk/uwp/pivot-gauge/Relational/Getting-Started.md
@@ -1,26 +1,26 @@
---
layout: post
-title: Getting Started with UWP Pivot Gauge control | Syncfusion
-description: Learn here all about getting started with Syncfusion UWP Pivot Gauge (SfPivotGauge) control and more.
+title: Getting Started with UWP Pivot Gauge | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Pivot Gauge control. Explore setup, configuration, data binding, and customization options.
platform: chart-sdk
control: SfPivotGauge
documentation: ug
---
-# Getting Started with UWP Pivot Gauge (SfPivotGauge)
+# Getting Started with UWP Pivot Gauge
>**Important**
To start with v16.2.0.x, if you refer to Syncfusion assemblies from trial setup or NuGet feed, include a license key in your projects. Refer to this [link](https://help.syncfusion.com/common/essential-studio/licensing/license-key) to learn about registering a Syncfusion license key in your UWP application to use the components.
-This section explains the steps required to create a simple SfPivotGauge control bound to a relational data source such as IList or IEnumerable.
+This section explains the steps required to create a simple [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control bound to a relational data source such as IList or IEnumerable.
## Initializing SfPivotGauge control
1. Open Visual Studio IDE and select **File > New > Project** to open the new project dialog.
-2. Select **Installed > Templates > Visual C# > Windows > Universal > Blank APP(Universal Windows)** to create a new UWP application and name the project as "SfPivotGaugeDemo".
+2. Select **Installed > Templates > Visual C# > Windows > Universal > Blank App (Universal Windows)** to create a new UWP application and name the project as "SfPivotGaugeDemo".
-The target version/minimum version dialog appears, in which you can change the target version of the application as **"Windows 10 (10.0; Build 10240)".**
+The target version/minimum version dialog appears, in which you can change the target version of the application to **"Windows 10 (10.0; Build 10240)"**.
The SfPivotGauge control can be initialized and added to the application through any of the following ways:
@@ -36,11 +36,11 @@ The SfPivotGauge control can be initialized and added to the application through
Now, the SfPivotGauge control will be added to the designer as follows.
-
+
### Adding control through XAML
-The SfPivotGauge control can be added to the project by referencing assemblies or SDK.
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control can be added to the project by referencing assemblies or SDK.
**Assembly reference**
@@ -113,7 +113,7 @@ xmlns:PivotGauge="using:Syncfusion.UI.Xaml.PivotGauge"
### Adding control through code-behind
-The SfPivotGauge control can be added to the project by referencing assemblies or SDK.
+The [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control can be added to the project by referencing assemblies or SDK.
**Assembly reference**
@@ -225,9 +225,9 @@ End Namespace
### Creating relational data through view model
-5. After initializing the SfPivotGauge control, right-click the project in the solution explorer and select **Add > New Item... > Class** to create a new class file.
+1. After initializing the SfPivotGauge control, right-click the project in the solution explorer and select **Add > New Item... > Class** to create a new class file.
-6. Then, name the class *ProductSalesViewModel* and click **OK**.
+2. Then, name the class *ProductSalesViewModel* and click **OK**.
The following code snippet illustrates how to define relational data for the SfPivotGauge.
@@ -332,7 +332,7 @@ Namespace SfPivotGaugeDemo
For i As Integer = 0 To numberOfRecords - 1
Dim sales As ProductSale = New ProductSale()
sales.Country = countries(r.[Next](1, countries.GetLength(0)))
- sales.Amount =(3000 * r.[Next](1, 12))
+ sales.Amount = (3000 * r.[Next](1, 12))
sales.Date = dates(r.[Next](r.[Next](dates.GetLength(0) + 1)))
sales.Product = products(r.[Next](r.[Next](products.GetLength(0) + 1)))
listOfProductSales.Add(sales)
@@ -358,31 +358,30 @@ End Namespace
{% endtabs %}
-### Defining item sSource, pivot rows, pivot columns and pivot calculations for SfPivotGauge control
+### Defining ItemSource, pivot rows, pivot columns and pivot calculations for SfPivotGauge control
-Relational data can be bound to SfPivotGauge control by using the `ItemSource` property through the following ways:
+Relational data can be bound to [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control by using the `ItemSource` property through the following ways:
* XAML
* Code-behind
**Through XAML**
-The relational data mentioned in the *ProductSalesViewModel* is bound to the SfPivotGauge control with the help of `DataContext`. In addition to this, the `PivotRows`, `PivotColumns`, and `PivotCalculations` should be assigned to SfPivotGauge for populating the data.
-
+The relational data mentioned in the *ProductSalesViewModel* is bound to the [SfPivotGauge](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html) control with the help of `DataContext`. In addition to this, the `PivotRows`, [PivotColumns](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_PivotColumns), and [PivotCalculations](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.PivotGauge.SfPivotGauge.html#Syncfusion_UI_Xaml_PivotGauge_SfPivotGauge_PivotCalculations) should be assigned to SfPivotGauge for populating the data.
{% tabs %}
{% highlight xaml %}
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+ xmlns:local="using:SfPivotGaugeDemo"
+ xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+ xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+ xmlns:PivotGauge="using:Syncfusion.UI.Xaml.PivotGauge"
+ xmlns:pivot="using:Syncfusion.PivotAnalysis.UWP"
+ x:Class="SfPivotGaugeDemo.MainPage"
+ mc:Ignorable="d">
@@ -491,4 +490,4 @@ End Namespace
Finally, run the application to generate the following output.
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/chart-sdk/uwp/smith-chart/Appearance.md b/chart-sdk/uwp/smith-chart/Appearance.md
index 084b5d7ab..513759415 100644
--- a/chart-sdk/uwp/smith-chart/Appearance.md
+++ b/chart-sdk/uwp/smith-chart/Appearance.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Appearance in UWP Smith Chart control | Syncfusion
-description: Learn here all about Appearance support in Syncfusion UWP Smith Chart (SfSmithChart) control and more.
+title: Appearance in UWP Smith Chart | Syncfusion®
+description: Appearance in the UWP Smith Chart allows you to customize chart elements, colors, styles, and visual settings for enhanced presentation.
platform: chart-sdk
control: SfSmithChart
documentation: ug
---
-# Appearance in UWP Smith Chart (SfSmithChart)
+# Appearance in UWP Smith Chart
## SmithChart palette
diff --git a/chart-sdk/uwp/smith-chart/Axes.md b/chart-sdk/uwp/smith-chart/Axes.md
index 1a5a2a1cf..8f40994e7 100644
--- a/chart-sdk/uwp/smith-chart/Axes.md
+++ b/chart-sdk/uwp/smith-chart/Axes.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Axes in UWP Smith Chart control | Syncfusion
-description: Learn here all about Axes support in Syncfusion Universal Windows Smith Chart (SfSmithChart) control and more.
+title: Axes in UWP Smith Chart | Syncfusion®
+description: Axes in the UWP Smith Chart define coordinate grids, scales, and labels to represent impedance and admittance data effectively.
platform: chart-sdk
control: SfSmithChart
documentation: ug
---
-# Axes in UWP Smith Chart (SfSmithChart)
+# Axes in UWP Smith Chart
Typically, the SmithChart has been used with two axes that are used to measure and categorize the data.
diff --git a/chart-sdk/uwp/smith-chart/Data-Markers.md b/chart-sdk/uwp/smith-chart/Data-Markers.md
index 29a3eba91..15c6b087e 100644
--- a/chart-sdk/uwp/smith-chart/Data-Markers.md
+++ b/chart-sdk/uwp/smith-chart/Data-Markers.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Data Markers in UWP Smith Chart control | Syncfusion
-description: Learn here all about Data Markers support in Syncfusion UWP Smith Chart (SfSmithChart) control and more.
+title: Data Markers in UWP Smith Chart | Syncfusion®
+description: Data markers in the UWP Smith Chart highlight individual data points with customizable shapes and styles for improved visualization.
platform: chart-sdk
control: SfSmithChart
documentation: ug
---
-# Data Markers in UWP Smith Chart (SfSmithChart)
+# Data Markers in UWP Smith Chart
Data markers are used to provide information about a data point to the user. You can add a shape and label to adorn each data point.
diff --git a/chart-sdk/uwp/smith-chart/Getting-Started.md b/chart-sdk/uwp/smith-chart/Getting-Started.md
index e7ee77174..984f25528 100644
--- a/chart-sdk/uwp/smith-chart/Getting-Started.md
+++ b/chart-sdk/uwp/smith-chart/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting Started with UWP Smith Chart control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP Smith Chart (SfSmithChart) control, its elements and more.
+title: Getting Started with UWP Smith Chart control | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Smith Chart control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfSmithChart
documentation: ug
---
-# Getting Started with UWP Smith Chart (SfSmithChart)
+# Getting Started with UWP Smith Chart control
This section explains the steps required to build an application with SfSmithChart.
diff --git a/chart-sdk/uwp/smith-chart/Legend.md b/chart-sdk/uwp/smith-chart/Legend.md
index 260ea07cd..ff4ca7069 100644
--- a/chart-sdk/uwp/smith-chart/Legend.md
+++ b/chart-sdk/uwp/smith-chart/Legend.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Legend in UWP Smith Chart control | Syncfusion
-description: Learn here all about Legend support in Syncfusion UWP Smith Chart (SfSmithChart) control and more.
+title: Legend in UWP Smith Chart | Syncfusion®
+description: Legend in the UWP Smith Chart identifies series and data categories, helping users understand and interpret chart information clearly.
platform: chart-sdk
control: SfSmithChart
documentation: ug
---
-# Legend in UWP Smith Chart (SfSmithChart)
+# Legend in UWP Smith Chart
The legend contains the list of chart series that appear in a SmithChart. It can be defined by using the following code example.
diff --git a/chart-sdk/uwp/smith-chart/Overview.md b/chart-sdk/uwp/smith-chart/Overview.md
index af4c52b03..4c816c6f9 100644
--- a/chart-sdk/uwp/smith-chart/Overview.md
+++ b/chart-sdk/uwp/smith-chart/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About UWP Smith Chart control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Smith Chart (SfSmithChart) control, its elements and more.
+title: About Syncfusion® UWP Smith Chart control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Smith Chart control, its features, capabilities, and more details.
platform: chart-sdk
control: SfSmithChart
documentation: ug
---
-# UWP Smith Chart (SfSmithChart) Overview
+# About Syncfusion® UWP Smith Chart control
Smith chart is one of the most useful data visualization tools for high-frequency circuit applications. It contains two sets of circles to plot the parameters of transmission lines.
diff --git a/chart-sdk/uwp/smith-chart/Rendering-Type.md b/chart-sdk/uwp/smith-chart/Rendering-Type.md
index b8232c483..b30e94297 100644
--- a/chart-sdk/uwp/smith-chart/Rendering-Type.md
+++ b/chart-sdk/uwp/smith-chart/Rendering-Type.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Rendering Type in UWP Smith Chart control | Syncfusion
-description: Learn here all about Rendering Type support in Syncfusion UWP Smith Chart (SfSmithChart) control and more.
+title: Rendering Type in UWP Smith Chart | Syncfusion®
+description: Rendering type in the UWP Smith Chart determines how series data is displayed, enabling different visualization styles and layouts.
platform: chart-sdk
control: SfSmithChart
documentation: ug
---
-# Rendering Type in UWP Smith Chart (SfSmithChart)
+# Rendering Type in UWP Smith Chart
SfSmithChart plots the transmission line in two different ways by using the [`RenderingType`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.SmithChart.SfSmithChart.html#Syncfusion_UI_Xaml_SmithChart_SfSmithChart_RenderingType) property. The two ways are given below.
diff --git a/chart-sdk/uwp/smith-chart/Series.md b/chart-sdk/uwp/smith-chart/Series.md
index e087afed8..f3ec9a487 100644
--- a/chart-sdk/uwp/smith-chart/Series.md
+++ b/chart-sdk/uwp/smith-chart/Series.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Series in UWP Smith Chart control | Syncfusion
-description: Learn here all about the Series support in the Syncfusion UWP Smith Chart (SfSmithChart) control and more.
+title: Series in UWP Smith Chart | Syncfusion®
+description: Series in the UWP Smith Chart define how data is visualized, enabling different series types and data representations.
platform: chart-sdk
control: series
documentation: ug
---
-# Series in UWP Smith Chart (SfSmithChart)
+# Series in UWP Smith Chart
Chart series is the visual representation of the given data.
diff --git a/chart-sdk/uwp/smith-chart/User-Interactions.md b/chart-sdk/uwp/smith-chart/User-Interactions.md
index 726a46046..7c5775ccb 100644
--- a/chart-sdk/uwp/smith-chart/User-Interactions.md
+++ b/chart-sdk/uwp/smith-chart/User-Interactions.md
@@ -1,13 +1,13 @@
---
layout: post
-title: User Interactions in UWP Smith Chart control | Syncfusion
-description: Learn here all about User Interactions support in Syncfusion UWP Smith Chart (SfSmithChart) control and more.
+title: User Interactions in UWP Smith Chart | Syncfusion®
+description: User interactions in the UWP Smith Chart enable selection, tooltips, and data exploration for enhanced chart analysis and navigation.
platform: chart-sdk
control: SfSmithChart
documentation: ug
---
-# User Interactions in UWP Smith Chart (SfSmithChart)
+# User Interactions in UWP Smith Chart
## Tooltip
diff --git a/chart-sdk/uwp/sunburst-chart/Animation.md b/chart-sdk/uwp/sunburst-chart/Animation.md
index 0cc6434b0..b3dddd4e2 100644
--- a/chart-sdk/uwp/sunburst-chart/Animation.md
+++ b/chart-sdk/uwp/sunburst-chart/Animation.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Animation in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Animation support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Animation in UWP Sunburst Chart | Syncfusion®
+description: Animation in the UWP Sunburst Chart provides smooth visual transitions for rendering hierarchical data and interactive updates.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Animation in UWP Sunburst Chart (SfSunburstChart)
+# Animation in UWP Sunburst Chart
Sunburst chart allows you to animate the chart segments. You can enable animation using [`EnableAnimation`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.SunburstChart.SfSunburstChart.html#Syncfusion_UI_Xaml_SunburstChart_SfSunburstChart_EnableAnimation) property. Also you can set the duration for animation by using [`AnimationDuration`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.SunburstChart.SfSunburstChart.html#Syncfusion_UI_Xaml_SunburstChart_SfSunburstChart_AnimationDuration) property.
diff --git a/chart-sdk/uwp/sunburst-chart/DataLabel.md b/chart-sdk/uwp/sunburst-chart/DataLabel.md
index df74c81f9..307084db2 100644
--- a/chart-sdk/uwp/sunburst-chart/DataLabel.md
+++ b/chart-sdk/uwp/sunburst-chart/DataLabel.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Data Label in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Data Label support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Data Label in UWP Sunburst Chart | Syncfusion®
+description: Data labels in the UWP Sunburst Chart display segment values and information directly on the chart for improved readability.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Data Label in UWP Sunburst Chart (SfSunburstChart)
+# Data Label in UWP Sunburst Chart
Sunburst data labels are used to display the data related to the segment. It helps to provide the information about the data points to the users.
diff --git a/chart-sdk/uwp/sunburst-chart/Events.md b/chart-sdk/uwp/sunburst-chart/Events.md
index 0ed4fbe05..7b9dacd67 100644
--- a/chart-sdk/uwp/sunburst-chart/Events.md
+++ b/chart-sdk/uwp/sunburst-chart/Events.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Events in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Events support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Events in UWP Sunburst Chart | Syncfusion®
+description: Events in the UWP Sunburst Chart enable you to respond to user interactions and customize chart behavior during runtime.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Events in UWP Sunburst Chart (SfSunburstChart)
+# Events in UWP Sunburst Chart
## SegmentCreated event
diff --git a/chart-sdk/uwp/sunburst-chart/Getting-Started.md b/chart-sdk/uwp/sunburst-chart/Getting-Started.md
index f90247313..438c05b34 100644
--- a/chart-sdk/uwp/sunburst-chart/Getting-Started.md
+++ b/chart-sdk/uwp/sunburst-chart/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting Started with UWP Sunburst Chart control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP Sunburst Chart (SfSunburstChart) control, its elements and more.
+title: Getting Started with UWP Sunburst Chart | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP Sunburst Chart control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Getting Started with UWP Sunburst Chart (SfSunburstChart)
+# Getting Started with UWP Sunburst Chart
This section explains the steps required to populate the sunburst chart with data, add data labels, legends and header. This section covers only the minimal features that you need to know to get started with the Sunburst chart.
diff --git a/chart-sdk/uwp/sunburst-chart/Legend.md b/chart-sdk/uwp/sunburst-chart/Legend.md
index 2f083808c..884a2aa23 100644
--- a/chart-sdk/uwp/sunburst-chart/Legend.md
+++ b/chart-sdk/uwp/sunburst-chart/Legend.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Legend in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Legend support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Legend in UWP Sunburst Chart | Syncfusion®
+description: Legend in the UWP Sunburst Chart identifies segments and categories, helping users understand and interpret hierarchical data clearly.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Legend in UWP Sunburst Chart (SfSunburstChart)
+# Legend in UWP Sunburst Chart
The Legend is used to represent the first level of categories in sunburst chart.
diff --git a/chart-sdk/uwp/sunburst-chart/Levels.md b/chart-sdk/uwp/sunburst-chart/Levels.md
index 8c6b9e517..daa45517b 100644
--- a/chart-sdk/uwp/sunburst-chart/Levels.md
+++ b/chart-sdk/uwp/sunburst-chart/Levels.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Levels in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Levels support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Levels in UWP Sunburst Chart control | Syncfusion®
+description: Levels in the UWP Sunburst Chart define hierarchical data groups, enabling structured visualization and navigation across categories.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Levels in UWP Sunburst Chart (SfSunburstChart)
+# Levels in UWP Sunburst Charts
Sunburst chart is used to display hierarchical data. You can add more than one hierarchical data in [`Levels`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.SunburstChart.SfSunburstChart.html#Syncfusion_UI_Xaml_SunburstChart_SfSunburstChart_Levels) collection of Sunburst chart. Each level of the hierarchy is represented by a circle.
diff --git a/chart-sdk/uwp/sunburst-chart/Overview.md b/chart-sdk/uwp/sunburst-chart/Overview.md
index 023dc1741..2713b569a 100644
--- a/chart-sdk/uwp/sunburst-chart/Overview.md
+++ b/chart-sdk/uwp/sunburst-chart/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About UWP Sunburst Chart control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP Sunburst Chart (SfSunburstChart) control, its elements and more.
+title: About Syncfusion® UWP Sunburst Chart control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP Sunburst Chart control, its features, capabilities, and more details.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# UWP Sunburst Chart (SfSunburstChart) Overview
+# About Syncfusion® UWP Sunburst Chart control
Sunburst Chart is useful for visualizing hierarchical data. The center circle represents the root level in the hierarchy, with outer circles representing higher levels of the hierarchy.
diff --git a/chart-sdk/uwp/sunburst-chart/Palettes.md b/chart-sdk/uwp/sunburst-chart/Palettes.md
index ef27190b9..13a33b1ba 100644
--- a/chart-sdk/uwp/sunburst-chart/Palettes.md
+++ b/chart-sdk/uwp/sunburst-chart/Palettes.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Palette in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Palette support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Palette in UWP Sunburst Chart | Syncfusion®
+description: Palette in the UWP Sunburst Chart allows you to customize segment colors, improving visual distinction and chart presentation.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Palette in UWP Sunburst Chart (SfSunburstChart)
+# Palette in UWP Sunburst Chart
Sunburst chart provides support to apply different types of palettes. You can define the palettes by using [`Palette`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.SunburstChart.SfSunburstChart.html#Syncfusion_UI_Xaml_SunburstChart_SfSunburstChart_Palette) property.
diff --git a/chart-sdk/uwp/sunburst-chart/Region.md b/chart-sdk/uwp/sunburst-chart/Region.md
index 6e28fadb3..d4a9d535d 100644
--- a/chart-sdk/uwp/sunburst-chart/Region.md
+++ b/chart-sdk/uwp/sunburst-chart/Region.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Region in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Region support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Region in UWP Sunburst Chart | Syncfusion®
+description: Region in the UWP Sunburst Chart represents hierarchical data segments, enabling visualization and interaction with categorized data.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Region in UWP Sunburst Chart (SfSunburstChart)
+# Region in UWP Sunburst Chart
Sunburst region represents the entire chart and all its elements. It includes all the chart elements like Legend, DataLabel, Levels etc. It has the following major properties:
diff --git a/chart-sdk/uwp/sunburst-chart/Selection.md b/chart-sdk/uwp/sunburst-chart/Selection.md
index 589cfaefb..a0d94acfa 100644
--- a/chart-sdk/uwp/sunburst-chart/Selection.md
+++ b/chart-sdk/uwp/sunburst-chart/Selection.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Selection in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Selection support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Selection in UWP Sunburst Chart | Syncfusion®
+description: Selection in the UWP Sunburst Chart enables users to highlight and interact with data segments for focused analysis and exploration.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Selection in UWP Sunburst Chart (SfSunburstChart)
+# Selection in UWP Sunburst Chart
Sunburst chart supports selection that enables you to select a segment by using [`SunburstSelectionBehavior`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.SunburstChart.SunburstSelectionBehavior.html).
diff --git a/chart-sdk/uwp/sunburst-chart/Tooltip.md b/chart-sdk/uwp/sunburst-chart/Tooltip.md
index 4b8179b73..415050f7c 100644
--- a/chart-sdk/uwp/sunburst-chart/Tooltip.md
+++ b/chart-sdk/uwp/sunburst-chart/Tooltip.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Tooltip in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Tooltip support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Tooltip in UWP Sunburst Chart | Syncfusion®
+description: Tooltip in the UWP Sunburst Chart displays detailed information about data segments on hover, helping users analyze chart data effectively.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Tooltip in UWP Sunburst Chart (SfSunburstChart)
+# Tooltip in UWP Sunburst Chart
Tooltip allows you to display any information over a sunburst segment. It appears when the mouse hovers over or the user touches any chart segment. By default, it displays the corresponding segment category name and its value.
diff --git a/chart-sdk/uwp/sunburst-chart/Zooming.md b/chart-sdk/uwp/sunburst-chart/Zooming.md
index e9ed951cd..670804311 100644
--- a/chart-sdk/uwp/sunburst-chart/Zooming.md
+++ b/chart-sdk/uwp/sunburst-chart/Zooming.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Zooming in UWP Sunburst Chart control | Syncfusion
-description: Learn here all about Zooming support in Syncfusion UWP Sunburst Chart (SfSunburstChart) control and more.
+title: Zooming in UWP Sunburst Chart | Syncfusion®
+description: Zooming in the UWP Sunburst Chart enables users to focus on specific hierarchical data segments for detailed analysis and navigation.
platform: chart-sdk
control: SfSunburstChart
documentation: ug
---
-# Zooming in UWP Sunburst Chart (SfSunburstChart)
+# Zooming in UWP Sunburst Chart
Sunburst chart provides zooming (drill down) experience with animation for both mouse and touch enabled devices. It allows you to virtualize large sets of data into minimum data view.
diff --git a/chart-sdk/uwp/treemap/ColorMapping.md b/chart-sdk/uwp/treemap/ColorMapping.md
index 47e1f0633..390210025 100644
--- a/chart-sdk/uwp/treemap/ColorMapping.md
+++ b/chart-sdk/uwp/treemap/ColorMapping.md
@@ -1,13 +1,13 @@
---
layout: post
-title: ColorMapping in UWP TreeMap control | Syncfusion
-description: Learn about ColorMapping support in Syncfusion UWP TreeMap (SfTreeMap), including value-based coloring, range mapping, and customization options.
+title: Color Mapping in UWP TreeMap | Syncfusion®
+description: Color mapping in the UWP TreeMap applies colors to hierarchical data items based on values, improving visualization and data interpretation.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# ColorMapping in UWP TreeMap (SfTreeMap)
+# Color Mapping in UWP TreeMap
ColorMapping is categorized into four different types:
diff --git a/chart-sdk/uwp/treemap/DataBinding.md b/chart-sdk/uwp/treemap/DataBinding.md
index 1062f04a0..a1d7a2dd8 100644
--- a/chart-sdk/uwp/treemap/DataBinding.md
+++ b/chart-sdk/uwp/treemap/DataBinding.md
@@ -1,13 +1,13 @@
---
layout: post
-title: DataBinding in UWP TreeMap control | Syncfusion
-description: Learn about DataBinding support in Syncfusion UWP TreeMap (SfTreeMap), including binding hierarchical data, population, and visualization techniques.
+title: Data Binding in UWP TreeMap | Syncfusion®
+description: Data binding in the UWP TreeMap enables visualization of hierarchical data through population, grouping, and interactive data representation.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# DataBinding in UWP TreeMap (SfTreeMap)
+# Data Binding in UWP TreeMap
The SfTreeMap is bound to an external data source to display the data. It supports data sources such as List, ObservableCollection, and so on. The ItemsSource property helps to bind the TreeMap with the collection of objects.
diff --git a/chart-sdk/uwp/treemap/Drill-Down.md b/chart-sdk/uwp/treemap/Drill-Down.md
index ab8c9465c..6961afc48 100644
--- a/chart-sdk/uwp/treemap/Drill-Down.md
+++ b/chart-sdk/uwp/treemap/Drill-Down.md
@@ -1,13 +1,13 @@
---
layout: post
-title: DrillDown in UWP TreeMap control | Syncfusion
-description: Learn about DrillDown support in Syncfusion UWP TreeMap (SfTreeMap), including hierarchical navigation, interaction, and data exploration features.
+title: Drill Down Support in UWP TreeMap | Syncfusion®
+description: Drill down support in the UWP TreeMap enables users to navigate hierarchical data levels for detailed analysis and data exploration.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# DrillDown in UWP TreeMap (SfTreeMap)
+# Drill Down Support in UWP TreeMap
The Treemap enables drill down to expose the hierarchy by clicking on a treemap node and allows drill up by clicking on the drill down header. At a time, only one level of the hierarchy can be seen in the treemap.
diff --git a/chart-sdk/uwp/treemap/Getting-Started.md b/chart-sdk/uwp/treemap/Getting-Started.md
index a5d75fcc4..67c07d088 100644
--- a/chart-sdk/uwp/treemap/Getting-Started.md
+++ b/chart-sdk/uwp/treemap/Getting-Started.md
@@ -1,17 +1,17 @@
---
layout: post
-title: Getting Started with UWP TreeMap control | Syncfusion
-description: Learn here about getting started with Syncfusion UWP TreeMap (SfTreeMap) control, its elements and more.
+title: Getting Started with UWP TreeMap | Syncfusion®
+description: Learn how to get started with the Syncfusion® UWP TreeMap control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# Getting Started with UWP TreeMap (SfTreeMap)
+# Getting Started with UWP TreeMap
TreeMap is a growing trend in data visualization. It displays hierarchical information in a series of clustered rectangles, which together represent a whole. The size of each box represents a quantity. TreeMap can also use color to represent any number of values, but it is often used to categorize the various boxes within the treemap.
-### Creating treemap for a windows store app
+## Creating treemap for a windows store app
TreeMap is available in the following assembly and namespace.
@@ -19,14 +19,14 @@ Assembly: Syncfusion.SfTreeMap.UWP
Namespace: Syncfusion.UI.Xaml.TreeMap
-### Adding assembly reference
+## Adding assembly reference
1. Open the Add Reference window from your project.
2. Choose Windows > Extensions > Syncfusion Controls for UWP XAML.
-### Add SfTreeMap from toolbox
+## Add SfTreeMap from toolbox
Drag and drop the SfTreeMap control from the toolbox to your application.
@@ -56,7 +56,7 @@ Refer to the following code to add a TreeMap in an application:
{% endhighlight %}
-### Create data for treemap:
+## Create data for treemap:
SfTreeMap is a data-bound control. Hence you have to create a data model to bind it to the control.
@@ -120,7 +120,7 @@ public class PopulationViewModel
{{ codesnippet2 | OrderList_Indent_Level_1 }}
-### Populating data to the TreeMap
+## Populating data to the TreeMap
1.Setting DataContext to the MainWindow
{% capture codesnippet3 %}
diff --git a/chart-sdk/uwp/treemap/Grouping.md b/chart-sdk/uwp/treemap/Grouping.md
index 1b79b4036..d4a7377a6 100644
--- a/chart-sdk/uwp/treemap/Grouping.md
+++ b/chart-sdk/uwp/treemap/Grouping.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Grouping in UWP TreeMap control | Syncfusion
-description: Learn about Grouping support in Syncfusion UWP TreeMap (SfTreeMap), including organizing data into hierarchical levels for effective visualization.
+title: Grouping in UWP TreeMap | Syncfusion®
+description: Grouping in the UWP TreeMap organizes data into hierarchical levels, enabling structured visualization and effective analysis of related data.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# Grouping in UWP TreeMap (SfTreeMap)
+# Grouping in UWP TreeMap
The levels of TreeMap can be categorized into two types such as,
diff --git a/chart-sdk/uwp/treemap/LeafLabelPath.md b/chart-sdk/uwp/treemap/LeafLabelPath.md
deleted file mode 100644
index 712df288a..000000000
--- a/chart-sdk/uwp/treemap/LeafLabelPath.md
+++ /dev/null
@@ -1,31 +0,0 @@
----
-layout: post
-title: LeafLabelPath in UWP TreeMap control | Syncfusion
-description: Learn about LeafLabelPath support in Syncfusion UWP TreeMap (SfTreeMap), including displaying labels for leaf items and customizing label content.
-platform: chart-sdk
-control: SfTreeMap
-documentation: ug
----
-
-# LeafLabelPath in UWP TreeMap (SfTreeMap)
-
-LeafLabelPath of SfTreeMap is a path to a field on the source object, which serves as the "label" of the object.
-
-Code Sample:
-
-{% highlight xaml %}
-
-
-
-
-
-
-
-
-
-
-
-{% endhighlight %}
-
-N> The specified field must be available in each and every sub class (object) defined in hierarchical (nested) data collection.
diff --git a/chart-sdk/uwp/treemap/Overview.md b/chart-sdk/uwp/treemap/Overview.md
index 5abc7accd..a2a0c5614 100644
--- a/chart-sdk/uwp/treemap/Overview.md
+++ b/chart-sdk/uwp/treemap/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About UWP TreeMap control | Syncfusion
-description: Learn here all about introduction of Syncfusion UWP TreeMap (SfTreeMap) control, its elements and more.
+title: About Syncfusion® UWP TreeMap Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® UWP TreeMap control, its features, capabilities, and more details.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# UWP TreeMap (SfTreeMap) Overview
+# About Syncfusion® UWP TreeMap Control
A TreeMap is ideal for visualizing large amounts of data. The visualization space is split into rectangles that are sized and colored based on the quantitative variables. The levels in the hierarchy of the tree map are visualized as rectangles containing other rectangles.
diff --git a/chart-sdk/uwp/treemap/Selection.md b/chart-sdk/uwp/treemap/Selection.md
index a68713278..ec740f452 100644
--- a/chart-sdk/uwp/treemap/Selection.md
+++ b/chart-sdk/uwp/treemap/Selection.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Selection in UWP TreeMap control | Syncfusion
-description: Learn about Selection support in Syncfusion UWP TreeMap (SfTreeMap), including item highlighting, interaction behavior, and selection customization.
+title: Selection Support in UWP TreeMap | Syncfusion®
+description: Selection support in the UWP TreeMap enables users to highlight and interact with hierarchical data items for focused analysis and exploration.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# Selection in UWP TreeMap (SfTreeMap)
+# Selection Support in UWP TreeMap
While selecting a leaf node, you can highlight it by setting [`HighlightOnSelection`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeMap.SfTreeMap.html#Syncfusion_UI_Xaml_TreeMap_SfTreeMap_HighlightOnSelection) property of SfTreeMap to “True”. The border of highlight on selection can be customized by HighlightBorderBrush and HighlightBorderThickness properties of SfTreeMap.
diff --git a/chart-sdk/uwp/treemap/Templates.md b/chart-sdk/uwp/treemap/Templates.md
index d2ef1f63b..33df8f0fe 100644
--- a/chart-sdk/uwp/treemap/Templates.md
+++ b/chart-sdk/uwp/treemap/Templates.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Templates in UWP TreeMap control | Syncfusion
-description: Learn about Templates support in Syncfusion UWP TreeMap (SfTreeMap), including customizing item appearance using data templates and visual elements.
+title: Templates in UWP TreeMap | Syncfusion®
+description: Templates in the UWP TreeMap customize item appearance using data templates and visual elements for enhanced data visualization.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# Templates in UWP TreeMap (SfTreeMap)
+# Templates in UWP TreeMap
## Headers
diff --git a/chart-sdk/uwp/treemap/ToolTip.md b/chart-sdk/uwp/treemap/ToolTip.md
index 02c310323..a1e54be02 100644
--- a/chart-sdk/uwp/treemap/ToolTip.md
+++ b/chart-sdk/uwp/treemap/ToolTip.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Tooltip in UWP TreeMap control | Syncfusion
-description: Learn about Tooltip support in Syncfusion UWP TreeMap (SfTreeMap), including displaying contextual information and customizing tooltip content.
+title: Tooltip Support in UWP TreeMap | Syncfusion®
+description: Tooltip support in the UWP TreeMap displays detailed information about hierarchical data items on hover, improving data analysis and interpretation.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# Tooltip in UWP TreeMap (SfTreeMap)
+# Tooltip Support in UWP TreeMap
You can enable ToolTip for TreeMap by setting ShowToolTip to **true**. For modifying the default appearance of the ToolTip, the ToolTipTemplate can be specified.
diff --git a/chart-sdk/uwp/treemap/TreeMap-Layout.md b/chart-sdk/uwp/treemap/TreeMap-Layout.md
index 97957153f..45ec277c2 100644
--- a/chart-sdk/uwp/treemap/TreeMap-Layout.md
+++ b/chart-sdk/uwp/treemap/TreeMap-Layout.md
@@ -1,13 +1,13 @@
---
layout: post
-title: TreeMap Layout in UWP TreeMap control | Syncfusion
-description: Learn about TreeMap Layout support in Syncfusion UWP TreeMap (SfTreeMap), including layout types, arrangement options, and visual customization.
+title: Layout in UWP TreeMap | Syncfusion®
+description: Layout in the UWP TreeMap determines how hierarchical data items are arranged, enabling effective space utilization and visualization.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# TreeMap Layout in UWP TreeMap (SfTreeMap)
+# Layout in UWP TreeMap
The [`ItemsLayoutMode`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeMap.TreeMapLayoutMode.html) for SfTreeMap specifies the layout mode of the treemap items. This layout is applied for all the tree map levels. There are four different treemap layouts such as,
diff --git a/chart-sdk/uwp/treemap/TreeMap-Legend.md b/chart-sdk/uwp/treemap/TreeMap-Legend.md
index 4fd3523df..2fed4a7fb 100644
--- a/chart-sdk/uwp/treemap/TreeMap-Legend.md
+++ b/chart-sdk/uwp/treemap/TreeMap-Legend.md
@@ -1,13 +1,13 @@
---
layout: post
-title: TreeMap Legend in UWP TreeMap control | Syncfusion
-description: Learn about TreeMap Legend support in Syncfusion UWP TreeMap (SfTreeMap), including legend display, positioning, styling, and customization options.
+title: Legend in UWP TreeMap | Syncfusion®
+description: Legend in the UWP TreeMap identifies color mappings and data categories, helping users understand hierarchical data relationships.
platform: chart-sdk
control: SfTreeMap
documentation: ug
---
-# TreeMap Legend in UWP TreeMap (SfTreeMap)
+# Legend in UWP TreeMap
TreeMap legend is used to easily demonstrate about the color value of leaf nodes. But this legend could be appropriate only for the treemap having leaf nodes colored by using [`RangeBrushColorMapping`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeMap.RangeBrushColorMapping.html). The labels of the legend item can be customized by specifying [`LegendLabel`](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeMap.RangeBrush.html#Syncfusion_UI_Xaml_TreeMap_RangeBrush_LegendLabel) of RangeBrush mentioned in the Brushes of RangeBrushColorMapping.
diff --git a/chart-sdk/winui/Cartesian-Charts/Appearance.md b/chart-sdk/winui/Cartesian-Charts/Appearance.md
index 292a82693..3d8ccb645 100644
--- a/chart-sdk/winui/Cartesian-Charts/Appearance.md
+++ b/chart-sdk/winui/Cartesian-Charts/Appearance.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Appearance in WinUI Chart control | Syncfusion
-description: This section explains about how to apply palettes and gradient in the Syncfusion® WinUI Chart(SfCartesianChart) control.
+title: Appearance in WinUI Chart | Syncfusion®
+description: Appearance in the WinUI Chart allows you to customize chart visuals using palettes, gradients, and styling options for enhanced presentation.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: appearance in winui chart, winui sfcartesianchart appearance, winui chart appearance customization, syncfusion winui chart appearance, winui sfcartesianchart appearance configuration.
---
-# Appearance in WinUI Chart (SfCartesianChart)
+# Appearance in WinUI Chart
The appearance of [SfCartesianChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCartesianChart.html) can be customized by using the predefined brushes, custom brushes, and gradient, which allows you to enrich the application.
diff --git a/chart-sdk/winui/Cartesian-Charts/Area.md b/chart-sdk/winui/Cartesian-Charts/Area.md
index f9b9b9d63..5ff028dbb 100644
--- a/chart-sdk/winui/Cartesian-Charts/Area.md
+++ b/chart-sdk/winui/Cartesian-Charts/Area.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Area Chart in WinUI Chart control | Syncfusion
-description: Learn here all about the area chart types and its features in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Area Chart in WinUI Chart | Syncfusion®
+description: Area chart in the WinUI Chart visualizes trends and magnitude over time using filled areas, supporting effective data comparison and analysis.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui area chart, winui sfcartesianchart area chart, winui area chart customization, syncfusion winui area chart, winui sfcartesianchart area chart settings.
---
-# Area Chart in WinUI Charts (SfCartesianChart)
+# Area Chart in WinUI Chart
## Area Chart
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/AutoScrollingDelta.md b/chart-sdk/winui/Cartesian-Charts/Axis/AutoScrollingDelta.md
index 817f6bb41..c0816d133 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/AutoScrollingDelta.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/AutoScrollingDelta.md
@@ -1,14 +1,14 @@
---
layout: post
-title: AutoScrollingDelta feature in WinUI Chart control | Syncfusion
-description: Learn here all about axis AutoScrollingDelta feature in Syncfusion® WinUI Chart (SfCartesianChart) control and more.
+title: Auto Scrolling in WinUI Chart | Syncfusion®
+description: Auto scrolling in the WinUI Chart automatically displays the latest data points within a specified range, enabling continuous data monitoring.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: auto scrolling in winui chart, winui sfcartesianchart auto scrolling, winui chart auto scrolling customization, syncfusion winui chart auto scrolling, winui sfcartesianchart auto scrolling settings.
---
-# Auto Scrolling in WinUI Chart (SfCartesianChart)
+# Auto Scrolling in WinUI Chart
Axis supports auto-scrolling the live data added to the chart with a specific range of data visible at the start or end.
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/Axislabels.md b/chart-sdk/winui/Cartesian-Charts/Axis/Axislabels.md
index c244dd874..6530f2540 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/Axislabels.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/Axislabels.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Axis labels in WinUI Chart control | Syncfusion
-description: Learn here all about axis labels and its customization in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Axis Labels in WinUI Chart | Syncfusion®
+description: Axis labels in the WinUI Chart display values and categories, supporting customization of formatting, positioning, and appearance settings.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: axis labels in winui chart, winui sfcartesianchart axis labels, winui chart axis labels customization, syncfusion winui chart axis labels, winui sfcartesianchart axis labels settings.
---
-# Axis Labels in WinUI Chart (SfCartesianChart)
+# Axis Labels in WinUI Chart
Axis labels are used to show the units, measures, or category values of the axis to visualize the data in a user-friendly way. It will be generated based on the range and the values bound to the [XBindingPath](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartSeries.html#Syncfusion_UI_Xaml_Charts_ChartSeries_XBindingPath) or [YBindingPath](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.XyDataSeries.html#Syncfusion_UI_Xaml_Charts_XyDataSeries_YBindingPath) properties of the series.
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/Axisline.md b/chart-sdk/winui/Cartesian-Charts/Axis/Axisline.md
index 522dedbe9..86821403f 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/Axisline.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/Axisline.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Axis line in WinUI Chart control | Syncfusion
-description: Learn here all about the chart axis line and its customization in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Axis Line in WinUI Chart | Syncfusion®
+description: Axis line in the WinUI Chart defines the visual boundary of chart axes and supports customization of style, color, and appearance.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: axis line in winui chart, winui sfcartesianchart axis line, syncfusion winui chart axis line, customizing axis line in winui, winui sfcartesianchart axis line configuration.
---
-# Axis line in WinUI Chart (SfCartesianChart)
+# Axis Line in WinUI Chart
## Customization
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/Gridlines.md b/chart-sdk/winui/Cartesian-Charts/Axis/Gridlines.md
index 85e453c57..5994922b5 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/Gridlines.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/Gridlines.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Axis grid lines in WinUI Chart control | Syncfusion
-description: Learn here all about the chart axis grid lines and its customization in Syncfusion® WinUI Chart(SfCartesianChart).
+title: Grid Lines in WinUI Chart | Syncfusion®
+description: Grid lines in the WinUI Chart improve data readability by displaying reference lines and support customization of style, spacing, and appearance.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: grid lines in winui chart, winui sfcartesianchart grid lines, winui chart grid lines customization, syncfusion winui chart grid lines, winui sfcartesianchart grid lines settings.
---
-# Grid Lines in WinUI Chart (SfCartesianChart)
+# Grid Lines in WinUI Chart
## Major Grid Lines
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/Header.md b/chart-sdk/winui/Cartesian-Charts/Axis/Header.md
index c73a1cc23..62b2e4583 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/Header.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/Header.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Header for axis in WinUI Chart control | Syncfusion
-description: This section explains about chart axis header, header style, header template and its customization in WinUI chart (SfCartesianChart).
+title: Axis Header in WinUI Chart | Syncfusion®
+description: Axis header in the WinUI Chart displays descriptive text for chart axes and supports customization through styles, templates, and appearance settings.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: axis title in winui chart, winui sfcartesianchart axis title, winui chart axis title customization, syncfusion winui chart axis title, winui sfcartesianchart axis title configuration.
---
-# Axis Title in WinUI Chart (SfCartesianChart)
+# Axis Header in WinUI Chart
The [Header](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartAxis.html#Syncfusion_UI_Xaml_Charts_ChartAxis_Header) property is used to set the title for the chart axis. It accepts any `UIElement` as the content of the axis title.
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/Overview.md b/chart-sdk/winui/Cartesian-Charts/Axis/Overview.md
index 516b66482..651cff44a 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/Overview.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/Overview.md
@@ -1,14 +1,14 @@
---
layout: post
-title: About Axis in WinUI Chart control | Syncfusion
-description: Learn here all about chart axis and its keys features of Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Axis type in WinUI Chart | Syncfusion®
+description: Axis type in the WinUI Chart defines data scales, ranges, labels, and intervals for accurate data visualization and interpretation.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: axis in winui chart, winui sfcartesianchart axis, winui chart axis customization, syncfusion winui chart axis, winui sfcartesianchart axis settings.
---
-# Axis in WinUI Chart (SfCartesianChart)
+# Axis type in WinUI Chart
[ChartAxis](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartAxis.html) is used to locate a data point inside the chart area. Charts typically have two axes that are used to measure and categorize data: a vertical (Y) axis, and a horizontal (X) axis.
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/Padding.md b/chart-sdk/winui/Cartesian-Charts/Axis/Padding.md
index 8a2ac23e7..fd7ac393d 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/Padding.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/Padding.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Axis padding in WinUI Chart control | Syncfusion
-description: Learn here all about how to set padding for chart axis in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Axis Padding in WinUI Chart | Syncfusion®
+description: Axis padding in the WinUI Chart adds spacing around plotted data, improving visibility and preventing data points from appearing at chart edges.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: axis padding in winui chart, winui sfcartesianchart axis padding, winui chart axis padding customization, syncfusion winui chart axis padding.
---
-# Axis Padding in WinUI Chart (SfCartesianChart)
+# Axis Padding in WinUI Chart
## PlotOffsetStart
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/Range-padding.md b/chart-sdk/winui/Cartesian-Charts/Axis/Range-padding.md
index add759ed5..985518a55 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/Range-padding.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/Range-padding.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Range padding in WinUI Chart control | Syncfusion
-description: Learn here all about axis range padding and its types features of Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Range Padding in WinUI Chart | Syncfusion®
+description: Range padding in the WinUI Chart adjusts axis ranges by adding extra space around data points, improving chart readability and presentation.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: range padding in winui chart, winui sfcartesianchart range padding, winui chart range padding customization, syncfusion winui chart range padding, winui sfcartesianchart range padding configuration.
---
-# Range Padding in WinUI Chart (SfCartesianChart)
+# Range Padding in WinUI Chart
Range padding is used to apply the minimum and maximum extremes of chart axis range by using the `RangePadding` property. The [NumericalAxis](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.NumericalAxis.html) and [DateTimeAxis](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.DateTimeAxis.html) have a [RangePadding](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.DateTimeAxis.html#Syncfusion_UI_Xaml_Charts_DateTimeAxis_RangePadding) property that can be used to add padding to the range of the chart axis.
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/Ticklines.md b/chart-sdk/winui/Cartesian-Charts/Axis/Ticklines.md
index 6528fe221..0743bd609 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/Ticklines.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/Ticklines.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Axis Tick Line in WinUI Chart control | Syncfusion
-description: Learn here all about chart axis tick line and its customization in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Tick Lines in WinUI Chart | Syncfusion®
+description: Tick lines in the WinUI Chart indicate axis intervals and support customization of size, position, style, and appearance settings.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: tick lines in winui chart, winui sfcartesianchart tick lines, winui chart tick lines customization, syncfusion winui chart tick lines.
---
-# Tick Lines in WinUI Chart (SfCartesianChart)
+# Tick Lines in WinUI Chart
Tick lines are the small lines which are drawn on the axis line representing the axis labels. Tick lines will be drawn outside of the axis by default.
diff --git a/chart-sdk/winui/Cartesian-Charts/Axis/Types.md b/chart-sdk/winui/Cartesian-Charts/Axis/Types.md
index b43a85322..1716e09ae 100644
--- a/chart-sdk/winui/Cartesian-Charts/Axis/Types.md
+++ b/chart-sdk/winui/Cartesian-Charts/Axis/Types.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Axis types in WinUI Chart control | Syncfusion
-description: Learn here all about axis types and its features in Syncfusion® WinUI Chart (SfCartesianChart) control and more.
+title: Axis Types in WinUI Chart | Syncfusion®
+description: Axis types in the WinUI Chart provide different ways to represent data values, categories, dates, and logarithmic scales.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: types of axis in winui chart, winui sfcartesianchart axis types, winui chart axis types, syncfusion winui chart axis types, winui sfcartesianchart axis options.
---
-# Types of Axis in WinUI Chart (SfCartesianChart)
+# Axis Types in WinUI Chart
Cartesian chart supports the following types of chart axis.
diff --git a/chart-sdk/winui/Cartesian-Charts/Bar.md b/chart-sdk/winui/Cartesian-Charts/Bar.md
index f3ad99bb5..6d6572b82 100644
--- a/chart-sdk/winui/Cartesian-Charts/Bar.md
+++ b/chart-sdk/winui/Cartesian-Charts/Bar.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Bar Chart in WinUI Chart control | Syncfusion
-description: Learn here all about the bar chart and its features in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Bar Chart in WinUI Chart | Syncfusion®
+description: Bar chart in the WinUI Chart displays and compares values across categories using horizontal bars for clear data visualization.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui bar chart, winui sfcartesianchart, winui bar chart customization, syncfusion winui bar chart, winui bar chart settings.
---
-# Bar Chart in WinUI Chart (SfCartesianChart)
+# Bar Chart in WinUI Chart
A bar chart uses bars to represent data points and compare values across different categories. To render a bar chart, initialize the [SfCartesianChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCartesianChart.html) and switch the chart X and Y axes by using the [IsTransposed](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCartesianChart.html#Syncfusion_UI_Xaml_Charts_SfCartesianChart_IsTransposed) property as true. Then, create an instance of [ColumnSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ColumnSeries.html), and add it to the [Series](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCartesianChart.html#Syncfusion_UI_Xaml_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCartesianChart.html).
diff --git a/chart-sdk/winui/Cartesian-Charts/Bubble.md b/chart-sdk/winui/Cartesian-Charts/Bubble.md
index 4aea76042..35777d418 100644
--- a/chart-sdk/winui/Cartesian-Charts/Bubble.md
+++ b/chart-sdk/winui/Cartesian-Charts/Bubble.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Bubble Chart in WinUI Chart control | Syncfusion
-description: Learn here all about the bubble series and its features in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Bubble Chart in WinUI Chart | Syncfusion®
+description: Bubble chart in the WinUI Chart visualizes data using bubbles of varying sizes to represent additional dimensions and value relationships.
platform: chart-sdk
control: SfChart
documentation: ug
keywords: winui bubblechart, winui sfcartesianchart bubble chart, winui bubble chart customization, syncfusion winui bubble chart, winui sfcartesianchart, bubble chart settings.
---
-# Bubble Chart in WinUI Chart (SfCartesianChart)
+# Bubble Chart in WinUI Chart
## Bubble Chart
diff --git a/chart-sdk/winui/Cartesian-Charts/Candle.md b/chart-sdk/winui/Cartesian-Charts/Candle.md
index 3c5685459..50f212ab5 100644
--- a/chart-sdk/winui/Cartesian-Charts/Candle.md
+++ b/chart-sdk/winui/Cartesian-Charts/Candle.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Candle Chart in WinUI Chart control | Syncfusion
-description: Learn all about candle chart and its features in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Candle Chart in WinUI Chart | Syncfusion®
+description: Candle chart in the WinUI Chart visualizes price movements using open, high, low, and close values for financial data analysis.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
diff --git a/chart-sdk/winui/Cartesian-Charts/ChartArea.md b/chart-sdk/winui/Cartesian-Charts/ChartArea.md
index 131ae65f4..288cbef70 100644
--- a/chart-sdk/winui/Cartesian-Charts/ChartArea.md
+++ b/chart-sdk/winui/Cartesian-Charts/ChartArea.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Chart area in WinUI Chart control | Syncfusion
-description: Learn here all about chart area and its customization in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Chart Area in WinUI Chart | Syncfusion®
+description: Chart area in the WinUI Chart defines the plotting region and supports customization of background, borders, and visual appearance.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: chart area in winui chart, winui sfcartesianchart chart area, winui chart area customization, syncfusion winui chart area, winui sfcartesianchart area settings.
---
-# Chart Area in WinUI Chart (SfCartesianChart)
+# Chart Area in WinUI Chart
Chart area represents the entire chart and all its elements. It is a virtual rectangular area that includes all the chart elements such as the title, axes, legends, and series.
diff --git a/chart-sdk/winui/Cartesian-Charts/Column.md b/chart-sdk/winui/Cartesian-Charts/Column.md
index 45bc9c4fa..fcf704e64 100644
--- a/chart-sdk/winui/Cartesian-Charts/Column.md
+++ b/chart-sdk/winui/Cartesian-Charts/Column.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Column Chart in WinUI Chart control | Syncfusion
-description: Learn here all about the column chart and its features in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Column Chart in WinUI Chart | Syncfusion®
+description: Column chart in the WinUI Chart displays and compares values across categories using vertical columns for clear data visualization.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui column chart, winui sfcartesianchart, winui column chart customization, syncfusion winui column chart, winui chart column chart properties.
---
-# Column Chart in WinUI Chart (SfCartesianChart)
+# Column Chart in WinUI Chart
[WinUI Column Chart](https://www.syncfusion.com/winui-controls/cartesian-charts/winui-column-chart) is used to plot discrete rectangles for the given data point values. To render a column chart, create an instance of [ColumnSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ColumnSeries.html), and add it to the [Series](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCartesianChart.html#Syncfusion_UI_Xaml_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCartesianChart.html).
diff --git a/chart-sdk/winui/Cartesian-Charts/Crosshair.md b/chart-sdk/winui/Cartesian-Charts/Crosshair.md
index 4173d4ada..78c01e01b 100644
--- a/chart-sdk/winui/Cartesian-Charts/Crosshair.md
+++ b/chart-sdk/winui/Cartesian-Charts/Crosshair.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Crosshair in WinUI Chart control | Syncfusion
-description: Learn here all about crosshair and its customziation in Syncfusion® WinUI Chart (SfCartesianChart) control
+title: Crosshair in WinUI Chart | Syncfusion®
+description: Crosshair in the WinUI Chart displays precise axis values at pointer positions and supports customization for enhanced data analysis.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: crosshair in winui chart, winui sfcartesianchart crosshair, winui chart crosshair customization, syncfusion winui chart crosshair, winui sfcartesianchart crosshair settings.
---
-# Crosshair in WinUI Chart (SfCartesianChart)
+# Crosshair in WinUI Chart
The Chart crosshair behavior allows you to view the data values at the current mouse pointer or touch contact point. By moving the crosshair lines horizontally, you can identify the corresponding X values, and by moving them vertically, you can identify the Y values.
diff --git a/chart-sdk/winui/Cartesian-Charts/DataLabels.md b/chart-sdk/winui/Cartesian-Charts/DataLabels.md
index 64074c14b..2d43303af 100644
--- a/chart-sdk/winui/Cartesian-Charts/DataLabels.md
+++ b/chart-sdk/winui/Cartesian-Charts/DataLabels.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Data label in WinUI Chart control | Syncfusion
-description: This section explains about how to configure the data labels and its features in WinUI Chart (SfCartesianChart).
+title: Data Label in WinUI Chart | Syncfusion®
+description: Data labels in the WinUI Chart display data values directly on chart points and support customization of content, position, and appearance.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: data label in winui chart, winui sfcartesianchart data label, winui data label customization, syncfusion winui data label, winui chart data label overview.
---
-# Data Label in WinUI Chart (SfCartesianChart)
+# Data Label in WinUI Chart
Data labels are used to display values related to a chart segment. Values from data point(x, y) or other custom properties from a data source can be displayed.
diff --git a/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Column.md b/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Column.md
index 0266be685..4d7a41247 100644
--- a/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Column.md
+++ b/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Column.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Fast Column Series in WinUI Chart control | Syncfusion
-description: Learn here all about Fast Column Bitmap Series of Syncfusion® WinUI Chart (SfCartesianChart) control and more.
+title: Fast Column Series in WinUI Chart | Syncfusion®
+description: Fast Column Series in the WinUI Chart renders large volumes of column data efficiently, providing high performance and smooth visualization.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui fast column chart, winui sfcartesianchart, winui fast column chart customization, syncfusion winui fast column chart, winui fast column chart configuration.
---
-# Fast Column Chart in WinUI (SfCartesianChart)
+# Fast Column Series in WinUI Chart
A fast column chart is a special kind of series that can render a collection with a huge number of data points using `WriteableBitmap`. [FastColumnBitmapSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.FastColumnBitmapSeries.html) is used to boost up the performance of the column series.
diff --git a/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Line.md b/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Line.md
index f5057b470..67bc9e301 100644
--- a/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Line.md
+++ b/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Line.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Fast Line chart in WinUI Chart control | Syncfusion
-description: Learn here all about Fast Line Series feature of Syncfusion® WinUI Chart control(SfCartesianChart) and more.
+title: Fast Line Series in WinUI Chart | Syncfusion®
+description: Fast Line Series in the WinUI Chart renders large volumes of line data efficiently, providing high performance and smooth visualization.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui fast line chart, winui sfcartesianchart, fast line chart, winui fast line chart customization, syncfusion winui fast line chart, fast line chart settings.
---
-# Fast Line Chart in WinUI (SfCartesianChart)
+# Fast Line Series in WinUI Chart
## Fast Line Chart
diff --git a/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Scatter.md b/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Scatter.md
index 707135c60..a487b3484 100644
--- a/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Scatter.md
+++ b/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Scatter.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Fast Scatter Chart in WinUI Chart control | Syncfusion
-description: Learn here all about Fast Scatter Chart of Syncfusion® WinUI Chart (SfCartesianChart) control and more.
+title: Fast Scatter Series in WinUI Chart | Syncfusion®
+description: Fast Scatter Series in the WinUI Chart renders large volumes of scatter data efficiently, providing high performance and responsive visualization.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui fast scatter chart, winui sfcartesianchart, winui fast scatter chart customization, syncfusion winui fast scatter chart, fast scatter chart configuration.
---
-# Fast Scatter Chart in WinUI (SfCartesianChart)
+# Fast Scatter Series in WinUI Chart
A fast scatter chart is a special kind of series that can render a collection with a huge number of data points using `WriteableBitmap`. [FastScatterBitmapSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.FastScatterBitmapSeries.html) is used to render a high number of scatter points.
diff --git a/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Stepline.md b/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Stepline.md
index 9c4fe0dbf..805bab563 100644
--- a/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Stepline.md
+++ b/chart-sdk/winui/Cartesian-Charts/FastCharts/Fast-Stepline.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Fast Step Line Chart in WinUI Chart control | Syncfusion
-description: Learn here all about Fast Step Line Chart of Syncfusion® WinUI Chart (SfCartesianChart) control and more.
+title: Fast Step Line Series in WinUI Chart | Syncfusion®
+description: Fast Step Line Series in the WinUI Chart renders large volumes of stepped line data efficiently, providing high performance and smooth visualization.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui fast step line chart, winui sfcartesianchart, winui fast step line chart customization, syncfusion winui fast step line chart, fast step line chart settings.
---
-# Fast Step Line Chart in WinUI (SfCartesianChart)
+# Fast Step Line Series in WinUI Chart
A fast stepline bitmap series is a special kind of series that can render a collection with a huge number of data points using `WriteableBitmap`. [FastStepLineBitmapSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.FastStepLineBitmapSeries.html) is the high performance version of the step line series.
@@ -61,7 +61,7 @@ chart.Series.Add(series);
-### Anti-aliasing
+## Anti-aliasing
The anti-aliasing mode can be enabled using the [EnableAntiAliasing](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.FastStepLineBitmapSeries.html#Syncfusion_UI_Xaml_Charts_FastStepLineBitmapSeries_EnableAntiAliasing) property of [FastStepLineBitmapSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.FastStepLineBitmapSeries.html) as shown in the following code sample.
diff --git a/chart-sdk/winui/Cartesian-Charts/FastCharts/FastCharts.md b/chart-sdk/winui/Cartesian-Charts/FastCharts/FastCharts.md
index b98fb6a40..1dabf8da3 100644
--- a/chart-sdk/winui/Cartesian-Charts/FastCharts/FastCharts.md
+++ b/chart-sdk/winui/Cartesian-Charts/FastCharts/FastCharts.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Fast Charts in WinUI Chart control | Syncfusion
-description: Learn here all about Fast Chart feature in Syncfusion® WinUI Chart (SfCartesianChart) control and how to configure easily with high performance charts.
+title: Fast Charts in WinUI Chart | Syncfusion®
+description: Fast charts in the WinUI Chart provide high-performance rendering for large datasets, enabling responsive and efficient data visualization.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: fast charts in winui, fast charts, winui fast charts customization, syncfusion winui fast charts, winui sfcartesianchart.
---
-# Fast Charts in WinUI (SfCartesianChart)
+# Fast Charts in WinUI Chart
Chart includes functionality for rendering a large number of data points with fast plotting, and it supports 5 fast chart types. Each chart type is easily configurable with built-in support for creating high performance charts.
diff --git a/chart-sdk/winui/Cartesian-Charts/Getting-Started.md b/chart-sdk/winui/Cartesian-Charts/Getting-Started.md
index dd01c52db..57d8b0a04 100644
--- a/chart-sdk/winui/Cartesian-Charts/Getting-Started.md
+++ b/chart-sdk/winui/Cartesian-Charts/Getting-Started.md
@@ -1,15 +1,15 @@
---
layout: post
-title: Getting started with WinUI Cartesian Chart control | Syncfusion
+title: Getting Started with WinUI Cartesian Chart | Syncfusion®
canonical_url: "https://www.syncfusion.com/winui-controls/cartesian-charts"
-description: This section explains about the getting started with Syncfusion® WinUI Cartesian Chart (SfCartesianChart) control, its elements, and more.
+description: Learn how to get started with the Syncfusion® WinUI Cartesian Chart control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: getting started with winui cartesian chart, winui cartesian chart setup, winui sfcartesianchart guide, winui cartesian chart basics.
---
-# Getting Started with WinUI Cartesian Chart (SfCartesianChart)
+# Getting Started with WinUI Cartesian Chart
This section explains how to populate the Cartesian chart with data, a header, data labels, a legend and tooltips, as well as the essential aspects for getting started with the chart.
diff --git a/chart-sdk/winui/Cartesian-Charts/GroupingStacked.md b/chart-sdk/winui/Cartesian-Charts/GroupingStacked.md
index 50a0409ab..7775aadd6 100644
--- a/chart-sdk/winui/Cartesian-Charts/GroupingStacked.md
+++ b/chart-sdk/winui/Cartesian-Charts/GroupingStacked.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Stacked group chart in WinUI Chart control | Syncfusion
-description: Learn here all about the stacked group chart and its features in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Stacked Group Chart in WinUI Chart | Syncfusion®
+description: Stacked group chart in the WinUI Chart displays grouped and stacked data series, enabling comparison of totals and contributions across categories.
platform: chart-sdk
control: SfChart
documentation: ug
keywords: stacked group chart in winui chart, winui stacked group chart customization, syncfusion winui stacked group chart, winui sfcartesianchart stacked group chart settings.
---
-# Stacked Group Chart in WinUI Chart (SfCartesianChart)
+# Stacked Group Chart in WinUI Chart
Chart provides support to group the stacked similar series by using the [GroupName](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.StackedSeriesBase.html#Syncfusion_UI_Xaml_Charts_StackedSeriesBase_GroupName) property of the stacked series. The stacked series which contains the same [GroupName](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.StackedSeriesBase.html#Syncfusion_UI_Xaml_Charts_StackedSeriesBase_GroupName) will be stacked in a single group.
diff --git a/chart-sdk/winui/Cartesian-Charts/Legend.md b/chart-sdk/winui/Cartesian-Charts/Legend.md
index 9be30212b..bcad15e41 100644
--- a/chart-sdk/winui/Cartesian-Charts/Legend.md
+++ b/chart-sdk/winui/Cartesian-Charts/Legend.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Legend in WinUI Chart control | Syncfusion
-description: This section explains how to configure the legend and its features title, icons, labels, and template in WinUI Chart control.
+title: Legend in WinUI Chart | Syncfusion®
+description: Legend in the WinUI Chart identifies data series and chart elements, supporting customization of titles, labels, icons, and templates.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: legend in winui chart, winui sfcartesianchart legend, winui chart legend customization, syncfusion winui chart legend, winui chart legend properties, winui sfcartesianchart legend configuration.
---
-# Legend in WinUI Chart (SfCartesianChart)
+# Legend in WinUI Chart
The legend contains a list of series data points in the chart. The information provided in each legend item helps you to identify the corresponding series in the chart. You can specify the [Label](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartSeries.html#Syncfusion_UI_Xaml_Charts_ChartSeries_Label) for each series which is to be displayed in legend label.
diff --git a/chart-sdk/winui/Cartesian-Charts/Line.md b/chart-sdk/winui/Cartesian-Charts/Line.md
index fecc3e251..3fb3d13b8 100644
--- a/chart-sdk/winui/Cartesian-Charts/Line.md
+++ b/chart-sdk/winui/Cartesian-Charts/Line.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Line Chart in WinUI Chart control | Syncfusion
-description: Learn here all about the line chart and its type in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Line Chart in WinUI Chart | Syncfusion®
+description: Line chart in the WinUI Chart visualizes trends and changes over time, supporting multiple line types for effective data analysis.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui line chart, winui sfcartesianchart, winui line chart customization, syncfusion winui line chart, winui line chart configuration.
---
-# Line Chart in WinUI Chart (SfCartesianChart)
+# Line Chart in WinUI Chart
## Line Chart
diff --git a/chart-sdk/winui/Cartesian-Charts/OHLC.md b/chart-sdk/winui/Cartesian-Charts/OHLC.md
index 894e6d07d..35c4afca1 100644
--- a/chart-sdk/winui/Cartesian-Charts/OHLC.md
+++ b/chart-sdk/winui/Cartesian-Charts/OHLC.md
@@ -1,7 +1,7 @@
---
layout: post
-title: OHLC Chart in WinUI Chart control | Syncfusion
-description: Learn here all about OHLC chart and its features in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: OHLC Chart in WinUI Chart | Syncfusion®
+description: OHLC chart in the WinUI Chart visualizes open, high, low, and close values, enabling analysis of financial and stock market data.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
diff --git a/chart-sdk/winui/Cartesian-Charts/Overview.md b/chart-sdk/winui/Cartesian-Charts/Overview.md
index afa5906b7..c9cb65afa 100644
--- a/chart-sdk/winui/Cartesian-Charts/Overview.md
+++ b/chart-sdk/winui/Cartesian-Charts/Overview.md
@@ -1,15 +1,15 @@
---
layout: post
-title: About WinUI Chart control | Syncfusion
+title: About Syncfusion® WinUI Chart Control | Syncfusion®
canonical_url: "https://www.syncfusion.com/winui-controls/cartesian-charts"
-description: Learn here all about introduction of Syncfusion® WinUI Chart (SfCartesianChart) control with key features and more.
+description: Learn about the introduction of Syncfusion Essential Studio® WinUI Chart control, its features, capabilities, and more details.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui chart overview, introduction to winui charts, exploring winui chart capabilities.
---
-# WinUI Chart Overview
+# About Syncfusion® WinUI Chart Control
The [WinUI Chart](https://www.syncfusion.com/winui-controls/cartesian-charts) provides a perfect way to visualize data with a high level of user interactivity that focuses on development, productivity, and simplicity of use. It also provides a wide variety of charting features that can be used to visualize large quantities of data, flexibility of binding data and user customization.
diff --git a/chart-sdk/winui/Cartesian-Charts/Scatter.md b/chart-sdk/winui/Cartesian-Charts/Scatter.md
index 3dcf1baca..d6c27269e 100644
--- a/chart-sdk/winui/Cartesian-Charts/Scatter.md
+++ b/chart-sdk/winui/Cartesian-Charts/Scatter.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Scatter Chart in WinUI Chart control | Syncfusion
-description: Learn here all about the scatter chart and its features in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Scatter Chart in WinUI Chart | Syncfusion®
+description: Scatter chart in the WinUI Chart visualizes relationships between data points, enabling trend analysis, comparison, and pattern identification.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui scatter chart, winui sfcartesianchart, winui scatter chart customization, syncfusion winui scatter chart, winui scatter chart properties.
---
-# Scatter Chart in WinUI Charts (SfCartesianChart)
+# Scatter Chart in WinUI Chart
The [WinUI Scatter Chart](https://www.syncfusion.com/winui-controls/cartesian-charts/winui-scatter-chart) is similar to the bubble chart, where each data point is represented by a circle with equal size.
diff --git a/chart-sdk/winui/Cartesian-Charts/Selection.md b/chart-sdk/winui/Cartesian-Charts/Selection.md
index 3253a7ef2..fcfe0916a 100644
--- a/chart-sdk/winui/Cartesian-Charts/Selection.md
+++ b/chart-sdk/winui/Cartesian-Charts/Selection.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Selection in WinUI Chart control | Syncfusion
-description: Learn here all about selection and multi-selection support in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Selection in WinUI Chart | Syncfusion®
+description: Selection in the WinUI Chart enables users to highlight and interact with data points and series, supporting single and multi-selection.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: selection in winui chart, winui sfcartesianchart selection, winui chart selection customization, syncfusion winui chart selection, winui chart selection properties.
---
-# Selection in WinUI Chart (SfCartesianChart)
+# Selection in WinUI Chart
Cartesian chart supports selection that allows you to select a segment or series in the chart by using the [SelectionBehavior](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCartesianChart.html#Syncfusion_UI_Xaml_Charts_SfCartesianChart_SelectionBehavior) property.
diff --git a/chart-sdk/winui/Cartesian-Charts/Stacked.md b/chart-sdk/winui/Cartesian-Charts/Stacked.md
index 5de8d3954..0dd119e03 100644
--- a/chart-sdk/winui/Cartesian-Charts/Stacked.md
+++ b/chart-sdk/winui/Cartesian-Charts/Stacked.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Stacked charts in WinUI Chart control | Syncfusion
-description: Learn here all about stacked chart types column, line, and area in Syncfusion® WinUI Chart(SfChart) control.
+title: Stacked Charts in WinUI Chart | Syncfusion®
+description: Stacked charts in the WinUI Chart display cumulative values across categories using stacked column, line, and area series types.
platform: chart-sdk
control: SfChart
documentation: ug
keywords: winui stacked charts, winui sfcartesianchart, winui stacked charts customization, syncfusion winui stacked charts, winui sfcartesianchart stacked charts configuration, stackedcolum, stackedline, stackedarea.
---
-# Stacked Charts in WinUI Chart (SfCartesianChart)
+# Stacked Charts in WinUI Chart
## Stacked Column Chart
diff --git a/chart-sdk/winui/Cartesian-Charts/Stacked100.md b/chart-sdk/winui/Cartesian-Charts/Stacked100.md
index 0666c3f2c..b65fdca15 100644
--- a/chart-sdk/winui/Cartesian-Charts/Stacked100.md
+++ b/chart-sdk/winui/Cartesian-Charts/Stacked100.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Stacked 100 Charts in WinUI Chart control | Syncfusion
-description: Learn here all about stacked 100 chart types column, line and area in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Stacked 100 Charts in WinUI Chart | Syncfusion®
+description: Stacked 100 charts in the WinUI Chart display percentage contributions across categories using stacked 100 column, line, and area series types.
platform: chart-sdk
control: SfChart
documentation: ug
keywords: winui stacked 100 charts, winui stacked 100 charts customization, 100% charts, cumulative chart in winui, winui sfcartesianchart, syncfusion winui cumulative chart, stackedcolum, stackedline, stackedarea.
---
-# Stacked 100 Charts in WinUI Chart (SfCartesianChart)
+# Stacked 100 Charts in WinUI Chart
## Stacked Column 100 Chart
diff --git a/chart-sdk/winui/Cartesian-Charts/Title.md b/chart-sdk/winui/Cartesian-Charts/Title.md
index 559907125..f16549189 100644
--- a/chart-sdk/winui/Cartesian-Charts/Title.md
+++ b/chart-sdk/winui/Cartesian-Charts/Title.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Title in WinUI Chart control | Syncfusion
-description: Learn here all about title with Syncfusion® WinUI Chart (SfCartesianChart) control and its customization.
+title: Title in WinUI Chart | Syncfusion®
+description: Title in the WinUI Chart displays descriptive text for the chart and supports customization of content, style, and appearance.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: winui chart title, winui sfcartesianchart title, winui chart title customization, syncfusion winui chart title, winui sfcartesianchart title configuration.
---
-# Chart Title in WinUI Chart (SfCartesianChart)
+# Title in WinUI Chart
The [Header](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_Header) property is used to define the title for the chart.
diff --git a/chart-sdk/winui/Cartesian-Charts/Tooltip.md b/chart-sdk/winui/Cartesian-Charts/Tooltip.md
index f716560c3..910d392b8 100644
--- a/chart-sdk/winui/Cartesian-Charts/Tooltip.md
+++ b/chart-sdk/winui/Cartesian-Charts/Tooltip.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Tooltip in WinUI Chart control | Syncfusion
-description: This section explains about how to enable tooltip and its customization in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Tooltip in WinUI Chart | Syncfusion®
+description: Tooltip in the WinUI Chart displays detailed information about data points on hover and supports customization of content and appearance.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: tooltip in winui chart, winui sfcartesianchart tooltip, winui chart tooltip customization, syncfusion winui chart tooltip, winui sfcartesianchart tooltip settings.
---
-# Tooltip in WinUI Chart (SfCartesianChart)
+# Tooltip in WinUI Chart
Tooltip is used to display any information over segments. It appears at the data point position when the mouse hovers over any series segment. It is set to display the metadata of the hovered segment or data point.
diff --git a/chart-sdk/winui/Cartesian-Charts/Trackball.md b/chart-sdk/winui/Cartesian-Charts/Trackball.md
index ae1e487ca..ab240c878 100644
--- a/chart-sdk/winui/Cartesian-Charts/Trackball.md
+++ b/chart-sdk/winui/Cartesian-Charts/Trackball.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Trackball in WinUI Chart control | Syncfusion
-description: Learn here all about trackball and its customization in Syncfusion® WinUI Chart (SfCartesianChart) control.
+title: Trackball in WinUI Chart | Syncfusion®
+description: Trackball in the WinUI Chart displays grouped data point information at specific positions and supports customization for detailed analysis.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: trackball in winui chart, winui sfcartesianchart trackball, winui chart trackball customization, syncfusion winui chart trackball, winui sfcartesianchart trackball settings.
---
-# Trackball in WinUI Chart (SfCartesianChart)
+# Trackball in WinUI Chart
The trackball allows you to track a data point closer to the cursor position. The x values are determined from the position of the vertical line in the axis, and the y values are determined from the points touching the vertical line in the series.
diff --git a/chart-sdk/winui/Cartesian-Charts/Zooming-and-panning.md b/chart-sdk/winui/Cartesian-Charts/Zooming-and-panning.md
index c8572f916..13fab4a8b 100644
--- a/chart-sdk/winui/Cartesian-Charts/Zooming-and-panning.md
+++ b/chart-sdk/winui/Cartesian-Charts/Zooming-and-panning.md
@@ -1,14 +1,14 @@
---
layout: post
-title: Zooming and Panning in WinUI Chart control | Syncfusion
-description: Learn here all about Zooming and Panning feature of Syncfusion® WinUI Chart(SfCartesianChart) control.
+title: Zooming and Panning in WinUI Chart | Syncfusion®
+description: Zooming and panning in the WinUI Chart enable interactive navigation of data, allowing users to explore and analyze chart content in detail.
platform: chart-sdk
control: SfCartesianChart
documentation: ug
keywords: zooming and panning in winui chart, winui sfcartesianchart zooming and panning, winui chart zooming and panning customization, syncfusion winui chart zooming and panning, winui sfcartesianchart zooming and panning settings, winui chart zooming and panning properties.
---
-# Zooming and Panning in WinUI Chart (SfCartesianChart)
+# Zooming and Panning in WinUI Chart
[SfCartesianChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCartesianChart.html) allows you to zoom the chart area with the help of the zoom feature. This behavior is mostly used to view the data points in the specific area, when there are large number of data points inside the chart.
diff --git a/chart-sdk/winui/Circular-Charts/Appearance.md b/chart-sdk/winui/Circular-Charts/Appearance.md
index d2354f76b..815d4e536 100644
--- a/chart-sdk/winui/Circular-Charts/Appearance.md
+++ b/chart-sdk/winui/Circular-Charts/Appearance.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Appearance in WinUI Circular Chart control | Syncfusion
-description: This section explains how to apply palettes and gradients in the Syncfusion® WinUI Chart (SfCircularChart) control
+title: Appearance in WinUI Circular Chart | Syncfusion®
+description: Appearance in the WinUI Circular Chart allows you to customize chart visuals using palettes, gradients, and styling options for enhanced presentation.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Appearance in WinUI Chart (SfCircularChart)
+# Appearance in WinUI Circular Chart
The appearance of the [SfCircularChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCircularChart.html) can be customized by using predefined palettes, custom palettes, and gradients, which allow enriching the application.
diff --git a/chart-sdk/winui/Circular-Charts/DataLabels.md b/chart-sdk/winui/Circular-Charts/DataLabels.md
index 1885db827..8eec92770 100644
--- a/chart-sdk/winui/Circular-Charts/DataLabels.md
+++ b/chart-sdk/winui/Circular-Charts/DataLabels.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Data label in WinUI Chart control | WinUI | Syncfusion
-description: This section explains how to configure the data labels and its features in the WinUI Chart (SfCircularChart).
+title: Data Label in WinUI Circular Chart | Syncfusion®
+description: Data labels in the WinUI Circular Chart display data values directly on chart segments and support customization of content, position, and appearance.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Data Label in WinUI Chart (SfCircularChart)
+# Data Label in WinUI Circular Chart
Data labels are used to display values related to a chart segment. Values from a data point (x, y) or other custom properties from a data source can be displayed.
diff --git a/chart-sdk/winui/Circular-Charts/DoughnutChart.md b/chart-sdk/winui/Circular-Charts/DoughnutChart.md
index 2b4148919..489deab34 100644
--- a/chart-sdk/winui/Circular-Charts/DoughnutChart.md
+++ b/chart-sdk/winui/Circular-Charts/DoughnutChart.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Doughnut chart in WinUI Chart control | Syncfusion
-description: Learn here all about the doughnut chart and its features in the Syncfusion® WinUI Chart (SfCircularChart) control.
+title: Doughnut Chart in WinUI Circular Chart | Syncfusion®
+description: Doughnut chart in the WinUI Circular Chart displays proportional data as segments in a ring, enabling clear comparison of category values.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Doughnut Chart in WinUI Chart (SfCircularChart)
+# Doughnut Chart in WinUI Circular Chart
[DoughnutSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.DoughnutSeries.html) is similar to [PieSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.PieSeries.html). It is used to show the relationship between parts of data and the whole data. To render a [DoughnutSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.DoughnutSeries.html) in the circular chart, create an instance of the [DoughnutSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.DoughnutSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCircularChart.html#Syncfusion_UI_Xaml_Charts_SfCircularChart_Series) collection property of [SfCircularChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCircularChart.html).
diff --git a/chart-sdk/winui/Circular-Charts/Explode.md b/chart-sdk/winui/Circular-Charts/Explode.md
index fc5cb486a..d13b19350 100644
--- a/chart-sdk/winui/Circular-Charts/Explode.md
+++ b/chart-sdk/winui/Circular-Charts/Explode.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Explode segments in WinUI Chart control | Syncfusion
-description: This section explains how to explode a single segment or all segments in the Syncfusion® WinUI Chart (SfCircularChart) control.
+title: Explode Segments in WinUI Circular Chart | Syncfusion®
+description: Explode segments in the WinUI Circular Chart emphasize individual or multiple chart segments for improved data visibility and analysis.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Explode segments in WinUI Chart (SfCircularChart)
+# Explode Segments in WinUI Circular Chart
Exploding a segment is used to draw attention to a specific area of the circular chart. The following properties are used to explode the segments in the circular chart.
diff --git a/chart-sdk/winui/Circular-Charts/Getting-Started.md b/chart-sdk/winui/Circular-Charts/Getting-Started.md
index 99718ac77..76d8d6c0f 100644
--- a/chart-sdk/winui/Circular-Charts/Getting-Started.md
+++ b/chart-sdk/winui/Circular-Charts/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting Started with WinUI Circular Chart control | Syncfusion
-description: Learn here all about getting started with Syncfusion® WinUI Circular Chart (SfCircularChart) control, its elements, and more.
+title: Getting Started with WinUI Circular Chart | Syncfusion®
+description: Learn how to get started with the Syncfusion® WinUI Circular Chart control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Getting Started with WinUI Circular Charts (SfCircularChart)
+# Getting Started with WinUI Circular Chart
This section explains how to populate the circular chart with data, header, data labels, legend, and tooltips, as well as the essential aspects for getting started with the chart.
diff --git a/chart-sdk/winui/Circular-Charts/Legend.md b/chart-sdk/winui/Circular-Charts/Legend.md
index 14ec24186..5be54548e 100644
--- a/chart-sdk/winui/Circular-Charts/Legend.md
+++ b/chart-sdk/winui/Circular-Charts/Legend.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Legend in WinUI Chart control | WinUI | Syncfusion
-description: This section explains how to configure the legend and its features such as title, icons, labels, and template in the WinUI Chart (SfCircularChart).
+title: Legend in WinUI Circular Chart | Syncfusion®
+description: Legend in the WinUI Circular Chart identifies chart segments and categories, supporting customization of titles, labels, icons, and templates.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Legend in WinUI Charts (SfCircularChart)
+# Legend in WinUI Circular Chart
The legend contains a list of series data points in the chart. The information provided in each legend item helps to identify the corresponding data series in the chart.
diff --git a/chart-sdk/winui/Circular-Charts/Overview.md b/chart-sdk/winui/Circular-Charts/Overview.md
index 0ab7bdc20..f3eb98b50 100644
--- a/chart-sdk/winui/Circular-Charts/Overview.md
+++ b/chart-sdk/winui/Circular-Charts/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About WinUI Chart Charts | Syncfusion
-description: Learn here all about the introduction of the Syncfusion® WinUI Chart (SfCircularChart) control with key features and more.
+title: About Syncfusion® WinUI Circular Chart Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® WinUI Circular Chart control, its features, capabilities, and more details.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# WinUI Charts Overview (SfCircularChart)
+# About Syncfusion® WinUI Circular Chart Control
Syncfusion® [WinUI Charts](https://www.syncfusion.com/winui-controls/charts) (SfCircularChart) is used to create charts with beautiful UI visualization of data for high-quality WinUI applications.
diff --git a/chart-sdk/winui/Circular-Charts/PieChart.md b/chart-sdk/winui/Circular-Charts/PieChart.md
index 50e6fcf44..d61356b3e 100644
--- a/chart-sdk/winui/Circular-Charts/PieChart.md
+++ b/chart-sdk/winui/Circular-Charts/PieChart.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Pie Chart in WinUI Chart control | Syncfusion
-description: Learn here all about the pie chart and its features in the Syncfusion® WinUI Chart (SfCircularChart) control.
+title: Pie Chart in WinUI Circular Chart | Syncfusion®
+description: Pie chart in the WinUI Circular Chart displays proportional data as slices, enabling clear comparison of category values and contributions.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Pie Chart in WinUI Chart (SfCircularChart)
+# Pie Chart in WinUI Circular Chart
To render a [PieSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.PieSeries.html) in the circular chart, create an instance of the [PieSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.PieSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCircularChart.html#Syncfusion_UI_Xaml_Charts_SfCircularChart_Series) collection property of [SfCircularChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfCircularChart.html).
diff --git a/chart-sdk/winui/Circular-Charts/Selection.md b/chart-sdk/winui/Circular-Charts/Selection.md
index 071bbcff3..3350435e6 100644
--- a/chart-sdk/winui/Circular-Charts/Selection.md
+++ b/chart-sdk/winui/Circular-Charts/Selection.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Selection in WinUI Circular Chart control | Syncfusion
-description: This section explains how to configure the selection support and its features applied in the WinUI Chart (SfCircularChart).
+title: Selection in WinUI Circular Chart | Syncfusion®
+description: Selection in the WinUI Circular Chart enables users to highlight and interact with chart segments, supporting focused analysis and data exploration.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Selection in WinUI Chart (SfCircularChart)
+# Selection in WinUI Circular Chart
The circular chart supports selection that allows the selection of a segment in a series by using the [DataPointSelectionBehavior](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.DataPointSelectionBehavior.html).
diff --git a/chart-sdk/winui/Circular-Charts/Title.md b/chart-sdk/winui/Circular-Charts/Title.md
index a51cdeceb..615ba5982 100644
--- a/chart-sdk/winui/Circular-Charts/Title.md
+++ b/chart-sdk/winui/Circular-Charts/Title.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Header in WinUI Chart control | Syncfusion
-description: Learn here all about the title with the Syncfusion® WinUI Chart (SfCircularChart) control and its customization.
+title: Title in WinUI Circular Chart | Syncfusion®
+description: Title in the WinUI Circular Chart displays descriptive text for the chart and supports customization of content, style, and appearance.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Header in WinUI Charts (SfCircularChart)
+# Title in WinUI Circular Chart
The [Header](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_Header) property is used to define the title for the chart.
diff --git a/chart-sdk/winui/Circular-Charts/Tooltip.md b/chart-sdk/winui/Circular-Charts/Tooltip.md
index f422951bf..0d766779a 100644
--- a/chart-sdk/winui/Circular-Charts/Tooltip.md
+++ b/chart-sdk/winui/Circular-Charts/Tooltip.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Tooltip in WinUI Circular Chart control | Syncfusion
-description: This section explains how to enable the tooltip and its customization in the Syncfusion® WinUI Chart (SfCircularChart) control
+title: Tooltip in WinUI Circular Chart | Syncfusion®
+description: Tooltip in the WinUI Circular Chart displays detailed information about chart segments on hover and supports customization of content and appearance.
platform: chart-sdk
control: SfCircularChart
documentation: ug
---
-# Tooltip in WinUI Chart (SfCircularChart)
+# Tooltip in WinUI Circular Chart
A tooltip is used to display any information over segments. It appears at the center of the segment when the mouse hovers over any chart segment. It is set to display the metadata of the hovered segment or data point.
diff --git a/chart-sdk/winui/barcode/Barcode-Customization.md b/chart-sdk/winui/barcode/Barcode-Customization.md
index 95db36b54..5cdfa4ee8 100644
--- a/chart-sdk/winui/barcode/Barcode-Customization.md
+++ b/chart-sdk/winui/barcode/Barcode-Customization.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Customization in WinUI Barcode control | Syncfusion
-description: Learn here all about the Customization feature in the Syncfusion WinUI Barcode control with more background, foreground, and Module custom support etc.
+title: Customization in WinUI Barcode | Syncfusion®
+description: Customization in the WinUI Barcode allows you to modify barcode appearance, colors, sizing, module settings, and visual styles.
platform: chart-sdk
control: Barcode
documentation: ug
diff --git a/chart-sdk/winui/barcode/Getting-Started.md b/chart-sdk/winui/barcode/Getting-Started.md
index 772bea3d7..994a10316 100644
--- a/chart-sdk/winui/barcode/Getting-Started.md
+++ b/chart-sdk/winui/barcode/Getting-Started.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Getting Started with WinUI Barcode control | Syncfusion
-description: Learn here all about getting started with the Syncfusion WinUI Barcode (SfBarcode) control, its elements, and more.
+title: Getting Started with WinUI Barcode | Syncfusion®
+description: Learn how to get started with the Syncfusion® WinUI Barcode control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: Barcode
documentation: ug
diff --git a/chart-sdk/winui/barcode/Overview.md b/chart-sdk/winui/barcode/Overview.md
index 3ecb04cc0..e497b6717 100644
--- a/chart-sdk/winui/barcode/Overview.md
+++ b/chart-sdk/winui/barcode/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About WinUI Barcode control | Syncfusion
-description: Learn here all about the introduction to the Syncfusion WinUI Barcode (SfBarcode) control, its elements, and more.
+title: About Syncfusion® WinUI Barcode Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® WinUI Barcode control, its features, capabilities, and more details.
platform: chart-sdk
control: Barcode
documentation: ug
---
-# WinUI Barcode Overview
+# About Syncfusion® WinUI Barcode Control
The Syncfusion [WinUI Barcode](https://www.syncfusion.com/winui-controls/barcode) control helps you to generate and display data in a machine-readable format. It provides a flexible approach for encoding text using supported barcode types.
diff --git a/chart-sdk/winui/barcode/Symbology-Customization.md b/chart-sdk/winui/barcode/Symbology-Customization.md
index 040f42ef3..360d60db3 100644
--- a/chart-sdk/winui/barcode/Symbology-Customization.md
+++ b/chart-sdk/winui/barcode/Symbology-Customization.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Symbology Customization in WinUI Barcode control | Syncfusion
-description: Learn here all about the Symbology Customization feature in Syncfusion WinUI Barcode control with one, two-dimensional support, and more.
+title: Symbology Customization in WinUI Barcode | Syncfusion®
+description: Symbology customization in the WinUI Barcode allows you to configure encoding options and customize barcode generation for different barcode types.
platform: chart-sdk
control: Barcode
documentation: ug
diff --git a/chart-sdk/winui/barcode/Symbology-Types.md b/chart-sdk/winui/barcode/Symbology-Types.md
index a8fa155bf..3aab59603 100644
--- a/chart-sdk/winui/barcode/Symbology-Types.md
+++ b/chart-sdk/winui/barcode/Symbology-Types.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Symbology Types in WinUI Barcode control | Syncfusion
-description: Learn here all about Symbology Types feature in Syncfusion WinUI Barcode control and it supports many variants of one and two-dimensional barcodes.
+title: Symbology Types in WinUI Barcode | Syncfusion®
+description: Symbology types in the WinUI Barcode support a wide range of one-dimensional and two-dimensional barcode formats for data encoding.
platform: chart-sdk
control: Barcode
documentation: ug
diff --git a/chart-sdk/winui/funnel-chart/Appearance.md b/chart-sdk/winui/funnel-chart/Appearance.md
index ef9a7773f..37a100911 100644
--- a/chart-sdk/winui/funnel-chart/Appearance.md
+++ b/chart-sdk/winui/funnel-chart/Appearance.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Appearance in WinUI Funnel Chart control | Syncfusion
-description: This section explains how to apply palettes and gradients in the Syncfusion® WinUI Chart (SfFunnelChart) control.
+title: Appearance in WinUI Funnel Chart | Syncfusion®
+description: Appearance in the WinUI Funnel Chart allows you to customize chart visuals using palettes, gradients, and styling options for enhanced presentation.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Appearance in WinUI Chart (SfFunnelChart)
+# Appearance in WinUI Funnel Chart
The appearance of the [SfFunnelChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfFunnelChart.html) can be customized by using the predefined palettes, custom palettes, and gradients, which help enrich the application.
diff --git a/chart-sdk/winui/funnel-chart/Data-label.md b/chart-sdk/winui/funnel-chart/Data-label.md
index 94f7300f2..edbcea366 100644
--- a/chart-sdk/winui/funnel-chart/Data-label.md
+++ b/chart-sdk/winui/funnel-chart/Data-label.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Data label in WinUI Funnel Chart control | Syncfusion
-description: This section explains how to add and customize the data labels in the Syncfusion® WinUI Chart (SfFunnelChart) control.
+title: Data Label in WinUI Funnel Chart | Syncfusion®
+description: Data labels in the WinUI Funnel Chart display values directly on chart segments and support customization of content, position, and appearance.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Data Label in WinUI Chart (SfFunnelChart)
+# Data Label in WinUI Funnel Chart
To improve the readability of data in the funnel chart, data points can be easily annotated with data labels.
diff --git a/chart-sdk/winui/funnel-chart/Explode-segments.md b/chart-sdk/winui/funnel-chart/Explode-segments.md
index 3c632b986..5e9c23cfc 100644
--- a/chart-sdk/winui/funnel-chart/Explode-segments.md
+++ b/chart-sdk/winui/funnel-chart/Explode-segments.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Explode segments in WinUI Funnel Chart control | Syncfusion
-description: This section explains how to explode a single segment or all segments in the Syncfusion® WinUI Chart (SfFunnelChart) control.
+title: Explode Segments in WinUI Funnel Chart | Syncfusion®
+description: Explode segments in the WinUI Funnel Chart emphasize individual or multiple chart segments for improved data visibility and analysis.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Explode Segments in WinUI Chart (SfFunnelChart)
+# Explode Segments in WinUI Funnel Chart
Exploding a segment is used to draw attention to a specific area of the funnel. The following properties are used to explode the segments in the funnel chart.
diff --git a/chart-sdk/winui/funnel-chart/Getting-Started.md b/chart-sdk/winui/funnel-chart/Getting-Started.md
index f6abc1b76..74a5997ae 100644
--- a/chart-sdk/winui/funnel-chart/Getting-Started.md
+++ b/chart-sdk/winui/funnel-chart/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting started with WinUI Funnel Chart control | Syncfusion
-description: Learn here all about getting started with Syncfusion® WinUI Funnel Chart (SfFunnelChart) control, its elements, and more.
+title: Getting Started with WinUI Funnel Chart | Syncfusion®
+description: Learn how to get started with the Syncfusion® WinUI Funnel Chart control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Getting Started with WinUI Funnel Chart (SfFunnelChart)
+# Getting Started with WinUI Funnel Chart
This section explains how to populate the [WinUI Funnel Chart](https://www.syncfusion.com/winui-controls/charts/winui-funnel-chart) with data, a header, data labels, legend, and tooltips, as well as the essential aspects for getting started with the chart.
diff --git a/chart-sdk/winui/funnel-chart/Legend.md b/chart-sdk/winui/funnel-chart/Legend.md
index 0fb1fdda5..e8acc7b1a 100644
--- a/chart-sdk/winui/funnel-chart/Legend.md
+++ b/chart-sdk/winui/funnel-chart/Legend.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Legend in WinUI Funnel Chart control | Syncfusion
-description: This section explains how to configure the legend and its features such as title, icons, labels, and template in the WinUI Chart (SfFunnelChart).
+title: Legend in WinUI Funnel Chart | Syncfusion®
+description: Legend in the WinUI Funnel Chart identifies chart segments and categories, supporting customization of titles, labels, icons, and templates.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Legend in WinUI Chart (SfFunnelChart)
+# Legend in WinUI Funnel Chart
The legend contains a list of series data points in the chart. The information provided in each legend item helps you to identify the corresponding data series in the chart.
diff --git a/chart-sdk/winui/funnel-chart/Neck-width.md b/chart-sdk/winui/funnel-chart/Neck-width.md
index 0d4e3c683..5ae31c1ae 100644
--- a/chart-sdk/winui/funnel-chart/Neck-width.md
+++ b/chart-sdk/winui/funnel-chart/Neck-width.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Neck width in WinUI Chart control | Syncfusion
-description: This section explains how to customize the neck width in the Syncfusion® WinUI Chart (SfFunnelChart) control.
+title: Neck Width in WinUI Funnel Chart | Syncfusion®
+description: Neck width in the WinUI Funnel Chart controls the width of the funnel neck, enabling customization of chart appearance and data presentation.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Neck Width in WinUI Chart (SfFunnelChart)
+# Neck Width in WinUI Funnel Chart
The neck width of the funnel chart can be customized by using the [MinimumWidth](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfFunnelChart.html#Syncfusion_UI_Xaml_Charts_SfFunnelChart_MinimumWidth) property. The default value of the [MinimumWidth](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfFunnelChart.html#Syncfusion_UI_Xaml_Charts_SfFunnelChart_MinimumWidth) property is 40. The following code example explains how to change the neck width.
diff --git a/chart-sdk/winui/funnel-chart/Overview.md b/chart-sdk/winui/funnel-chart/Overview.md
index c2cbb13ca..802a226ae 100644
--- a/chart-sdk/winui/funnel-chart/Overview.md
+++ b/chart-sdk/winui/funnel-chart/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About WinUI Funnel Chart control | Syncfusion
-description: Learn here all about the introduction of the Syncfusion® WinUI Chart (SfFunnelChart) control with key features and more.
+title: About Syncfusion® WinUI Funnel Chart Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® WinUI Funnel Chart control, its features, capabilities, and more details.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# WinUI Chart (SfFunnelChart) Overview
+# About Syncfusion® WinUI Funnel Chart Control
Syncfusion® WinUI Funnel Chart (SfFunnelChart) is used to create beautiful funnel series to analyze the various stages in a process, and it is used in high-quality WinUI applications.
diff --git a/chart-sdk/winui/funnel-chart/Rendering-mode.md b/chart-sdk/winui/funnel-chart/Rendering-mode.md
index d2be2484b..23734f2e1 100644
--- a/chart-sdk/winui/funnel-chart/Rendering-mode.md
+++ b/chart-sdk/winui/funnel-chart/Rendering-mode.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Rendering Mode in WinUI Chart (SfFunnelChart) | Syncfusion
-description: This section explains the rendering mode types of the Syncfusion® WinUI Chart (SfFunnelChart) control.
+title: Rendering Mode in WinUI Funnel Chart | Syncfusion®
+description: Rendering mode in the WinUI Funnel Chart controls how funnel segments are displayed, enabling different visual representations of data.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Rendering Mode in WinUI Chart (SfFunnelChart)
+# Rendering Mode in WinUI Funnel Chart
The [Mode](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfFunnelChart.html#Syncfusion_UI_Xaml_Charts_SfFunnelChart_Mode) property defines the rendering mode of the funnel chart, which defines where to bind your values (to height or width). The default value of the [Mode](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfFunnelChart.html#Syncfusion_UI_Xaml_Charts_SfFunnelChart_Mode) property is [ValueIsHeight](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartFunnelMode.html#Syncfusion_UI_Xaml_Charts_ChartFunnelMode_ValueIsHeight). The following example demonstrates [ValueIsHeight](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartFunnelMode.html#Syncfusion_UI_Xaml_Charts_ChartFunnelMode_ValueIsHeight) and [ValueIsWidth](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartFunnelMode.html#Syncfusion_UI_Xaml_Charts_ChartFunnelMode_ValueIsWidth) of funnel mode.
diff --git a/chart-sdk/winui/funnel-chart/Segment-spacing.md b/chart-sdk/winui/funnel-chart/Segment-spacing.md
index e78da96e9..bedbf7e62 100644
--- a/chart-sdk/winui/funnel-chart/Segment-spacing.md
+++ b/chart-sdk/winui/funnel-chart/Segment-spacing.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Segment Spacing in WinUI Chart (SfFunnelChart) | Syncfusion
-description: This section explains how to set segment spacing for the Syncfusion® WinUI Chart (SfFunnelChart) control.
+title: Segment Spacing in WinUI Funnel Chart | Syncfusion®
+description: Segment spacing in the WinUI Funnel Chart controls the gap between funnel segments, improving visual clarity and chart presentation.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Segment Spacing in WinUI Chart (SfFunnelChart)
+# Segment Spacing in WinUI Funnel Chart
The gap between each segment in the funnel chart can be set using the [GapRatio](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfFunnelChart.html#Syncfusion_UI_Xaml_Charts_SfFunnelChart_GapRatio) property. The default value of the [GapRatio](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfFunnelChart.html#Syncfusion_UI_Xaml_Charts_SfFunnelChart_GapRatio) property is 0, and its value ranges from 0 to 1.
diff --git a/chart-sdk/winui/funnel-chart/Selection.md b/chart-sdk/winui/funnel-chart/Selection.md
index 8b41fc966..f57104018 100644
--- a/chart-sdk/winui/funnel-chart/Selection.md
+++ b/chart-sdk/winui/funnel-chart/Selection.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Selection in WinUI Funnel Chart control | Syncfusion
-description: Learn here all about selection and multi-selection support in Syncfusion® WinUI Chart (SfFunnelChart) control.
+title: Selection in WinUI Funnel Chart | Syncfusion®
+description: Selection in the WinUI Funnel Chart enables users to highlight and interact with chart segments, supporting single and multi-selection.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Selection in WinUI Chart (SfFunnelChart)
+# Selection in WinUI Funnel Chart
The funnel chart supports selection that allows the selection of a segment in the chart by using the [SelectionBehavior](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfFunnelChart.html#Syncfusion_UI_Xaml_Charts_SfFunnelChart_SelectionBehavior).
diff --git a/chart-sdk/winui/funnel-chart/Title.md b/chart-sdk/winui/funnel-chart/Title.md
index 4fcfd49d5..301a19a1d 100644
--- a/chart-sdk/winui/funnel-chart/Title.md
+++ b/chart-sdk/winui/funnel-chart/Title.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Title in WinUI Funnel Chart control | Syncfusion
-description: Learn here all about the title with the Syncfusion® WinUI Chart (SfFunnelChart) control and its customization.
+title: Title in WinUI Funnel Chart | Syncfusion®
+description: Title in the WinUI Funnel Chart displays descriptive text for the chart and supports customization of content, style, and appearance.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Chart Title in WinUI Chart (SfFunnelChart)
+# Title in WinUI Funnel Chart
The [Header](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_Header) property is used to define the title for the chart.
diff --git a/chart-sdk/winui/funnel-chart/Tooltip.md b/chart-sdk/winui/funnel-chart/Tooltip.md
index 8050540d2..0962d594d 100644
--- a/chart-sdk/winui/funnel-chart/Tooltip.md
+++ b/chart-sdk/winui/funnel-chart/Tooltip.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Tooltip in WinUI Funnel Chart control | Syncfusion
-description: This section explains how to enable the tooltip and its customization in the Syncfusion® WinUI Chart (SfFunnelChart) control.
+title: Tooltip in WinUI Funnel Chart | Syncfusion®
+description: Tooltip in the WinUI Funnel Chart displays detailed information about chart segments on hover and supports customization of content and appearance.
platform: chart-sdk
control: SfFunnelChart
documentation: ug
---
-# Tooltip in WinUI Chart (SfFunnelChart)
+# Tooltip in WinUI Funnel Chart
Tooltip is used to display any information over segments. It appears at the data point position when the mouse hovers over any chart segment. It is set to display the metadata of the hovered segment or data point.
diff --git a/chart-sdk/winui/linear-gauge/animation.md b/chart-sdk/winui/linear-gauge/animation.md
index 60522c371..5627c1909 100644
--- a/chart-sdk/winui/linear-gauge/animation.md
+++ b/chart-sdk/winui/linear-gauge/animation.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Animation in WinUI linear Gauge control | Syncfusion
-description: Learn here all about Animation support in Syncfusion WinUI linear Gauge (SfLinearGauge) control and more.
+title: Animation in WinUI Linear Gauge | Syncfusion®
+description: Animation in the WinUI Linear Gauge enables smooth transitions for gauge elements, enhancing data visualization and user experience.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
---
-# Animation in WinUI linear Gauge (Linear Gauge)
+# Animation in WinUI Linear Gauge
## Pointer animation
diff --git a/chart-sdk/winui/linear-gauge/axes.md b/chart-sdk/winui/linear-gauge/axes.md
index cd876720c..f9c56559d 100644
--- a/chart-sdk/winui/linear-gauge/axes.md
+++ b/chart-sdk/winui/linear-gauge/axes.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Axis in WinUI Linear Gauge control | Syncfusion
-description: Learn here all about Axis feature of Syncfusion WinUI Linear Gauge control with customization support.
+title: Axis in WinUI Linear Gauge | Syncfusion®
+description: Axis in the WinUI Linear Gauge defines the scale, ranges, intervals, and labels for accurate measurement and data visualization.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
diff --git a/chart-sdk/winui/linear-gauge/bar-pointer.md b/chart-sdk/winui/linear-gauge/bar-pointer.md
index 18131d7ce..87ce78112 100644
--- a/chart-sdk/winui/linear-gauge/bar-pointer.md
+++ b/chart-sdk/winui/linear-gauge/bar-pointer.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Bar Pointer in WinUI Linear Gauge control | Syncfusion
-description: Learn here all about Bar Pointer support in Syncfusion WinUI Linear Gauge control with size and style custom support.
+title: Bar Pointer in WinUI Linear Gauge | Syncfusion®
+description: Bar pointer in the WinUI Linear Gauge displays values as filled bars and supports customization of size, style, and appearance settings.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
diff --git a/chart-sdk/winui/linear-gauge/content-pointer.md b/chart-sdk/winui/linear-gauge/content-pointer.md
index 2c40cf0ea..f0582ab6e 100644
--- a/chart-sdk/winui/linear-gauge/content-pointer.md
+++ b/chart-sdk/winui/linear-gauge/content-pointer.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Content Pointer in WinUI Linear Gauge control | Syncfusion
-description: Learn here all about Content Pointer feature of Syncfusion WinUI Linear Gauge control with customization support and more.
+title: Content Pointer in WinUI Linear Gauge | Syncfusion®
+description: Content pointer in the WinUI Linear Gauge displays custom content at specific values and supports customization of layout, style, and appearance.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
diff --git a/chart-sdk/winui/linear-gauge/getting-started.md b/chart-sdk/winui/linear-gauge/getting-started.md
index 65982af49..66733ee84 100644
--- a/chart-sdk/winui/linear-gauge/getting-started.md
+++ b/chart-sdk/winui/linear-gauge/getting-started.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Getting Started with WinUI Linear Gauge control | Syncfusion
-description: Learn here all about getting started with Syncfusion WinUI Linear Gauge(sfLinearGauge) control, its elements, and more.
+title: Getting Started with WinUI Linear Gauge | Syncfusion®
+description: Learn how to get started with the Syncfusion® WinUI Linear Gauge control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
diff --git a/chart-sdk/winui/linear-gauge/overview.md b/chart-sdk/winui/linear-gauge/overview.md
index 3f99d3647..72e214232 100644
--- a/chart-sdk/winui/linear-gauge/overview.md
+++ b/chart-sdk/winui/linear-gauge/overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About WinUI Linear Gauge control | Syncfusion
-description: Learn here all about introduction of Syncfusion WinUI Linear Gauge(sfLinearGauge) control with axis, ranges and more.
+title: About Syncfusion® WinUI Linear Gauge Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® WinUI Linear Gauge control, its features, capabilities, and more details.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
---
-# WinUI Linear Gauge Overview
+# About Syncfusion® WinUI Linear Gauge Control
The [WinUI Linear Gauge](https://www.syncfusion.com/winui-controls/linear-gauge) control is a multipurpose data visualization control that displays numerical values on a linear scale horizontally or vertically.
diff --git a/chart-sdk/winui/linear-gauge/pointers.md b/chart-sdk/winui/linear-gauge/pointers.md
index 752bbda7e..8d03677cc 100644
--- a/chart-sdk/winui/linear-gauge/pointers.md
+++ b/chart-sdk/winui/linear-gauge/pointers.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Pointers in WinUI Linear Gauge control | Syncfusion
-description: Learn here all about Pointers feature of Syncfusion WinUI Linear Gauge control with multiple pointer support and more.
+title: Pointers in WinUI Linear Gauge | Syncfusion®
+description: Pointers in the WinUI Linear Gauge indicate values on the gauge scale and support multiple pointer types for effective data visualization.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
diff --git a/chart-sdk/winui/linear-gauge/ranges.md b/chart-sdk/winui/linear-gauge/ranges.md
index 036ed8927..d0761a751 100644
--- a/chart-sdk/winui/linear-gauge/ranges.md
+++ b/chart-sdk/winui/linear-gauge/ranges.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Range in WinUI Linear Gauge control | Syncfusion
-description: Learn here all about Range feature of Syncfusion WinUI Linear Gauge control with customization support.
+title: Range in WinUI Linear Gauge | Syncfusion®
+description: Range in the WinUI Linear Gauge highlights specific value intervals on the gauge scale and supports customization of size, position, and appearance.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
diff --git a/chart-sdk/winui/linear-gauge/shape-pointer.md b/chart-sdk/winui/linear-gauge/shape-pointer.md
index b2a2aa788..73af9bf90 100644
--- a/chart-sdk/winui/linear-gauge/shape-pointer.md
+++ b/chart-sdk/winui/linear-gauge/shape-pointer.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Shape Pointer in WinUI Linear Gauge control | Syncfusion
-description: Learn here all about Shape Pointer feature of Syncfusion WinUI Linear Gauge control with custom support.
+title: Shape Pointer in WinUI Linear Gauge | Syncfusion®
+description: Shape pointer in the WinUI Linear Gauge indicates values using customizable shapes and supports styling, positioning, and appearance settings.
platform: chart-sdk
control: SfLinearGauge
documentation: ug
diff --git a/chart-sdk/winui/polar-chart/Appearance.md b/chart-sdk/winui/polar-chart/Appearance.md
index ab11442a7..c94c94de1 100644
--- a/chart-sdk/winui/polar-chart/Appearance.md
+++ b/chart-sdk/winui/polar-chart/Appearance.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Appearance in WinUI Polar Chart control | Syncfusion
-description: This section explains how to apply palettes and gradients in the Syncfusion® WinUI Chart (SfPolarChart) control.
+title: Appearance in WinUI Polar Chart | Syncfusion®
+description: Appearance in the WinUI Polar Chart allows you to customize chart visuals using palettes, gradients, and styling options for enhanced presentation.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Appearance in WinUI Chart (SfPolarChart)
+# Appearance in WinUI Polar Chart
The appearance of the [SfPolarChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPolarChart.html) can be customized by using predefined palettes, custom palettes, and gradients, which help enrich the application.
diff --git a/chart-sdk/winui/polar-chart/Axis-Header.md b/chart-sdk/winui/polar-chart/Axis-Header.md
index f5a3fc987..f93d17d88 100644
--- a/chart-sdk/winui/polar-chart/Axis-Header.md
+++ b/chart-sdk/winui/polar-chart/Axis-Header.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Axis title in WinUI Chart control | Syncfusion
-description: Learn here all about the chart axis title of Syncfusion® WinUI Chart (SfPolarChart) control and its customization.
+title: Axis Title in WinUI Polar Chart | Syncfusion®
+description: Axis title in the WinUI Polar Chart displays descriptive text for chart axes and supports customization of content, style, and appearance.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Axis Title in WinUI Chart (SfPolarChart)
+# Axis Title in WinUI Polar Chart
The [Header](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartAxis.html#Syncfusion_UI_Xaml_Charts_ChartAxis_Header) property is used to define the title for the chart axis. It accepts any `UIElement` as content for the chart axis header.
diff --git a/chart-sdk/winui/polar-chart/Axis-Labels.md b/chart-sdk/winui/polar-chart/Axis-Labels.md
index 1409b9c38..45a71563b 100644
--- a/chart-sdk/winui/polar-chart/Axis-Labels.md
+++ b/chart-sdk/winui/polar-chart/Axis-Labels.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Axis labels in WinUI Polar Chart control | Syncfusion
-description: Learn here all about the chart axis labels and its customization in the Syncfusion® WinUI Chart (SfPolarChart) control.
+title: Axis Labels in WinUI Polar Chart | Syncfusion®
+description: Axis labels in the WinUI Polar Chart display values and categories, supporting customization of formatting, positioning, and appearance settings.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Axis labels in WinUI Chart
+# Axis Labels in WinUI Polar Chart
The axis labels are used to show the units, measures, or category values of the axis to visualize the data. It will be generated based on the range and values bound to the series in the chart.
diff --git a/chart-sdk/winui/polar-chart/Axis-Types.md b/chart-sdk/winui/polar-chart/Axis-Types.md
index b11961b5e..26cda121d 100644
--- a/chart-sdk/winui/polar-chart/Axis-Types.md
+++ b/chart-sdk/winui/polar-chart/Axis-Types.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Axis types in WinUI Polar Chart control | Syncfusion
-description: Learn here all about the axis types and its features in the Syncfusion® WinUI Chart (SfPolarChart) control.
+title: Axis Types in WinUI Polar Chart | Syncfusion®
+description: Axis types in the WinUI Polar Chart provide different ways to represent data values, categories, dates, and logarithmic scales.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Types of Axis in WinUI Chart (SfPolarChart)
+# Axis Types in WinUI Polar Chart
Polar chart supports the following types of chart axis.
diff --git a/chart-sdk/winui/polar-chart/DataLabel.md b/chart-sdk/winui/polar-chart/DataLabel.md
index 82bd473ea..7b825fa0f 100644
--- a/chart-sdk/winui/polar-chart/DataLabel.md
+++ b/chart-sdk/winui/polar-chart/DataLabel.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Data labels in WinUI Chart (SfPolarChart) | Syncfusion
-description: This section explains how to configure the data labels and its features in the Syncfusion® WinUI Chart (SfPolarChart) control.
+title: Data Labels in WinUI Polar Chart | Syncfusion®
+description: Data labels in the WinUI Polar Chart display data values directly on chart points and support customization of content, position, and appearance.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Data Label in WinUI Chart (SfPolarChart)
+# Data Labels in WinUI Polar Chart
Data labels are used to display values related to a chart segment. Values from data points (x, y) or other custom properties from a data source can be displayed.
diff --git a/chart-sdk/winui/polar-chart/Getting-Started.md b/chart-sdk/winui/polar-chart/Getting-Started.md
index 866cb0af4..2368931d2 100644
--- a/chart-sdk/winui/polar-chart/Getting-Started.md
+++ b/chart-sdk/winui/polar-chart/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting Started with WinUI Polar Chart control | Syncfusion
-description: Learn here all about getting started with the Syncfusion® WinUI Polar Chart (SfPolarChart) control and its elements, and more.
+title: Getting Started with WinUI Polar Chart | Syncfusion®
+description: Learn how to get started with the Syncfusion® WinUI Polar Chart control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Getting Started with WinUI Polar Chart (SfPolarChart)
+# Getting Started with WinUI Polar Chart
This section explains how to populate the [WinUI Polar Chart](https://www.syncfusion.com/winui-controls/charts/winui-polar-chart) with data, header, data labels, legend, and tooltips, as well as the essential aspects for getting started with the chart.
diff --git a/chart-sdk/winui/polar-chart/Legend.md b/chart-sdk/winui/polar-chart/Legend.md
index a8277e137..dee01d28c 100644
--- a/chart-sdk/winui/polar-chart/Legend.md
+++ b/chart-sdk/winui/polar-chart/Legend.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Legend in WinUI Polar Chart control | Syncfusion
-description: This section explains how to configure the legend and its features, such as title, icons, labels, and template, in the WinUI Chart (SfPolarChart).
+title: Legend in WinUI Polar Chart | Syncfusion®
+description: Legend in the WinUI Polar Chart identifies data series and chart elements, supporting customization of titles, labels, icons, and templates.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Legend in WinUI Chart (SfPolarChart)
+# Legend in WinUI Polar Chart
The legend contains a list of series in the chart. The information provided in each legend item helps to identify the corresponding series in the chart. The legend can be configured using the [Legend](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_Legend) property of [SfPolarChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPolarChart.html).
diff --git a/chart-sdk/winui/polar-chart/Overview.md b/chart-sdk/winui/polar-chart/Overview.md
index bc8c8d108..861d34c7f 100644
--- a/chart-sdk/winui/polar-chart/Overview.md
+++ b/chart-sdk/winui/polar-chart/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About WinUI Polar Chart control | Syncfusion
-description: Learn here all about the introduction of the Syncfusion® WinUI Chart (SfPolarChart) control with key features and more.
+title: About Syncfusion® WinUI Polar Chart Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® WinUI Polar Chart control, its features, capabilities, and more details.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# WinUI Chart (SfPolarChart) Overview
+# About Syncfusion® WinUI Polar Chart Control
Syncfusion® WinUI Polar Chart is used to create beautiful polar series to visualize the data in terms of values and angles, which are used in high-quality WinUI applications. The polar chart is also known as a star chart, spider chart, web chart, spider web chart, cobweb chart, and radar chart.
diff --git a/chart-sdk/winui/polar-chart/Polar-Area.md b/chart-sdk/winui/polar-chart/Polar-Area.md
index 653706d15..adf2f765f 100644
--- a/chart-sdk/winui/polar-chart/Polar-Area.md
+++ b/chart-sdk/winui/polar-chart/Polar-Area.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Polar area chart | SfPolarChart | Syncfusion
-description: Learn here all about the polar area chart and its features in Syncfusion® WinUI Chart (SfPolarChart) control.
+title: Area Chart in WinUI Polar Chart | Syncfusion®
+description: Polar area chart in the WinUI Polar Chart visualizes data using filled radial areas, enabling comparison of values across categories and angles.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Polar Area Chart in WinUI Charts (SfPolarChart)
+# Area Chart in WinUI Polar Chart
To render an area series in the polar chart, create an instance of the [PolarAreaSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.PolarAreaSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPolarChart.html#Syncfusion_UI_Xaml_Charts_SfPolarChart_Series) collection property of [SfPolarChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPolarChart.html). To plot the series, the [XBindingPath](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartSeries.html#Syncfusion_UI_Xaml_Charts_ChartSeries_XBindingPath) and [YBindingPath](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.PolarSeries.html#Syncfusion_UI_Xaml_Charts_PolarSeries_YBindingPath) properties must be configured, and the [Label](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartSeries.html#Syncfusion_UI_Xaml_Charts_ChartSeries_Label) property can be set for legend purposes.
diff --git a/chart-sdk/winui/polar-chart/Polar-Line.md b/chart-sdk/winui/polar-chart/Polar-Line.md
index 0f4b6706f..0b6b442e6 100644
--- a/chart-sdk/winui/polar-chart/Polar-Line.md
+++ b/chart-sdk/winui/polar-chart/Polar-Line.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Polar line chart | SfPolarChart | Syncfusion
-description: Learn here all about the polar line chart and its features in Syncfusion® WinUI Chart (SfPolarChart) control.
+title: Line Chart in WinUI Polar Chart | Syncfusion®
+description: Polar line chart in the WinUI Polar Chart visualizes data using radial lines, enabling comparison of values across categories and angular coordinates.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Polar Line Chart in WinUI Charts (SfPolarChart)
+# Line Chart in WinUI Polar Chart
To render a line series in the polar chart, create an instance of the [PolarLineSeries](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.PolarLineSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPolarChart.html#Syncfusion_UI_Xaml_Charts_SfPolarChart_Series) collection property of [SfPolarChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPolarChart.html). To plot the series, the [XBindingPath](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartSeries.html#Syncfusion_UI_Xaml_Charts_ChartSeries_XBindingPath) and [YBindingPath](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.PolarSeries.html#Syncfusion_UI_Xaml_Charts_PolarSeries_YBindingPath) properties must be configured, and the [Label](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartSeries.html#Syncfusion_UI_Xaml_Charts_ChartSeries_Label) property can be set for legend purposes.
diff --git a/chart-sdk/winui/polar-chart/StartAngle.md b/chart-sdk/winui/polar-chart/StartAngle.md
index 0774150b0..a40a29aab 100644
--- a/chart-sdk/winui/polar-chart/StartAngle.md
+++ b/chart-sdk/winui/polar-chart/StartAngle.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Start angle in WinUI Chart control | Syncfusion
-description: This section explains how to change the angle position of rendering in the Syncfusion® WinUI Chart (SfPolarChart) control.
+title: Rendering Position in WinUI Polar Chart | Syncfusion®
+description: Rendering Position in the WinUI Polar Chart controls the initial rendering position of chart data, enabling customization of angular orientation.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Rendering Position in WinUI Chart (SfPolarChart)
+# Rendering Position in WinUI Polar Chart
By using the [StartAngle](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPolarChart.html#Syncfusion_UI_Xaml_Charts_SfPolarChart_StartAngle) property of the polar chart, you can modify the rendering position of the series to four degree values: 0, 90, 180, and 270. The default value of the [StartAngle](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPolarChart.html#Syncfusion_UI_Xaml_Charts_SfPolarChart_StartAngle) property is [Rotate270](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartPolarAngle.html#Syncfusion_UI_Xaml_Charts_ChartPolarAngle_Rotate270).
diff --git a/chart-sdk/winui/polar-chart/Title.md b/chart-sdk/winui/polar-chart/Title.md
index 885f347c2..909bd3e8a 100644
--- a/chart-sdk/winui/polar-chart/Title.md
+++ b/chart-sdk/winui/polar-chart/Title.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Title in WinUI Polar Chart control | Syncfusion
-description: Learn here all about the title in Syncfusion® WinUI Chart (SfPolarChart) control and its customization.
+title: Title in WinUI Polar Chart | Syncfusion®
+description: Title in the WinUI Polar Chart displays descriptive text for the chart and supports customization of content, style, and appearance.
platform: chart-sdk
control: SfPolarChart
documentation: ug
---
-# Chart Title in WinUI Chart (SfPolarChart)
+# Title in WinUI Polar Chart
[Header](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_Header) property is used to define the title for the chart.
diff --git a/chart-sdk/winui/pyramid-chart/Appearance.md b/chart-sdk/winui/pyramid-chart/Appearance.md
index e91e5be3c..6371a621c 100644
--- a/chart-sdk/winui/pyramid-chart/Appearance.md
+++ b/chart-sdk/winui/pyramid-chart/Appearance.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Appearance in WinUI Pyramid Chart control | Syncfusion
-description: This section explains how to apply palettes and gradients in the Syncfusion® WinUI Chart (SfPyramidChart) control.
+title: Appearance in WinUI Pyramid Chart | Syncfusion®
+description: Appearance in the WinUI Pyramid Chart allows you to customize chart visuals using palettes, gradients, and styling options for enhanced presentation.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Appearance in WinUI Chart (SfPyramidChart)
+# Appearance in WinUI Pyramid Chart
The appearance of the [SfPyramidChart](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPyramidChart.html) can be customized by using the predefined palette, custom palette, and gradient, which allows enriching the application.
diff --git a/chart-sdk/winui/pyramid-chart/Data-label.md b/chart-sdk/winui/pyramid-chart/Data-label.md
index caf8d5909..805e85e4f 100644
--- a/chart-sdk/winui/pyramid-chart/Data-label.md
+++ b/chart-sdk/winui/pyramid-chart/Data-label.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Data Labels for WinUI Pyramid Chart (SfPyramidChart) | Syncfusion
-description: This section explains how to add and customize the data labels in the Syncfusion® WinUI Chart (SfPyramidChart) control.
+title: Data Labels in WinUI Pyramid Chart | Syncfusion®
+description: Data labels in the WinUI Pyramid Chart display values directly on chart segments and support customization of content, position, and appearance.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Data Label in WinUI Chart (SfPyramidChart)
+# Data Labels in WinUI Pyramid Chart
To improve the readability of data in the pyramid chart, data points can be easily annotated with data labels.
diff --git a/chart-sdk/winui/pyramid-chart/Explode-segments.md b/chart-sdk/winui/pyramid-chart/Explode-segments.md
index 3284a6c01..b837f54f5 100644
--- a/chart-sdk/winui/pyramid-chart/Explode-segments.md
+++ b/chart-sdk/winui/pyramid-chart/Explode-segments.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Explode segments in WinUI Pyramid Chart control | Syncfusion
-description: This section explains how to explode a single segment or all segments in the Syncfusion® WinUI Chart (SfPyramidChart) control.
+title: Explode Segments in WinUI Pyramid Chart | Syncfusion®
+description: Explode segments in the WinUI Pyramid Chart emphasize individual or multiple chart segments for improved data visibility and analysis.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Explode Segments in WinUI Chart (SfPyramidChart)
+# Explode Segments in WinUI Pyramid Chart
Exploding a segment is used to draw attention to a specific area of the pyramid. The following properties are used to explode the segments in the pyramid chart.
diff --git a/chart-sdk/winui/pyramid-chart/Getting-Started.md b/chart-sdk/winui/pyramid-chart/Getting-Started.md
index 677ca5b00..1255a54d7 100644
--- a/chart-sdk/winui/pyramid-chart/Getting-Started.md
+++ b/chart-sdk/winui/pyramid-chart/Getting-Started.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Getting started with WinUI Pyramid Chart control | Syncfusion
-description: This section explains getting started with the Syncfusion® WinUI Pyramid Chart (SfPyramidChart) control, its elements, and more.
+title: Getting Started with WinUI Pyramid Chart | Syncfusion®
+description: Learn how to get started with the Syncfusion® WinUI Pyramid Chart control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Getting started with WinUI Pyramid Chart (SfPyramidChart)
+# Getting Started with WinUI Pyramid Chart
This section explains how to populate the [WinUI Pyramid Chart](https://www.syncfusion.com/winui-controls/charts/winui-pyramid-chart) with data, a header, data labels, legend, and tooltips, as well as the essential aspects for getting started with the chart.
diff --git a/chart-sdk/winui/pyramid-chart/Legend.md b/chart-sdk/winui/pyramid-chart/Legend.md
index 19bbe38b8..f3b112f19 100644
--- a/chart-sdk/winui/pyramid-chart/Legend.md
+++ b/chart-sdk/winui/pyramid-chart/Legend.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Legend in WinUI Pyramid Chart control | Syncfusion
-description: This section explains how to configure the legend and its features title, icons, labels, and template in the WinUI Chart (SfPyramidChart) control.
+title: Legend in WinUI Pyramid Chart | Syncfusion®
+description: Legend in the WinUI Pyramid Chart identifies chart segments and categories, supporting customization of titles, labels, icons, and templates.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Legend in WinUI Chart (SfPyramidChart)
+# Legend in WinUI Pyramid Chart
The legend contains a list of series data points in the chart. The information provided in each legend item helps you to identify the corresponding data in the chart.
diff --git a/chart-sdk/winui/pyramid-chart/Overview.md b/chart-sdk/winui/pyramid-chart/Overview.md
index d9c28dfa7..96e019900 100644
--- a/chart-sdk/winui/pyramid-chart/Overview.md
+++ b/chart-sdk/winui/pyramid-chart/Overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About WinUI Pyramid Chart control | Syncfusion
-description: Learn here all about the introduction of the Syncfusion® WinUI Chart (SfPyramidChart) control with key features and more.
+title: About Syncfusion® WinUI Pyramid Chart Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® WinUI Pyramid Chart control, its features, capabilities, and more details.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# WinUI Chart (SfPyramidChart) Overview
+# About Syncfusion® WinUI Pyramid Chart Control
Syncfusion® [WinUI Chart](https://www.syncfusion.com/winui-controls/charts) (SfPyramidChart) is used to create beautiful pyramid series to visualize proportions of a total in hierarchies, which are used in high-quality WinUI applications.
diff --git a/chart-sdk/winui/pyramid-chart/Rendering-mode.md b/chart-sdk/winui/pyramid-chart/Rendering-mode.md
index 22443a6fb..7ce1d7396 100644
--- a/chart-sdk/winui/pyramid-chart/Rendering-mode.md
+++ b/chart-sdk/winui/pyramid-chart/Rendering-mode.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Rendering Modes for WinUI Pyramid Chart | Syncfusion
-description: This section explains the rendering surface mode and linear mode of the Syncfusion® WinUI Chart (SfPyramidChart) control.
+title: Rendering Modes in WinUI Pyramid Chart | Syncfusion®
+description: Rendering modes in the WinUI Pyramid Chart control how pyramid segments are displayed, enabling surface and linear visual representations of data.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Rendering Mode in WinUI Chart (SfPyramidChart)
+# Rendering Modes in WinUI Pyramid Chart
The [Mode](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPyramidChart.html#Syncfusion_UI_Xaml_Charts_SfPyramidChart_Mode) property is used to define the rendering mode of the pyramid chart such as [Surface](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartPyramidMode.html#Syncfusion_UI_Xaml_Charts_ChartPyramidMode_Surface) or [Linear](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartPyramidMode.html#Syncfusion_UI_Xaml_Charts_ChartPyramidMode_Linear). The default value of the [Mode](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPyramidChart.html#Syncfusion_UI_Xaml_Charts_SfPyramidChart_Mode) property is `Linear`.
diff --git a/chart-sdk/winui/pyramid-chart/Segment-spacing.md b/chart-sdk/winui/pyramid-chart/Segment-spacing.md
index b886747b1..58c5e6f3e 100644
--- a/chart-sdk/winui/pyramid-chart/Segment-spacing.md
+++ b/chart-sdk/winui/pyramid-chart/Segment-spacing.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Segment Gap Ratio in WinUI Pyramid Chart | Syncfusion
-description: This section explains how to set segment spacing for the Syncfusion® WinUI Chart (SfPyramidChart) control.
+title: Segment Spacing in WinUI Pyramid Chart | Syncfusion®
+description: Segment Spacing in the WinUI Pyramid Chart controls the spacing between pyramid segments, improving visual clarity and chart presentation.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Segment Spacing in WinUI Chart (SfPyramidChart)
+# Segment Spacing in WinUI Pyramid Chart
The gap between each segment in the pyramid chart can be set using the [GapRatio](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPyramidChart.html#Syncfusion_UI_Xaml_Charts_SfPyramidChart_GapRatio) property. The default value of [GapRatio](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPyramidChart.html#Syncfusion_UI_Xaml_Charts_SfPyramidChart_GapRatio) property is 0 and its value ranges from 0 to 1.
diff --git a/chart-sdk/winui/pyramid-chart/Selection.md b/chart-sdk/winui/pyramid-chart/Selection.md
index bb6727358..bfba6abda 100644
--- a/chart-sdk/winui/pyramid-chart/Selection.md
+++ b/chart-sdk/winui/pyramid-chart/Selection.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Selection in WinUI Pyramid Chart control | Syncfusion
-description: Learn here all about selection and multi-selection support in Syncfusion® WinUI Chart (SfPyramidChart) control.
+title: Selection in WinUI Pyramid Chart | Syncfusion®
+description: Selection in the WinUI Pyramid Chart enables users to highlight and interact with chart segments, supporting single and multi-selection.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Selection in WinUI Chart (SfPyramidChart)
+# Selection in WinUI Pyramid Chart
The pyramid chart supports selection, which allows the selection of a segment in the chart by using the [SelectionBehavior](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.SfPyramidChart.html#Syncfusion_UI_Xaml_Charts_SfPyramidChart_SelectionBehavior).
diff --git a/chart-sdk/winui/pyramid-chart/Title.md b/chart-sdk/winui/pyramid-chart/Title.md
index 99d4f2206..7a8de3fd9 100644
--- a/chart-sdk/winui/pyramid-chart/Title.md
+++ b/chart-sdk/winui/pyramid-chart/Title.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Title in WinUI Pyramid Chart control | Syncfusion
-description: Learn here all about the title with the Syncfusion® WinUI Chart (SfPyramidChart) control and its customization.
+title: Title in WinUI Pyramid Chart | Syncfusion®
+description: Title in the WinUI Pyramid Chart displays descriptive text for the chart and supports customization of content, style, and appearance.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Chart Title in WinUI Chart (SfPyramidChart)
+# Title in WinUI Pyramid Chart
[Header](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.ChartBase.html#Syncfusion_UI_Xaml_Charts_ChartBase_Header) property is used to define the title of the chart.
diff --git a/chart-sdk/winui/pyramid-chart/Tooltip.md b/chart-sdk/winui/pyramid-chart/Tooltip.md
index c01553609..24b725395 100644
--- a/chart-sdk/winui/pyramid-chart/Tooltip.md
+++ b/chart-sdk/winui/pyramid-chart/Tooltip.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Tooltip in WinUI Pyramid Chart control | Syncfusion
-description: This section explains how to enable the tooltip and its customization in the Syncfusion® WinUI Chart (SfPyramidChart) control.
+title: Tooltip in WinUI Pyramid Chart | Syncfusion®
+description: Tooltip in the WinUI Pyramid Chart displays detailed information about chart segments on hover and supports customization of content and appearance.
platform: chart-sdk
control: SfPyramidChart
documentation: ug
---
-# Tooltip in WinUI Chart (SfPyramidChart)
+# Tooltip in WinUI Pyramid Chart
Tooltip is used to display information over segments. It appears at the data point position when the mouse hovers over any chart segment. It is set to display the metadata of the hovered segment or data point.
diff --git a/chart-sdk/winui/radial-gauge/animation.md b/chart-sdk/winui/radial-gauge/animation.md
index c830fd093..54c15c1ca 100644
--- a/chart-sdk/winui/radial-gauge/animation.md
+++ b/chart-sdk/winui/radial-gauge/animation.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Animation in WinUI Radial Gauge control | Syncfusion
-description: Learn here all about Animation feature of Syncfusion WinUI Radial Gauge control with pointer animation support and more.
+title: Animation in WinUI Radial Gauge | Syncfusion®
+description: Animation in the WinUI Radial Gauge enables smooth transitions for gauge pointers and elements, enhancing data visualization and user experience.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
diff --git a/chart-sdk/winui/radial-gauge/annotation.md b/chart-sdk/winui/radial-gauge/annotation.md
index b6b77e8f9..bc31f11b2 100644
--- a/chart-sdk/winui/radial-gauge/annotation.md
+++ b/chart-sdk/winui/radial-gauge/annotation.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Annotation in WinUI Radial Gauge control | Syncfusion
-description: Learn here all about Annotation feature of Syncfusion WinUI Radial Gauge control with positioning support and more.
+title: Annotation in WinUI Radial Gauge | Syncfusion®
+description: Annotation in the WinUI Radial Gauge enables custom content to be positioned within the gauge, enhancing data presentation and visualization.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
diff --git a/chart-sdk/winui/radial-gauge/axes.md b/chart-sdk/winui/radial-gauge/axes.md
index 53fa2e4ad..c2ebcfef4 100644
--- a/chart-sdk/winui/radial-gauge/axes.md
+++ b/chart-sdk/winui/radial-gauge/axes.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Axis in WinUI Radial Gauge control | Syncfusion
-description: Learn here all about Axis feature of Syncfusion WinUI Radial Gauge(SfRadialGauge) control with custom support.
+title: Axis in WinUI Radial Gauge | Syncfusion®
+description: Axis in the WinUI Radial Gauge defines the scale, ranges, intervals, and labels for accurate measurement and data visualization.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
diff --git a/chart-sdk/winui/radial-gauge/content-pointer.md b/chart-sdk/winui/radial-gauge/content-pointer.md
index d79b44219..de58876b1 100644
--- a/chart-sdk/winui/radial-gauge/content-pointer.md
+++ b/chart-sdk/winui/radial-gauge/content-pointer.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Content pointer in WinUI Radial Gauge control | Syncfusion
-description: Learn here all about content pointer feature of Syncfusion WinUI Radial Gauge control with image, text and customization support.
+title: Content Pointer in WinUI Radial Gauge | Syncfusion®
+description: Content pointer in the WinUI Radial Gauge displays custom text and images at specific values and supports layout and appearance customization.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
---
-# Content pointer in WinUI Radial Gauge
+# Content Pointer in WinUI Radial Gauge
The [`ContentPointer`](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Gauges.ContentPointer.html) in [`SfRadialGauge`](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Gauges.SfRadialGauge.html) allows you to use any content as a pointer using the [`Content`](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Gauges.ContentPointer.html#Syncfusion_UI_Xaml_Gauges_ContentPointer_Content) property of it.
diff --git a/chart-sdk/winui/radial-gauge/getting-started.md b/chart-sdk/winui/radial-gauge/getting-started.md
index c536c0a20..1307be99b 100644
--- a/chart-sdk/winui/radial-gauge/getting-started.md
+++ b/chart-sdk/winui/radial-gauge/getting-started.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Getting Started with WinUI Radial Gauge control | Syncfusion
-description: Learn here all about getting started with Syncfusion WinUI Radial Gauge(SfRadialGauge) control and more.
+title: Getting Started with WinUI Radial Gauge | Syncfusion®
+description: Learn how to get started with the Syncfusion® WinUI Radial Gauge control. Explore setup, features, examples, and customization options.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
diff --git a/chart-sdk/winui/radial-gauge/needle-pointer.md b/chart-sdk/winui/radial-gauge/needle-pointer.md
index 94cdb4803..56b5f46be 100644
--- a/chart-sdk/winui/radial-gauge/needle-pointer.md
+++ b/chart-sdk/winui/radial-gauge/needle-pointer.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Needle Pointer in WinUI Radial Gauge control | Syncfusion
-description: Learn here all about Needle Pointer feature of Syncfusion WinUI Radial Gauge control with customization support.
+title: Needle Pointer in WinUI Radial Gauge | Syncfusion®
+description: Needle pointer in the WinUI Radial Gauge indicates values on the gauge scale and supports customization of style, size, and appearance.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
diff --git a/chart-sdk/winui/radial-gauge/overview.md b/chart-sdk/winui/radial-gauge/overview.md
index c95ebd122..66fea8acd 100644
--- a/chart-sdk/winui/radial-gauge/overview.md
+++ b/chart-sdk/winui/radial-gauge/overview.md
@@ -1,13 +1,13 @@
---
layout: post
-title: About WinUI Radial Gauge control | Syncfusion
-description: Learn here all about introduction of Syncfusion WinUI Radial Gauge(SfRadialGauge) control with key features and more.
+title: About Syncfusion® WinUI Radial Gauge Control | Syncfusion®
+description: Learn about the introduction of Syncfusion Essential Studio® WinUI Radial Gauge control, its features, capabilities, and more details.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
---
-# WinUI Radial Gauge Overview
+# About Syncfusion® WinUI Radial Gauge Control
The Syncfusion [WinUI Radial Gauge](https://www.syncfusion.com/winui-controls/radial-gauge) is a multi-purpose data visualization control that displays numerical values on a circular scale. It has a rich set of features such as axes, ranges, pointers, and annotations that are fully customizable and extendable. Use it to create speedometers, temperature monitors, dashboards, meter gauges, multi-axis clocks, watches, activity gauges, compasses, and more.
diff --git a/chart-sdk/winui/radial-gauge/pointers.md b/chart-sdk/winui/radial-gauge/pointers.md
index a9ece3224..7e4755be7 100644
--- a/chart-sdk/winui/radial-gauge/pointers.md
+++ b/chart-sdk/winui/radial-gauge/pointers.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Pointers in WinUI Radial Gauge control | Syncfusion
-description: Learn here all about Pointers feature of Syncfusion WinUI Radial Gauge control with multiple pointer support and more.
+title: Pointers in WinUI Radial Gauge | Syncfusion®
+description: Pointers in the WinUI Radial Gauge indicate values on the gauge scale and support multiple pointer types for effective data visualization.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
diff --git a/chart-sdk/winui/radial-gauge/range-pointer.md b/chart-sdk/winui/radial-gauge/range-pointer.md
index 287d224b6..9e4e93715 100644
--- a/chart-sdk/winui/radial-gauge/range-pointer.md
+++ b/chart-sdk/winui/radial-gauge/range-pointer.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Range Pointer in WinUI Radial Gauge control | Syncfusion
-description: Learn here all about Range Pointer feature of Syncfusion WinUI Radial Gauge control with customization support.
+title: Range Pointer in WinUI Radial Gauge | Syncfusion®
+description: Range pointer in the WinUI Radial Gauge highlights values across a specified range and supports customization of size, position, and appearance.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
diff --git a/chart-sdk/winui/radial-gauge/ranges.md b/chart-sdk/winui/radial-gauge/ranges.md
index a08b85cf8..d1b4cdcd1 100644
--- a/chart-sdk/winui/radial-gauge/ranges.md
+++ b/chart-sdk/winui/radial-gauge/ranges.md
@@ -1,7 +1,7 @@
---
layout: post
-title: Range in WinUI Radial Gauge control | Syncfusion
-description: Learn here all about Range feature of Syncfusion WinUI Radial Gauge control with customization support and more.
+title: Range in WinUI Radial Gauge | Syncfusion®
+description: Range in the WinUI Radial Gauge highlights specific value intervals on the gauge scale and supports customization of size, position, and appearance.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
diff --git a/chart-sdk/winui/radial-gauge/shape-pointer.md b/chart-sdk/winui/radial-gauge/shape-pointer.md
index 70fc9d0df..dbad7f289 100644
--- a/chart-sdk/winui/radial-gauge/shape-pointer.md
+++ b/chart-sdk/winui/radial-gauge/shape-pointer.md
@@ -1,13 +1,13 @@
---
layout: post
-title: Shape pointer in WinUI Radial Gauge control | Syncfusion
-description: Learn here all about shape pointer feature of Syncfusion WinUI Radial Gauge control with customization support.
+title: Shape Pointer in WinUI Radial Gauge | Syncfusion®
+description: Shape pointer in the WinUI Radial Gauge indicates values using customizable shapes and supports styling, positioning, and appearance settings.
platform: chart-sdk
control: SfRadialGauge
documentation: ug
---
-# Shape pointer in WinUI Radial Gauge
+# Shape Pointer in WinUI Radial Gauge
The [`ShapePointer`](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Gauges.ShapePointer.html) in [`SfRadialGauge`](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Gauges.SfRadialGauge.html) allows you to use any built-in shapes as a pointer to mark a specified value. The default type is [`InvertedTriangle`](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Gauges.GaugeShapeType.html#Syncfusion_UI_Xaml_Gauges_GaugeShapeType_InvertedTriangle).
diff --git a/chart-toc.html b/chart-toc.html
index 5422cd708..75f8f0f7b 100644
--- a/chart-toc.html
+++ b/chart-toc.html
@@ -5208,6 +5208,7 @@