Skip to content

Commit 9d257bf

Browse files
Saravanan-MadheshSaravanan-Madhesh
authored
Merge pull request #3 from SyncfusionExamples/873293-Prepare-sample-for-polar-chart
Updated the code snippet and README file
2 parents 0a33224 + a6a8434 commit 9d257bf

2 files changed

Lines changed: 40 additions & 33 deletions

File tree

‎Polar_chart_sample/PolarChartSample/MainPage.xaml‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -24,16 +24,16 @@
2424
</chart:SfPolarChart.PrimaryAxis>
2525

2626
<chart:SfPolarChart.SecondaryAxis>
27-
<chart:NumericalAxis/>
27+
<chart:NumericalAxis Maximum="100"/>
2828
</chart:SfPolarChart.SecondaryAxis>
2929

30-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction"
30+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction"
3131
YBindingPath="Tree" Label="Tree" EnableTooltip="True" ShowDataLabels="True"/>
3232

33-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction"
33+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction"
3434
YBindingPath="Weed" Label="Weed" EnableTooltip="True" ShowDataLabels="True"/>
3535

36-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction"
36+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction"
3737
YBindingPath="Flower" Label="Flower" EnableTooltip="True" ShowDataLabels="True"/>
3838
</chart:SfPolarChart>
3939

‎README.md‎

Lines changed: 36 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -162,7 +162,7 @@ chart.SecondaryAxis = secondaryAxis;
162162

163163
## Populate Chart with data
164164

