Skip to content

Commit 8e54047

Browse files
joadanjoadan
committed
Samples
1 parent dffcbe0 commit 8e54047

File tree

11 files changed

+220
-25
lines changed

11 files changed

+220
-25
lines changed

‎docs/BlazorApexCharts.Docs.Server/Properties/launchSettings.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"IIS Express": {
44
"commandName": "IISExpress",
55
"launchBrowser": true,
6-
"launchUrl": "heatmap-charts",
6+
"launchUrl": "features/group-points",
77
"environmentVariables": {
88
"ASPNETCORE_ENVIRONMENT": "Development"
99
}

‎docs/BlazorApexCharts.Docs/Components/Features/Data/ChartData.razor

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,7 @@
22

33
<DocExamples Title="Chart Data">
44

5-
<CodeSnippet Title="Group Values" ClassName=@typeof(GroupValues).ToString()>
6-
<Snippet>
7-
<GroupValues />
8-
</Snippet>
9-
</CodeSnippet>
10-
@*
5+
116
<CodeSnippet Title="Data Async" ClassName=@typeof(DataAsync).ToString()>
127
<Snippet>
138
<DataAsync />
@@ -19,5 +14,5 @@
1914
<NoData />
2015
</Snippet>
2116
</CodeSnippet>
22-
*@
17+
2318
</DocExamples>

‎docs/BlazorApexCharts.Docs/Components/Features/Data/GroupValues.razor renamed to ‎docs/BlazorApexCharts.Docs/Components/Features/GroupPoints/Basic.razor

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
<DemoContainer>
22
<ApexChart TItem="Order"
33
Title="Order Gross Value"
4-
GroupValues="new ApexCharts.GroupValues { MaxValuesCount = 4}">
4+
XAxisType = "XAxisType.Category"
5+
GroupPoints="new ApexCharts.GroupPoints { MaxCount = 4}">
56

67
<ApexPointSeries TItem="Order"
78
Items="Orders"
@@ -14,5 +15,5 @@
1415
</DemoContainer>
1516

1617
@code {
17-
private List<Order> Orders { get; set; } = SampleData.GetOrders();
18+
private List<Order> Orders { get; set; } = SampleData.GetOrdersForGroup();
1819
}

‎docs/BlazorApexCharts.Docs/Components/Features/GroupPoints/Group.razor

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
@page "/features/group-points"
2+
3+
<DocExamples Title="Group Points">
4+
<Description>
5+
<Alert BackgroundColor="TablerColor.Info">
6+
Exprimental
7+
</Alert>
8+
</Description>
9+
<ChildContent>
10+
<CodeSnippet Title="Basic" ClassName=@typeof(Basic).ToString()>
11+
<Snippet>
12+
<Basic />
13+
</Snippet>
14+
</CodeSnippet>
15+
16+
<CodeSnippet Title="Group Details" ClassName=@typeof(GroupDetails).ToString()>
17+
<Description>
18+
Click on the bars to get details. The grouped bar contain the grouped points.
19+
</Description>
20+
<Snippet>
21+
<GroupDetails />
22+
</Snippet>
23+
</CodeSnippet>
24+
</ChildContent>
25+
</DocExamples>

‎docs/BlazorApexCharts.Docs/Components/Features/GroupPoints/GroupDetails.razor

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
<DemoContainer>
2+
<ApexChart TItem="Order"
3+
Title="Order Gross Value"
4+
XAxisType="XAxisType.Category"
5+
GroupPoints="@(new ApexCharts.GroupPoints {PercentageThreshold = 2, Name="*Others*"})"
6+
OnDataPointSelection="SelectDataPoint">
7+
8+
<ApexPointSeries TItem="Order"
9+
Items="Orders"
10+
Name="Gross Value"
11+
SeriesType="SeriesType.Bar"
12+
XValue="@(e => e.Country)"
13+
YAggregate="@(e => e.Sum(e => e.GrossValue))"
14+
OrderByDescending="e=>e.Y"
15+
DataPointMutator="PointMutator" />
16+
</ApexChart>
17+
18+
@if (selected != null)
19+
{
20+
var point = (DataPoint<Order>)selected.DataPoint;
21+
22+
<h3 class="mt-3">@point.X - @point.Y</h3>
23+
24+
@if (point.GroupedPoints != null)
25+
{
26+
<ol>
27+
@foreach (var gPoint in point.GroupedPoints)
28+
{
29+
<li>@gPoint.X - @gPoint.Y</li>
30+
}
31+
32+
</ol>
33+
}
34+
}
35+
36+
</DemoContainer>
37+
38+
@code {
39+
private List<Order> Orders { get; set; } = SampleData.GetOrdersForGroup();
40+
private SelectedData<Order> selected;
41+
private void SelectDataPoint(SelectedData<Order> selected)
42+
{
43+
this.selected = selected;
44+
45+
46+
}
47+
48+
private void PointMutator(DataPoint<Order> point)
49+
{
50+
switch (point.X.ToString())
51+
{
52+
case "France":
53+
point.FillColor = "#e3001b";
54+
break;
55+
case "Brazil":
56+
point.FillColor = "#005ba3";
57+
break;
58+
case "Sweden":
59+
point.FillColor = "#ffd500";
60+
break;
61+
case "Spain":
62+
point.FillColor = "#00783c";
63+
break;
64+
default:
65+
point.FillColor = "#BFC9CA";
66+
break;
67+
}
68+
69+
}
70+
71+
}

‎docs/BlazorApexCharts.Docs/Data/SampleData.cs

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,25 @@ public static List<Order> GetRandomOrders()
4646
return orders;
4747
}
4848

