Add kb article for pie chart series color updates

controls/chart/types/cartesian-chart.md

@@ -79,6 +79,10 @@ The Financial Cartesian Chart supports the following series:
 - [Candlestick Series]({%slug chart-series-candlestick-series%})—Data points are plotted as visuals that resemble candlesticks.
 - [Financial Indicators Series]({%slug chart-series-financial-indicators%})—The financial, or also called stock indicators, are mainly used for keeping track of stock prices and patterns of price changes over time.
 
+## Customize the Chart Colors
+
+You can take advantage of the available customization options the Chart control provides. You can change the default Chart and series colors by setting a `Palette`. For more details on the suggested implementation, see the [Creating Custom Chart Palettes KB article]({%slug chart-how-to-create-custom-palette%}).
+
 ## Example
 
 **1.** Define the `RadCartesianChart`:
@@ -130,7 +134,6 @@ The Financial Cartesian Chart supports the following series:
 xmlns:local="clr-namespace:[The namespace where the ViewModel class is defined];assembly=[The assembly name]"
 ```
 
-
 ## Cartesian Chart Example
 
 The following example shows the full definition of the chart.
@@ -170,6 +173,8 @@ The following image shows the final result:
 
 ![Cartesian Chart](images/cartesian-bar-series-basic-example.png)
 
+For a sample example 
+
 ## See Also
 
 - [Pie Chart]({%slug chart-types-pie-chart%})

controls/chart/types/pie-chart.md

@@ -2,7 +2,7 @@
 title: Pie Chart
 page_title: .NET MAUI Chart Documentation - Pie Chart
 position: 2
-description: Check our "Pie Chart" documentation article for Telerik Chart for .NET MAUI
+description: Learn how to configure the Telerik UI for .NET MAUI PieChart control.
 previous_url: /controls/chart/types/chart-types-pie-chart
 slug: chart-types-pie-chart
 ---
@@ -24,38 +24,13 @@ The Pie Chart supports the following properties:
 
 ## Series
 
-The Pie Chart supports the Pie Series, which visualize a single series of data in a pie chart. The sweep of a pie slice is directly proportional to the magnitude of the data point values.
+The PieChart supports the Pie Series, which visualize a single series of data in a pie chart. The sweep of a pie slice is directly proportional to the magnitude of the data point values.
 
-## Example
+## Customize the Chart Colors
 
-**1.** Define the `RadPieChart`:  
+You can take advantage of the available customization options the Chart control provides. You can change the default Chart and series colors by setting a `Palette`. For more details on the suggested implementation, see the [Creating Custom PieChart Palettes KB article]({%slug pie-chart-custom-colors%}).
 
-```XAML
-<telerik:RadPieChart>
-</telerik:RadPieChart>
-```
-
-**2.** Add the series to the `RadPieChart.Series` collection:
-
-```XAML
-<telerik:RadPieChart.Series>
-	<telerik:PieSeries ItemsSource="{Binding Data}">
-		<telerik:PieSeries.ValueBinding>
-			<telerik:PropertyNameDataPointBinding PropertyName="Value"/>
-		</telerik:PieSeries.ValueBinding>
-	</telerik:PieSeries>
-</telerik:RadPieChart.Series>
-```
-
-**3.** Set the `BindingContext` of the chart if none of its parents has a context:
-
-```XAML
-<telerik:RadPieChart.BindingContext>
-	<local:ViewModel/>
-</telerik:RadPieChart.BindingContext>
-```
-
-## Pie Chart Example
+## PieChart Example
 
 The following example shows the full definition of the chart.
 

knowledge-base/chart-create-custom-palette.md

@@ -12,12 +12,16 @@ res_type: kb
 
 | Version | Product | Author | 
 | --- | --- | ---- | 
-| 6.6.0 | Chart for .NET MAUI | [Dobrinka Yordanova](https://www.telerik.com/blogs/author/dobrinka-yordanova)| 
+| 10.0.0 | Chart for .NET MAUI | [Dobrinka Yordanova](https://www.telerik.com/blogs/author/dobrinka-yordanova)| 
 
 
 ## Description
 
-How can I use custom colors in the Telerik UI for .NET MAUI Chart?
+I want to change the default colors of the bar series in the CartesianChart. How can I achieve this?
+
+This knowledge base article also answers the following questions:
+- How can I use custom colors in the Telerik UI for .NET MAUI CartesianChart?
+- How can I change the color on the CartesianChart `BarSeries`?
 
 ## Solution
 
@@ -34,11 +38,11 @@ The Chart supports the following default set of colors for displaying its data p
 
 To modify the default built-in colors, implement a custom palette, as demonstrated in the following scenario:
 
-**1.** Create the needed business model:
+**1.** Create a sample `DataModel`:
 
 <snippet id='categorical-data-model'/>
 
-**2.** Use the sample data for the binding context:
+**2.** Define the `ViewModel` class:
 
 ```C#
 public class ViewModel
@@ -94,7 +98,7 @@ public class ViewModel
 }
 ```
 
-**3.** Declare the `RadCartesianChart` in XAML:
+**3.** Define the `RadCartesianChart` in XAML:
 
 ```XAML
 <telerik:RadCartesianChart>