165-
To create a polar chart, you can add a [PolarAreaSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PolarAreaSeries.html?tabs=tabid-1%2Ctabid-4) to the polar chart [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPolarChart.html#Syncfusion_Maui_Charts_SfPolarChart_Series) property of the chart, and then bind the `PlantData` property of the above `ViewModel` to the `PolarAreaSeries.ItemsSource` as follows.
165+
To create a polar chart, you can add a [PolarLineSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PolarLineSeries.html?tabs=tabid-1%2Ctabid-4) to the polar chart [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPolarChart.html#Syncfusion_Maui_Charts_SfPolarChart_Series) property of the chart, and then bind the `PlantData` property of the above `ViewModel` to the `PolarLineSeries.ItemsSource` as follows.
166166

167167
* In order to plot the series, the [XBindingPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartSeries.html#Syncfusion_Maui_Charts_ChartSeries_XBindingPath) and [YBindingPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.XYDataSeries.html#Syncfusion_Maui_Charts_XYDataSeries_YBindingPath) properties need to be configured correctly. These properties allow the chart to retrieve values from the corresponding properties in the data model.
168168

@@ -175,15 +175,15 @@ To create a polar chart, you can add a [PolarAreaSeries](https://help.syncfusion
175175
</chart:SfPolarChart.PrimaryAxis>
176176

177177
<chart:SfPolarChart.SecondaryAxis>
178-
<chart:NumericalAxis>
178+
<chart:NumericalAxis Maximum="100">
179179
</chart:NumericalAxis>
180180
</chart:SfPolarChart.SecondaryAxis>
181181

182-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Tree" />
182+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Tree" />
183183

184-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Weed" />
184+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Weed" />
185185

186-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Flower" />
186+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Flower" />
187187
</chart:SfPolarChart>
188188
```
189189

@@ -196,21 +196,24 @@ CategoryAxis primaryAxis = new CategoryAxis();
196196
chart.PrimaryAxis = primaryAxis;
197197

198198
//Initializing secondary Axis
199-
NumericalAxis secondaryAxis = new NumericalAxis();
199+
NumericalAxis secondaryAxis = new NumericalAxis()
200+
{
201+
Maximum = 100,
202+
};
200203
chart.SecondaryAxis = secondaryAxis;
201204

202205
//Initialize the series
203-
PolarAreaSeries series = new PolarAreaSeries();
206+
PolarLineSeries series = new PolarLineSeries();
204207
series.ItemsSource = (new ViewModel()).PlantDetails;
205208
series.XBindingPath = "Direction";
206209
series.YBindingPath = "Tree";
207210

208-
PolarAreaSeries series = new PolarAreaSeries();
211+
PolarLineSeries series = new PolarLineSeries();
209212
series.ItemsSource = (new ViewModel()).PlantDetails;
210213
series.XBindingPath = "Direction";
211214
series.YBindingPath = "Weed";
212215

213-
PolarAreaSeries series = new PolarAreaSeries();
216+
PolarLineSeries series = new PolarLineSeries();
214217
series.ItemsSource = (new ViewModel()).PlantDetails;
215218
series.XBindingPath = "Direction";
216219
series.YBindingPath = "Flower";
@@ -252,16 +255,16 @@ The [ShowDataLabels](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.
252255
```xaml
253256
<chart:SfPolarChart>
254257
. . .
255-
<chart:PolarAreaSeries ShowDataLabels="True">
256-
</chart:PolarAreaSeries>
258+
<chart:PolarLineSeries ShowDataLabels="True">
259+
</chart:PolarLineSeries >
257260
</chart:SfPolarChart>
258261
```
259262

260263
###### C#
261264
```C#
262265
SfPolarChart chart = new SfPolarChart()
263266
. . .
264-
PolarAreaSeries series = new PolarAreaSeries();
267+
PolarLineSeries series = new PolarLineSeries();
265268
series.ShowDataLabels = true;
266269
chart.Series.Add(series);
267270
```
@@ -293,32 +296,32 @@ chart.Legend = new ChartLegend();
293296
```xaml
294297
<chart:SfPolarChart>
295298
. . .
296-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Tree"
299+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Tree"
297300
Label="Tree"/>
298301

299-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Weed"
302+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Weed"
300303
Label="Weed"/>
301304

302-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Flower"
305+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Flower"
303306
Label="Flower"/>
304307
</chart:SfPolarChart>
305308
```
306309

307310
###### C#
308311
```C#
309-
PolarAreaSeries series = new PolarAreaSeries ();
312+
PolarLineSeries series = new PolarLineSeries();
310313
series.ItemsSource = (new ViewModel()).PlantDetails;
311314
series.XBindingPath = "Direction";
312315
series.YBindingPath = "Tree";
313316
series.Label = "Tree";
314317

315-
PolarAreaSeries series = new PolarAreaSeries();
318+
PolarLineSeries series = new PolarLineSeries();
316319
series.ItemsSource = (new ViewModel()).PlantDetails;
317320
series.XBindingPath = "Direction";
318321
series.YBindingPath = "Weed";
319322
series.Label = "Weed";
320323

321-
PolarAreaSeries series = new PolarAreaSeries();
324+
PolarLineSeries series = new PolarLineSeries();
322325
series.ItemsSource = (new ViewModel()).PlantDetails;
323326
series.XBindingPath = "Direction";
324327
series.YBindingPath = "Flower";
@@ -333,14 +336,14 @@ Tooltips are used to display information about a segment when a user hovers over
333336
```xaml
334337
<chart:SfPolarChart>
335338
...
336-
<chart:PolarAreaSeries EnableTooltip="True"/>
339+
<chart:PolarLineSeries EnableTooltip="True"/>
337340
...
338341
</chart:SfPolarChart>
339342
```
340343

341344
###### C#
342345
```C#
343-
PolarAreaSeries series = new PolarAreaSeries();
346+
PolarLineSeries series = new PolarLineSeries();
344347
series.EnableTooltip = true;
345348
```
346349

@@ -375,16 +378,16 @@ The following code example gives you the complete code of above configurations.
375378
</chart:SfPolarChart.PrimaryAxis>
376379

377380
<chart:SfPolarChart.SecondaryAxis>
378-
<chart:NumericalAxis/>
381+
<chart:NumericalAxis Maximum="100"/>
379382
</chart:SfPolarChart.SecondaryAxis>
380383

381-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Tree"
384+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Tree"
382385
Label="Tree" EnableTooltip="True" ShowDataLabels="True"/>
383386

384-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Weed"
387+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Weed"
385388
Label="Weed" EnableTooltip="True" ShowDataLabels="True"/>
386389

387-
<chart:PolarAreaSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Flower"
390+
<chart:PolarLineSeries ItemsSource="{Binding PlantDetails}" XBindingPath="Direction" YBindingPath="Flower"
388391
Label="Flower" EnableTooltip="True" ShowDataLabels="True"/>
389392
</chart:SfPolarChart>
390393
</Grid>
@@ -413,10 +416,13 @@ The following code example gives you the complete code of above configurations.
413416
CategoryAxis primaryAxis = new CategoryAxis();
414417
chart.PrimaryAxis = primaryAxis;
415418

416-
NumericalAxis secondaryAxis = new NumericalAxis();
419+
NumericalAxis secondaryAxis = new NumericalAxis()
420+
{
421+
Maximum = 100,
422+
};
417423
chart.SecondaryAxis = secondaryAxis;
418424

419-
PolarAreaSeries series = new PolarAreaSeries()
425+
PolarLineSeries series = new PolarLineSeries()
420426
{
421427
ItemsSource = (new ViewModel()).PlantDetails,
422428
XBindingPath = "Direction",
@@ -426,7 +432,7 @@ The following code example gives you the complete code of above configurations.
426432
ShowDataLabels="True"
427433
};
428434

429-
PolarAreaSeries series = new PolarAreaSeries()
435+
PolarLineSeries series = new PolarLineSeries()
430436
{
431437
ItemsSource = (new ViewModel()).PlantDetails,
432438
XBindingPath = "Direction",
@@ -436,7 +442,7 @@ The following code example gives you the complete code of above configurations.
436442
ShowDataLabels="True"
437443
};
438444

439-
PolarAreaSeries series = new PolarAreaSeries()
445+
PolarLineSeries series = new PolarLineSeries()
440446
{
441447
ItemsSource = (new ViewModel()).PlantDetails,
442448
XBindingPath = "Direction",
@@ -455,4 +461,5 @@ The following code example gives you the complete code of above configurations.
455461

456462
The following chart is created as a result of the previous codes.
457463

458-
![Getting started for .NET MAUI Chart](Getting_start_images/MAUI_polar_chart.png)
464+
<img width="554" alt="polar-README" src="https://github.com/SyncfusionExamples/Creating-a-Getting-Started-application-for-NET-MAUI-Polar-Chart/assets/103025761/01e0c860-be28-4051-b9cb-1d87a4532f07">
465+

0 commit comments

Comments
 (0)