Skip to content

Commit 21e8c26

Browse files
joadanjoadan
committed
Improved DateRangeSeries
Add support for NavigateToFragment i samples
1 parent 3a85692 commit 21e8c26

File tree

6 files changed

+150
-32
lines changed

6 files changed

+150
-32
lines changed

‎docs/BlazorApexCharts.Docs/Components/DocExamples.razor.cs

Lines changed: 62 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,93 @@
11
using Microsoft.AspNetCore.Components;
2+
using Microsoft.AspNetCore.Components.Routing;
3+
using System;
24
using System.Collections.Generic;
5+
using System.Linq;
6+
using System.Net;
7+
using System.Runtime.InteropServices;
38
using System.Threading.Tasks;
49
using TabBlazor.Services;
510

611
namespace BlazorApexCharts.Docs.Components
712
{
8-
public partial class DocExamples : ComponentBase
13+
public partial class DocExamples : ComponentBase, IDisposable
914
{
1015
[Inject] public TablerService TablerService { get; set; }
11-
16+
[Inject] NavigationManager NavManager { get; set; }
17+
1218
[Parameter] public string Title { get; set; }
1319
[Parameter] public RenderFragment ChildContent { get; set; }
1420
[Parameter] public RenderFragment Description { get; set; }
15-
21+
22+
public List<CodeSnippet> CodeSnippets = new();
23+
private bool navigateToFragment = true;
24+
25+
26+
protected override void OnInitialized()
27+
{
28+
NavManager.LocationChanged += LocationChanged;
29+
}
30+
31+
protected override async Task OnAfterRenderAsync(bool firstRender)
32+
{
33+
if (!firstRender && navigateToFragment)
34+
{
35+
var delay = 200;
36+
if (IsWasm)
37+
{
38+
delay = CodeSnippets.Count * 400;
39+
}
40+
await TryNavigateToFragment(delay);
41+
navigateToFragment = false;
42+
}
43+
44+
}
45+
46+
private async void LocationChanged(object sender, LocationChangedEventArgs e)
47+
{
48+
await TryNavigateToFragment(100);
49+
navigateToFragment = false;
50+
}
51+
52+
private async Task TryNavigateToFragment(int delayMilliseconds)
53+
{
54+
var uri = NavManager.ToAbsoluteUri(NavManager.Uri);
55+
56+
if (uri.Fragment.Length == 0)
57+
return;
58+
59+
var fragment = WebUtility.UrlDecode(uri.Fragment.Substring(1));
60+
var codeSnippet = CodeSnippets.FirstOrDefault(e => e.Title?.ToLower() == fragment.ToLower());
61+
if (codeSnippet != null)
62+
{
63+
await Task.Delay(delayMilliseconds);
64+
await NavigateTo(codeSnippet);
65+
}
66+
}
67+
68+
private bool IsWasm => RuntimeInformation.IsOSPlatform(OSPlatform.Create("BROWSER"));
69+
1670
private async Task NavigateTo(CodeSnippet codeSnippet)
1771
{
1872
await TablerService.ScrollToFragment(codeSnippet.Id.ToString());
1973
}
2074

21-
public List<CodeSnippet> CodeSnippets = new List<CodeSnippet>();
2275
public void AddCodeSnippet(CodeSnippet codeSnippet)
2376
{
2477
CodeSnippets.Add(codeSnippet);
2578
StateHasChanged();
2679
}
2780

28-
29-
3081
public void RemoveCodeSnippet(CodeSnippet codeSnippet)
3182
{
3283
CodeSnippets.Remove(codeSnippet);
3384
StateHasChanged();
3485
}
86+
87+
public void Dispose()
88+
{
89+
NavManager.LocationChanged -= LocationChanged;
90+
}
3591
}
3692
}
3793

‎docs/BlazorApexCharts.Docs/Components/RangeBarCharts/DateRange.razor

Lines changed: 20 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,34 @@
11
<DemoContainer>
2-
3-
@if (activities != null)
2+
@if (projects == null)
3+
{
4+
<div class="text-center text-muted" style="min-height:300px">
5+
<h3>Loading chart<span class="animated-dots"></span></h3>
6+
</div>
7+
}
8+
else
49
{
5-
<ApexChart TItem="Activity"
6-
Title="Activities"
10+
<ApexChart TItem="Project"
11+
Title="Projects"
712
Options=options
813
XAxisType="XAxisType.Datetime">
9-
<ApexRangeSeries TItem="Activity"
10-
Items="activities"
14+
<ApexRangeSeries TItem="Project"
15+
Items="projects"
1116
XValue="@(e => e.Name)"
12-
YValue="@(e =>e.ActivityDate.ToUnixTimeMilliseconds())" />
17+
YMinValue="@(e =>e.StartDate.ToUnixTimeMilliseconds())"
18+
YMaxValue="@(e =>e.EndDate.ToUnixTimeMilliseconds())" />
1319
</ApexChart>
1420
}
1521

1622

1723
</DemoContainer>
1824

