Merge pull request #1407 from syncfusion-content/1027486_Review_Suggestions_WinUI

Ensure Live UG Updates and Address Review Suggestions for WinUI charts

Author: SaiyathAliFathima

winui/Circular-Charts/DataLabels.md

@@ -118,7 +118,7 @@ The following properties are used to customize the data label.
             FontFamily="Calibri" 
             BorderBrush="Black" 
             BorderThickness="1"
-		    Margin="1" 
+            Margin="1" 
             FontStyle="Italic"
             Background="#1E88E5"
             Context="Percentage"/>
@@ -177,10 +177,10 @@ The appearance of the data label can be customized using [ContentTemplate](https
                     StrokeThickness="2"/>
                 <TextBlock 
                     HorizontalAlignment="Center" 
-	                FontSize="12"
+                    FontSize="12"
                     Foreground="Black" 
                     FontWeight="SemiBold"
-	                Text="{Binding Item.Product}"/>
+                    Text="{Binding Item.Product}"/>
             </StackPanel>
         </DataTemplate>
     </Grid.Resources>
@@ -191,7 +191,7 @@ The appearance of the data label can be customized using [ContentTemplate](https
             <chart:PieSeries.DataLabelSettings>
                 <chart:CircularDataLabelSettings 
                         Position="Inside"
-			            ContentTemplate="{StaticResource labelTemplate}"
+                        ContentTemplate="{StaticResource labelTemplate}"
                         Context="DataLabelItem"/>
             </chart:PieSeries.DataLabelSettings>
         </chart:PieSeries>
@@ -248,8 +248,8 @@ The following are the values for this property:
         <chart:PieSeries.DataLabelSettings>
             <chart:CircularDataLabelSettings 
                 Position="OutsideExtended"
-			    ShowConnectorLine="True"
-			    Context="Percentage"/>
+                ShowConnectorLine="True"
+                Context="Percentage"/>
         </chart:PieSeries.DataLabelSettings>
     </chart:PieSeries>
     . . .
@@ -293,8 +293,8 @@ chart.Series.Add(series);
         <chart:PieSeries.DataLabelSettings>
             <chart:CircularDataLabelSettings 
                 Context="Percentage"
-			    Position="Outside"
-			    Rotation="335"/>
+                Position="Outside"
+                Rotation="335"/>
         </chart:PieSeries.DataLabelSettings>
     </chart:PieSeries>
     . . .
@@ -351,11 +351,11 @@ The connector line can be customized using the below properties.
             <chart:PieSeries.DataLabelSettings>
                 <chart:CircularDataLabelSettings
                     Position="Outside"
-			         Context="Percentage"
-			         ShowConnectorLine="True"
-			         ConnectorHeight="40"
-			         ConnectorType="StraightLine"
-			         ConnectorLineStyle="{StaticResource lineStyle}"/>
+                    Context="Percentage"
+                    ShowConnectorLine="True"
+                    ConnectorHeight="40"
+                    ConnectorType="StraightLine"
+                    ConnectorLineStyle="{StaticResource lineStyle}"/>
             </chart:PieSeries.DataLabelSettings>
         </chart:PieSeries>
     </chart:SfCircularChart>
@@ -402,7 +402,7 @@ chart.Series.Add(series);
         <chart:PieSeries.DataLabelSettings>
             <chart:CircularDataLabelSettings
                 ConnectorType="Bezier"
-			    ConnectorHeight="40"
+                ConnectorHeight="40"
                 Position="Outside"
                 ShowConnectorLine="True"/>
         </chart:PieSeries.DataLabelSettings>
@@ -449,10 +449,10 @@ The [UseSeriesPalette](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.C
     <chart:PieSeries ShowDataLabels="True">
         <chart:PieSeries.DataLabelSettings>
             <chart:CircularDataLabelSettings
-                 UseSeriesPalette="True" 
-			     ShowConnectorLine="True" 
-			     ConnectorHeight="40"
-			     Position="Outside"/>
+                UseSeriesPalette="True" 
+                ShowConnectorLine="True" 
+                ConnectorHeight="40"
+                Position="Outside"/>
         </chart:PieSeries.DataLabelSettings>
     </chart:PieSeries>
 </chart:SfCircularChart>

winui/Circular-Charts/Selection.md

@@ -170,8 +170,8 @@ The circular chart provides support to select multiple points programmatically o
             <chart:PieSeries.SelectionBehavior>
                 <chart:DataPointSelectionBehavior
                     SelectionBrush="BlueViolet"
-				    Type="Multiple" 
-				    SelectedIndexes="{Binding SelectedIndexes}"/>
+                    Type="Multiple" 
+                    SelectedIndexes="{Binding SelectedIndexes}"/>
             </chart:PieSeries.SelectionBehavior>
         </chart:PieSeries>
     </chart:SfCircularChart.Series>

winui/Funnel-Chart/Appearance.md

@@ -39,9 +39,7 @@ chart.SetBinding(SfFunnelChart.ItemsSourceProperty, new Binding()
 
 chart.XBindingPath = "Category";
 chart.YBindingPath = "Value";
-
 . . .
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -102,9 +100,7 @@ chart.SetBinding(SfFunnelChart.ItemsSourceProperty, new Binding()
 chart.XBindingPath = "Category";
 chart.YBindingPath = "Value";
 chart.PaletteBrushes = CustomBrushes;
-
 . . .            
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -198,14 +194,10 @@ stop2 = new GradientStop()
 
 gradientColor2.GradientStops.Add(stop1);
 gradientColor2.GradientStops.Add(stop2);
-
 . . .
-
 customBrushes.Add(gradientColor1);
 customBrushes.Add(gradientColor2);
-
 . . .
-
 chart.SetBinding(SfFunnelChart.ItemsSourceProperty, new Binding()
 { 
     Path = new PropertyPath("Data")
@@ -214,9 +206,7 @@ chart.SetBinding(SfFunnelChart.ItemsSourceProperty, new Binding()
 chart.XBindingPath = "Category";
 chart.YBindingPath = "Value";
 chart.PaletteBrushes = customBrushes;
-
 . . .            
-
 this.Content = chart;
 
 {% endhighlight %}

winui/Funnel-Chart/Data-label.md

@@ -43,9 +43,7 @@ chart.SetBinding(SfFunnelChart.ItemsSourceProperty, new Binding()
 
 chart.XBindingPath = "Category";
 chart.YBindingPath = "Value";
-
-. . . 
-
+. . .
 this.Content = chart;
 
 {% endhighlight %}
@@ -82,9 +80,7 @@ To customize the content of data labels, need to define [DataLabelSettings](http
 SfFunnelChart chart = new SfFunnelChart();
 
 chart.ShowDataLabels = true;
-
 . . . 
-
 chart.DataLabelSettings = new FunnelDataLabelSettings() 
 { 
     Context = LabelContext.Percentage 
@@ -143,9 +139,7 @@ The following properties are used to customize the data label:
 SfFunnelChart chart = new SfFunnelChart();
 
 chart.ShowDataLabels = true;
-
 . . .
-
 chart.DataLabelSettings = new FunnelDataLabelSettings()
 {
     Foreground = new SolidColorBrush(Colors.White),
@@ -231,9 +225,7 @@ The appearance of the data label can be customized by using the [ContentTemplate
 SfFunnelChart chart = new SfFunnelChart();
 
 chart.ShowDataLabels = true;
-
 . . . 
-
 chart.DataLabelSettings = new FunnelDataLabelSettings() 
 { 
     Context = LabelContext.YValue,
@@ -276,9 +268,7 @@ The [Format](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.Char
 SfFunnelChart chart = new SfFunnelChart();
 
 chart.ShowDataLabels = true;
-
 . . . 
-
 chart.DataLabelSettings = new FunnelDataLabelSettings() 
 {  
     Format = "#.000",
@@ -310,9 +300,9 @@ The [Rotation](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.Ch
     <chart:SfFunnelChart.DataLabelSettings>
         <chart:FunnelDataLabelSettings 
             Rotation="45" 
-		    BorderBrush="White"
-		    BorderThickness="1"
-		    Background="#1E88E5"/>
+            BorderBrush="White"
+            BorderThickness="1"
+            Background="#1E88E5"/>  
     </chart:SfFunnelChart.DataLabelSettings>
 </chart:SfFunnelChart>
 
@@ -323,9 +313,7 @@ The [Rotation](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Charts.Ch
 SfFunnelChart chart = new SfFunnelChart();
 
 chart.ShowDataLabels = true;
-
 . . . 
-
 chart.DataLabelSettings = new FunnelDataLabelSettings() 
 { 
     Rotation = 45,

winui/Funnel-Chart/Explode-segments.md

@@ -43,9 +43,7 @@ chart.XBindingPath = "Category";
 chart.YBindingPath = "Value";
 chart.ExplodeIndex = 3;
 chart.ExplodeOffset = 30;
-
 . . . 
-
 this.Content = chart;
 
 {% endhighlight %}

winui/Funnel-Chart/Getting-Started.md

@@ -35,18 +35,14 @@ This section explains how to populate the [WinUI Funnel Chart](https://www.syncf
 {% highlight C# %}
 
 using Syncfusion.UI.Xaml.Charts;
-
 . . .
-
 public sealed partial class MainWindow : Window
 {
     public MainWindow()
     {
         this.InitializeComponent();
         SfFunnelChart chart = new SfFunnelChart();
-
         . . .
-        
         this.Content = chart;
     }
 }   

winui/Funnel-Chart/Legend.md

@@ -11,7 +11,7 @@ documentation: ug
 
 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.
 
-N> The x-value of data points in the funnel chart will be the legend items ‘Label’.
+N> The x-value of data points in the funnel chart will be the legend items `Label`.
 
 {% tabs %}
 
@@ -83,9 +83,7 @@ TextBlock textBlock = new TextBlock()
 
 legend.Header = textBlock;
 chart.Legend = legend;
-
 . . .
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -130,9 +128,7 @@ chart.Legend = new ChartLegend()
     IconHeight = 15,
     IconVisibility = Visibility.Visible,
 };
-
 . . .
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -167,9 +163,7 @@ chart.Legend = new ChartLegend()
 {
     ItemMargin = new Thickness(10)
 };
-
 . . .
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -204,9 +198,7 @@ chart.Legend = new ChartLegend()
 {
    CheckBoxVisibility = Visibility.Visible
 };
-
 . . .
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -241,9 +233,7 @@ chart.Legend = new ChartLegend()
 {
    ToggleSeriesVisibility = true
 };
-
 . . .
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -281,9 +271,7 @@ chart.Legend = new ChartLegend()
    Placement = LegendPlacement.Right,
    ItemMargin = new Thickness(10),
 };
-
 . . .
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -331,9 +319,7 @@ chart.Legend = new ChartLegend()
     BorderThickness = new Thickness(1),
     CornerRadius = new CornerRadius(5)
 };
-
 . . .
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -383,9 +369,7 @@ chart.Legend = new ChartLegend()
 {
    ItemTemplate = grid.Resources["labelTemplate"] as DataTemplate
 };
-
 . . .
-
 this.Content = chart;
 
 {% endhighlight %}

winui/Funnel-Chart/Neck-width.md

@@ -36,9 +36,7 @@ chart.SetBinding(SfFunnelChart.ItemsSourceProperty, new Binding()
 chart.XBindingPath = "Category";
 chart.YBindingPath = "Value";
 chart.MinimumWidth = 20;
-
 . . . 
-
 this.Content = chart;
 
 {% endhighlight %}
@@ -75,9 +73,7 @@ chart.SetBinding(SfFunnelChart.ItemsSourceProperty, new Binding()
 chart.XBindingPath = "Category";
 chart.YBindingPath = "Value";
 chart.MinimumWidth = 0;
-
 . . . 
-
 this.Content = chart;
 
 {% endhighlight %}

winui/Funnel-Chart/Rendering-mode.md

@@ -41,9 +41,7 @@ chart.SetBinding(SfFunnelChart.ItemsSourceProperty,new Binding()
 chart.XBindingPath = "Category";
 chart.YBindingPath = "Value";
 chart.Mode = ChartFunnelMode.ValueIsHeight;
-
 . . .
-
 this.Content = chart;
 
 
@@ -83,9 +81,7 @@ chart.SetBinding(SfFunnelChart.ItemsSourceProperty, new Binding()
 chart.XBindingPath = "Category";
 chart.YBindingPath = "Value";
 chart.Mode = ChartFunnelMode.ValueIsWidth;
-
 . . . 
-
 this.Content = chart;
 
 {% endhighlight %}