Skip to content

Commit 59b9157

Browse files
Merge pull request #3 from SyncfusionExamples/917099-Update-GettingStarted_CircularChart_MAUI_sample
917099-Updated Getting Started Circular Chart MAUI sample
2 parents ec36283 + 58cb872 commit 59b9157

File tree

3 files changed

+35
-33
lines changed

3 files changed

+35
-33
lines changed

Circular_chart_sample/CircularChartSample/MainPage.xaml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
</chart:SfCircularChart.Title>
1414

1515
<chart:SfCircularChart.BindingContext>
16-
<model:ViewModel />
16+
<model:SalesViewModel />
1717
</chart:SfCircularChart.BindingContext>
1818

1919
<chart:SfCircularChart.Legend>

Circular_chart_sample/CircularChartSample/ViewModel.cs

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -6,23 +6,23 @@
66

77
namespace CircularChartSample
88
{
9-
public class ViewModel
10-
{
11-
public List<Sales> Data { get; set; }
9+
public class SalesViewModel
10+
{
11+
public List<SalesModel> Data { get; set; }
1212

13-
public ViewModel()
14-
{
15-
Data = new List<Sales>()
13+
public SalesViewModel()
1614
{
17-
new Sales(){Product = "iPad", SalesRate = 70},
18-
new Sales(){Product = "iPhone", SalesRate = 65},
19-
new Sales(){Product = "MacBook", SalesRate = 60},
20-
new Sales(){Product = "Mac", SalesRate = 55},
21-
new Sales(){Product = "Others", SalesRate = 50},
22-
};
15+
Data = new List<SalesModel>()
16+
{
17+
new SalesModel(){Product = "iPad", SalesRate = 70},
18+
new SalesModel(){Product = "iPhone", SalesRate = 65},
19+
new SalesModel(){Product = "MacBook", SalesRate = 60},
20+
new SalesModel(){Product = "Mac", SalesRate = 55},
21+
new SalesModel(){Product = "Others", SalesRate = 50},
22+
};
2323
}
2424
}
25-
public class Sales
25+
public class SalesModel
2626
{
2727
public string Product { get; set; }
2828
public double SalesRate { get; set; }

README.md

Lines changed: 21 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ public partial class MainWindow : ContentPage
2727
{
2828
this.InitializeComponent();
2929
SfCircularChart chart = new SfCircularChart();
30+
this.Content = chart;
3031
}
3132
}
3233
```
@@ -70,37 +71,37 @@ namespace ChartGettingStarted
7071
Now, let us define a simple data model that represents a data point in the chart.
7172
###### C#
7273
```C#
73-
public class Sales
74+
public class SalesModel
7475
{
7576
public string Product { get; set; }
7677
public double SalesRate { get; set; }
7778
}
7879
```
7980

80-
Next, create a view model class and initialize a list of `Model` objects as follows.
81+
Next, create a SalesViewModel class and initialize a list of `SalesModel` objects as follows.
8182
######
8283
```C#
83-
public class ChartViewModel
84+
public class SalesViewModel
8485
{
85-
public List<Sales> Data { get; set; }
86+
public List<SalesModel> Data { get; set; }
8687

87-
public ChartViewModel()
88+
public SalesViewModel()
8889
{
89-
Data = new List<Sales>()
90+
Data = new List<SalesModel>()
9091
{
91-
new Sales(){Product = "iPad", SalesRate = 25},
92-
new Sales(){Product = "iPhone", SalesRate = 35},
93-
new Sales(){Product = "MacBook", SalesRate = 15},
94-
new Sales(){Product = "Mac", SalesRate = 5},
95-
new Sales(){Product = "Others", SalesRate = 10},
92+
new SalesModel(){Product = "iPad", SalesRate = 25},
93+
new SalesModel(){Product = "iPhone", SalesRate = 35},
94+
new SalesModel(){Product = "MacBook", SalesRate = 15},
95+
new SalesModel(){Product = "Mac", SalesRate = 5},
96+
new SalesModel(){Product = "Others", SalesRate = 10},
9697
};
9798
}
9899
}
99100
```
100101

101-
* Create a `ViewModel` instance and set it as the chart's `BindingContext`. This enables property binding from `ViewModel` class.
102+
* Create a `SalesViewModel` instance and set it as the chart's `BindingContext`. This enables property binding from `SalesViewModel` class.
102103

103-
* Add namespace of `ViewModel` class to your XAML Page, if you prefer to set `BindingContext` in XAML.
104+
* Add namespace of `SalesViewModel` class to your XAML Page, if you prefer to set `BindingContext` in XAML.
104105
###### Xaml
105106
```xaml
106107
<ContentPage
@@ -110,15 +111,16 @@ public class ChartViewModel
110111

111112
<chart:SfCircularChart>
112113
<chart:SfCircularChart.BindingContext>
113-
<model:ChartViewModel/>
114+
<model:SalesViewModel/>
114115
</chart:SfCircularChart.BindingContext>
115116
</chart:SfCircularChart>
116117
</ContentPage>
117118
```
118119
###### C#
119120
```C#
120-
ChartViewModel viewModel = new ChartViewModel();
121-
chart.BindingContext = viewModel;
121+
SfCircularChart chart = new SfCircularChart();
122+
this.BindingContext = new SalesViewModel();
123+
this.Content = chart;
122124
```
123125

124126
## Populate chart with data
@@ -141,7 +143,7 @@ Adding [PieSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.Pi
141143
###### C#
142144
```C#
143145
SfCircularChart chart = new SfCircularChart();
144-
ChartViewModel viewModel = new ChartViewModel();
146+
SalesViewModel viewModel = new SalesViewModel();
145147
chart.BindingContext = viewModel;
146148
PieSeries series = new PieSeries();
147149
series.ItemsSource = viewModel.Data;
@@ -240,7 +242,7 @@ The following code example gives you the complete code of above configurations.
240242
<Label Text="PRODUCT SALES"/>
241243
</chart:SfCircularChart.Title>
242244
<chart:SfCircularChart.BindingContext>
243-
<model:ChartViewModel/>
245+
<model:SalesViewModel/>
244246
</chart:SfCircularChart.BindingContext>
245247
<chart:SfCircularChart.Legend>
246248
<chart:ChartLegend/>
@@ -267,7 +269,7 @@ public partial class MainPage : ContentPage
267269
Text = "PRODUCT SALES"
268270
};
269271
chart.Legend = new ChartLegend();
270-
ChartViewModel viewModel = new ChartViewModel();
272+
SalesViewModel viewModel = new SalesViewModel();
271273
chart.BindingContext = viewModel;
272274

273275
PieSeries series = new PieSeries();

0 commit comments

Comments
 (0)