49-
public static List<Order> GetOrders()
49+
public static List<Order> GetOrdersForGroup()
50+
{
51+
var orders = GetOrders();
52+
53+
orders.Add(new Order { CustomerName = "Expansion Inc", Country = "Andorra", OrderDate = DateTimeOffset.Now.AddDays(-12), GrossValue = 1234, DiscountPercentage = 21, OrderType = OrderType.Contract });
54+
orders.Add(new Order { CustomerName = "Expansion Inc", Country = "Andorra", OrderDate = DateTimeOffset.Now.AddDays(-2), GrossValue = 12, DiscountPercentage = 14, OrderType = OrderType.Mail });
55+
56+
orders.Add(new Order { CustomerName = "Trick Corp.", Country = "San Marino", OrderDate = DateTimeOffset.Now.AddDays(-10), GrossValue = 3543, DiscountPercentage = 11, OrderType = OrderType.Web });
57+
orders.Add(new Order { CustomerName = "Trick Corp.", Country = "San Marino", OrderDate = DateTimeOffset.Now.AddDays(-4), GrossValue = 126, DiscountPercentage = 17, OrderType = OrderType.Contract });
58+
59+
orders.Add(new Order { CustomerName = "Restless Group", Country = "Monaco", OrderDate = DateTimeOffset.Now.AddDays(-14), GrossValue = 1266, DiscountPercentage = 13, OrderType = OrderType.Web });
60+
61+
62+
63+
return orders;
64+
65+
}
66+
67+
public static List<Order> GetOrders()
5068
{
5169
var orders = new List<Order>();
5270
orders.Add(new Order { CustomerName = "Odio Corporation", Country = "Sweden", OrderDate = DateTimeOffset.Now.AddDays(-12), GrossValue = 34531, DiscountPercentage = 21, OrderType = OrderType.Contract });

‎docs/BlazorApexCharts.Docs/Shared/MainNavigation.razor

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -127,6 +127,7 @@
127127
<NavbarMenuItem Text="Data" Href="features/chart-data" />
128128
<NavbarMenuItem Text="Export" Href="features/export" />
129129
<NavbarMenuItem Text="Formatters" Href="features/formatters" />
130+
<NavbarMenuItem Text="Group Points" Href="features/group-points" />
130131
<NavbarMenuItem Text="Legend" Href="features/legend" />
131132
<NavbarMenuItem Text="Performance" Href="features/performance" />
132133
<NavbarMenuItem Text="Size" Href="features/chart-size" />

‎src/Blazor-ApexCharts/ApexChart.razor.cs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ public partial class ApexChart<TItem> : IDisposable where TItem : class
3636

3737
[Parameter] public EventCallback OnRendered { get; set; }
3838
[Parameter] public Func<decimal, string> FormatYAxisLabel { get; set; }
39-
[Parameter] public GroupValues GroupValues { get; set; }
39+
[Parameter] public GroupPoints GroupPoints { get; set; }
4040

4141
private ChartSerializer chartSerializer = new();
4242
public List<IApexSeries<TItem>> Series => apexSeries;

‎src/Blazor-ApexCharts/Models/DataPoints/DataPoint.cs

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,11 @@ public class DataPoint<TItem> : IDataPoint<TItem>
1818
public IEnumerable<TItem> Items { get; set; }
1919

2020
public object Extra { get; set; }
21+
22+
23+
[JsonIgnore]
24+
public List<DataPoint<TItem>> GroupedPoints { get; internal set; }
25+
2126
}
2227

2328
public class DataPointGoal

‎src/Blazor-ApexCharts/Models/GroupValues.cs

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
1-
using System;
2-
using System.Collections.Generic;
3-
using System.Linq;
4-
using System.Text;
5-
using System.Threading.Tasks;
6-
1+

72
namespace ApexCharts
83
{
9-
public class GroupValues
4+
public class GroupPoints
105
{
116
/// <summary>
12-
/// Indicates the max value of values to show, including the grouped values.
7+
/// Indicates the max number of points to show, excluding the grouped values.
8+
/// </summary>
9+
public int? MaxCount { get; set; }
10+
11+
/// <summary>
12+
/// Indicates the min number of points to show, excluding the grouped values.
1313
/// </summary>
14-
public int? MaxValuesCount { get; set; }
14+
public int? MinCount { get; set; }
1515

1616
/// <summary>
1717
/// The precentage value that indicate if a value should be grouped.
1818
/// </summary>
1919
public decimal? PercentageThreshold { get; set; }
2020

2121
public string Name { get; set; } = "Other";
22-
public bool Show { get; set; } = true;
22+
2323
}
2424

2525

0 commit comments

Comments
 (0)