@@ -146,13 +150,13 @@ public class ViewModel
 </telerik:RadCartesianChart>
 ```
 
-And the namespace used: 
+**4.** Add the `telerik` namespace: 
 
 ```XAML
 xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"
 ```
 
 The following image shows the end result of the suggested implementation.
 
-![Chart Custom Palette](images/chart-how-to-create-custom-palette.png)
+![Telerik UI for .NET MAUI Chart Custom Palette](images/chart-how-to-create-custom-palette.png)
 

knowledge-base/pie-chart-custom-colors.md

@@ -0,0 +1,118 @@
+---
+title: Creating Custom PieChart Palettes
+page_title: Adding Custom Colors to the PieChart - .NET MAUI Knowledge Base
+description: Learn how to customize the colors of the Telerik UI for .NET MAUI PieChart component.
+type: how-to
+slug: pie-chart-custom-colors
+tags: maui, chart, color, custom, palette, pie chart, donut chart
+res_type: kb
+---
+
+## Environment
+
+| Version | Product | Author | 
+| --- | --- | ---- | 
+| 10.0.0 | PieChart for .NET MAUI | [Dobrinka Yordanova](https://www.telerik.com/blogs/author/dobrinka-yordanova)| 
+
+
+## Description
+
+I want to change the default colors of the PieChart for donut or pie series.
+
+This knowledge base article also answers the following questions:
+- How can I use custom colors in the Telerik UI for .NET MAUI PieChart?
+- How can I change the color on the Telerik `DonutSeries` or `PieSeries`?
+
+## Solution
+
+The PieChart supports the following default set of colors for displaying its data points:
+
+* `#0078D4`
+* `#EA005E`
+* `#60CCFE`
+* `#0093F9`
+* `#00B7C3`
+* `#FFB900`
+* `#C239B3`
+* `#6B69D6`
+
+To modify the default built-in colors, implement a custom palette, as demonstrated in the following scenario:
+
+**1.** Create a sample  `DataModel`:
+
+<snippet id='categorical-data-model'/>
+
+**2.** Define the `ViewModel` class:
+
+```C#
+public class ViewModel
+{
+	public ObservableCollection<CategoricalData> Data { get; set; }
+
+	public ViewModel()
+	{
+		this.Data = GetCategoricalData();
+	}
+
+	private static ObservableCollection<CategoricalData> GetCategoricalData()
+	{
+		var data = new ObservableCollection<CategoricalData>
+		{
+			new CategoricalData { Category = "Greenings", Value = 52 },
+			new CategoricalData { Category = "Perfecto", Value = 19 },
+			new CategoricalData { Category = "NearBy", Value = 82 },
+			new CategoricalData { Category = "Family", Value = 23 },
+			new CategoricalData { Category = "Fresh", Value = 56 },
+		};
+		return data;
+	}
+}
+```
+
+**3.** Define the `RadPieChart` with `DonutSeries` in XAML:
+
+```XAML
+<telerik:RadPieChart HeightRequest="400" WidthRequest="300">
+	<telerik:RadPieChart.BindingContext>
+		<local:ViewModel />
+	</telerik:RadPieChart.BindingContext>
+	<telerik:RadPieChart.Palette>
+		<telerik:ChartPalette>
+			<telerik:ChartPalette.Entries>
+				<telerik:PaletteEntry FillColor="#4FB6E7" StrokeColor="#4FB6E7" />
+				<telerik:PaletteEntry FillColor="#A666CE" StrokeColor="#A666CE" />
+				<telerik:PaletteEntry FillColor="#9DCC00" StrokeColor="#9DCC00" />
+			</telerik:ChartPalette.Entries>
+		</telerik:ChartPalette>
+	</telerik:RadPieChart.Palette>
+	<telerik:RadPieChart.SelectionPalette>
+		<telerik:ChartPalette>
+			<telerik:ChartPalette.Entries>
+				<telerik:PaletteEntry FillColor="#4FB6E7" StrokeColor="#4D4D4D" />
+				<telerik:PaletteEntry FillColor="#A666CE" StrokeColor="#4D4D4D" />
+				<telerik:PaletteEntry FillColor="#9DCC00" StrokeColor="#4D4D4D" />
+			</telerik:ChartPalette.Entries>
+		</telerik:ChartPalette>
+	</telerik:RadPieChart.SelectionPalette>
+	<telerik:RadPieChart.Series>
+		<telerik:DonutSeries ShowLabels="True"
+                    InnerRadiusFactor="0.4"
+                    ValueBinding="Value"
+                    ItemsSource="{Binding Data}" />
+	</telerik:RadPieChart.Series>
+	<telerik:RadPieChart.ChartBehaviors>
+		<telerik:ChartSelectionBehavior DataPointSelectionMode="Single"  />
+	</telerik:RadPieChart.ChartBehaviors>
+</telerik:RadPieChart>
+```
+
+**4.** Add the `telerik` namespace: 
+
+```XAML
+xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"
+```
+
+The following image shows the end result of the suggested implementation.
+
+![Telerik UI for .NET MAUI PieChart with Custom Colors for Donut Series](images/pie-chart-palette.png)
+

spell-ignore.txt

@@ -79,5 +79,7 @@ scaffolding
 scaffoldings
 GridSplitter
 DataPager
+CartesianChart
+PieChart
 TextInput
 telerik