1925
@code {
20-
private List<Activity> activities;
21-
private ApexChartOptions<Activity> options;
26+
private List<Project> projects;
27+
private ApexChartOptions<Project> options;
2228

2329
protected override async Task OnInitializedAsync()
2430
{
25-
options = new ApexChartOptions<Activity>
31+
options = new ApexChartOptions<Project>
2632
{
2733
PlotOptions = new PlotOptions
2834
{
@@ -33,13 +39,13 @@
3339
}
3440
};
3541

36-
activities = await LoadExternalData();
42+
projects = await LoadProjects();
3743
}
3844

39-
private async Task<List<Activity>> LoadExternalData()
45+
private async Task<List<Project>> LoadProjects()
4046
{
41-
await Task.Delay(1000);
42-
return SampleData.GetActivites();
47+
await Task.Delay(3000);
48+
return SampleData.GetProjects();
4349
}
4450

4551
}

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

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
using System;
2+
3+
namespace BlazorApexCharts.Docs
4+
{
5+
public class Project
6+
{
7+
public string Name { get; set; }
8+
public DateTime StartDate { get; set; }
9+
public DateTime EndDate { get; set; }
10+
}
11+
}

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

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,18 @@ public static List<Order> GetOrders()
5555
return orders;
5656
}
5757

58+
public static List<Project> GetProjects()
59+
{
60+
var result = new List<Project>();
61+
62+
result.Add(new Project { Name = "Design", StartDate = DateTime.Now.AddDays(-30), EndDate = DateTime.Now.AddDays(-10) });
63+
result.Add(new Project { Name = "Construct", StartDate = DateTime.Now.AddDays(-20), EndDate = DateTime.Now.AddDays(-5) });
64+
result.Add(new Project { Name = "Install", StartDate = DateTime.Now.AddDays(-14), EndDate = DateTime.Now.AddDays(0) });
65+
result.Add(new Project { Name = "Train", StartDate = DateTime.Now.AddDays(-18), EndDate = DateTime.Now.AddDays(5) });
66+
return result;
67+
68+
}
69+
5870
public static List<Activity> GetActivites()
5971
{
6072
var result = new List<Activity>();

‎src/Blazor-ApexCharts/Extensions/GeneralExtensions.cs

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

73
namespace ApexCharts
84
{
@@ -17,5 +13,13 @@ public static DateTimeOffset DayOnly(this DateTimeOffset value)
1713
{
1814
return new DateTimeOffset(value.Year, value.Month, value.Day, 0, 0, 0, new TimeSpan());
1915
}
16+
17+
18+
public static long ToUnixTimeMilliseconds(this DateTime d)
19+
{
20+
DateTime epoch = DateTime.UnixEpoch;
21+
return (long)(d - epoch).TotalMilliseconds;
22+
}
23+
2024
}
2125
}

‎src/Blazor-ApexCharts/Series/ApexRangeSeries.cs

Lines changed: 37 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -12,27 +12,56 @@ public class ApexRangeSeries<TItem> : ApexBaseSeries<TItem>, IApexSeries<TItem>
1212
[Parameter] public Expression<Func<ListPoint<TItem>, object>> OrderBy { get; set; }
1313
[Parameter] public Expression<Func<ListPoint<TItem>, object>> OrderByDescending { get; set; }
1414

15+
[Parameter] public Expression<Func<TItem, decimal>> YMinValue { get; set; }
16+
[Parameter] public Expression<Func<TItem, decimal>> YMaxValue { get; set; }
17+
1518
protected override void OnInitialized()
1619
{
1720
base.OnInitialized();
21+
CheckInput();
1822
Chart.AddSeries(this);
1923
}
2024

25+
private void CheckInput()
26+
{
27+
28+
if (YValue == null && (YMinValue == null || YMinValue == null)) {
29+
throw new ArgumentNullException($"You have to set YValue or YMinValue and YMaxValue");
30+
}
31+
32+
}
33+
2134
public ChartType GetChartType()
2235
{
2336
return ChartType.RangeBar;
2437
}
2538

2639
public IEnumerable<IDataPoint<TItem>> GetData()
2740
{
28-
var data = Items
29-
.GroupBy(e => XValue.Compile().Invoke(e))
30-
.Select(d => new ListPoint<TItem>
31-
{
32-
X = d.Key,
33-
Y = new List<decimal> { d.AsQueryable().Min(YValue), d.AsQueryable().Max(YValue) },
34-
Items = d
35-
});
41+
IEnumerable<ListPoint<TItem>> data;
42+
43+
if (YMinValue != null && YMaxValue != null)
44+
{
45+
data = Items
46+
.Select(e => new ListPoint<TItem>
47+
{
48+
X = XValue.Compile().Invoke(e),
49+
Y = new List<decimal> { YMinValue.Compile().Invoke(e), YMaxValue.Compile().Invoke(e) },
50+
Items = new List<TItem> { e}
51+
});
52+
}
53+
else
54+
{
55+
data = Items
56+
.GroupBy(e => XValue.Compile().Invoke(e))
57+
.Select(d => new ListPoint<TItem>
58+
{
59+
X = d.Key,
60+
Y = new List<decimal> { d.AsQueryable().Min(YValue), d.AsQueryable().Max(YValue) },
61+
Items = d
62+
});
63+
}
64+
3665

3766
if (OrderBy != null)
3867
{

0 commit comments

Comments
 (0)