Skip to content

Commit 46641cc

Browse files
erossinierossini
committed
Add all charts
1 parent 0512d43 commit 46641cc

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

78 files changed

+5283
-3398
lines changed

‎ChartjsDemo/ChartjsDemo.csproj

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,9 @@
88
</PropertyGroup>
99

1010
<ItemGroup>
11-
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.0" />
12-
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.0" PrivateAssets="all" />
11+
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.4" />
12+
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.4" PrivateAssets="all" />
13+
<PackageReference Include="PSC.Blazor.Components.CodeSnippet" Version="1.0.3" />
1314
</ItemGroup>
1415

1516
<ItemGroup>

‎ChartjsDemo/Data/BubbleDataExamples.cs

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
using PSC.Blazor.Components.Chartjs.Models.Bubble;
2+
3+
namespace ChartjsDemo.Data
4+
{
5+
public static class BubbleDataExamples
6+
{
7+
public static List<string> SimpleBubbleText = new List<string>() { "First Dataset" };
8+
public static List<BubbleCoords> SimpleBubble = new List<BubbleCoords>() {
9+
new BubbleCoords() { R = 15, X = 20, Y = 30 },
10+
new BubbleCoords() { R = 10, X = 40, Y = 10 }
11+
};
12+
}
13+
}

‎ChartjsDemo/Data/LineDataExamples.cs

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
namespace ChartjsDemo.Data
2+
{
3+
public static class LineDataExamples
4+
{
5+
public static List<string> SimpleLineText = new List<string>() { "January", "February", "March", "Aprl", "May", "June", "July" };
6+
public static List<decimal> SimpleLine = new List<decimal>() { 65, 59, 80, 81, 56, 55, 40 };
7+
public static List<decimal> SimpleLine2 = new List<decimal>() { 33, 25, 35, 51, 54, 76, 45 };
8+
}
9+
}

‎ChartjsDemo/Data/PieDataExamples.cs

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
namespace ChartjsDemo.Data
2+
{
3+
public static class PieDataExamples
4+
{
5+
public static List<string> SimplePieText = new List<string>() { "January", "February", "March" };
6+
public static List<decimal> SimplePie = new List<decimal>() { 300, 50, 100 };
7+
}
8+
}

‎ChartjsDemo/Data/PolarDataExamples.cs

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
namespace ChartjsDemo.Data
2+
{
3+
public static class PolarDataExamples
4+
{
5+
public static List<string> SimplePolarText = new List<string>() { "January", "February", "March", "Aprl", "May" };
6+
public static List<decimal> SimplePolar = new List<decimal>() { 11, 16, 7, 3, 14 };
7+
}
8+
}

‎ChartjsDemo/Data/RadarDataExamples.cs

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
using PSC.Blazor.Components.Chartjs.Models.Radar;
2+
3+
namespace ChartjsDemo.Data
4+
{
5+
public static class RadarDataExamples
6+
{
7+
/// <summary>
8+
/// The radar simple text
9+
/// </summary>
10+
public static List<string> RadarSimpleText = new List<string>() {
11+
"Eating",
12+
"Drinking",
13+
"Sleeping",
14+
"Designing",
15+
"Coding",
16+
"Cycling",
17+
"Running"
18+
};
19+
20+
/// <summary>
21+
/// The radar datasets
22+
/// </summary>
23+
public static List<RadarDataset> RadarDatasets = new List<RadarDataset>() {
24+
new RadarDataset() {
25+
Label = "My First Dataset",
26+
Data = new List<decimal>() { 65, 59, 90, 81, 56, 55, 40 },
27+
Fill = true,
28+
BackgroundColor = "rgba(255, 99, 132, 0.2)",
29+
BorderColor = "rgb(255, 99, 132)",
30+
PointBackgroundColor = "rgb(255, 99, 132)",
31+
PointBorderColor = "#fff",
32+
PointHoverBackgroundColor = "#fff",
33+
PointHoverBorderColor = "rgb(255, 99, 132)"
34+
},
35+
new RadarDataset() {
36+
Label = "My Second Dataset",
37+
Data = new List<decimal>() { 28, 48, 40, 19, 96, 27, 100 },
38+
Fill = true,
39+
BackgroundColor = "rgba(54, 162, 235, 0.2)",
40+
BorderColor = "rgb(54, 162, 235)",
41+
PointBackgroundColor = "rgb(54, 162, 235)",
42+
PointBorderColor = "#fff",
43+
PointHoverBackgroundColor = "#fff",
44+
PointHoverBorderColor = "rgb(54, 162, 235)"
45+
}
46+
};
47+
}
48+
}

‎ChartjsDemo/Data/ScatterDataExamples.cs

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
using PSC.Blazor.Components.Chartjs.Models.Scatter;
2+
3+
namespace ChartjsDemo.Data
4+
{
5+
public static class ScatterDataExamples
6+
{
7+
public static string ScatterSimpleText = "Scatter Dataset";
8+
public static List<ScatterXYValue> ScatterDatasets = new List<ScatterXYValue>() {
9+
new ScatterXYValue() { X = -10, Y = 0 },
10+
new ScatterXYValue() { X = 0, Y = 10 },
11+
new ScatterXYValue() { X = 10, Y = 5 },
12+
new ScatterXYValue() { X = 0.5M, Y = 5.5M }
13+
};
14+
}
15+
}

‎ChartjsDemo/Pages/AreaSimple.razor

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
@page "/areaSimple"
2+
3+
<h3>Area Simple</h3>
4+
5+
<Chart Config="_config1" @ref="_chart1" Height="400px"></Chart>
6+
7+
<hr />
8+
9+
<h3>Code</h3>
10+
11+
<p>
12+
This is the component to add in your page.
13+
</p>
14+
15+
<CodeSnippet Language="Language.xml" Style="Style.VisualStudio">
16+
&ltChart Config="_config1" &#64;ref="_chart1">&lt;Chart>
17+
</CodeSnippet>
18+
19+
<p>
20+
Then, in the code section, add the following code:
21+
</p>
22+
23+
<CodeSnippet Language="Language.csharp" Style="Style.VisualStudio" LoadMainScript="false">
24+
private LineChartConfig _config1;
25+
private Chart _chart1;
26+
27+
protected override async Task OnInitializedAsync()
28+
{
29+
_config1 = new LineChartConfig()
30+
{
31+
Options = new Options()
32+
{
33+
Responsive = true,
34+
MaintainAspectRatio = false
35+
}
36+
};
37+
38+
_config1.Data.Labels = LineDataExamples.SimpleLineText;
39+
_config1.Data.Datasets.Add(new LineDataset()
40+
{
41+
Label = "My First Dataset",
42+
Data = LineDataExamples.SimpleLine.ToList(),
43+
BorderColor = Colors.PaletteBorder1.FirstOrDefault(),
44+
Fill = false
45+
});
46+
_config1.Data.Datasets.Add(new LineDataset()
47+
{
48+
Label = "My Second Dataset",
49+
Data = LineDataExamples.SimpleLine2.ToList(),
50+
BackgroundColor = "rgba(75,192,192,0.2)",
51+
BorderColor = "rgba(75,192,192,1)",
52+
Fill = true
53+
});
54+
}
55+
</CodeSnippet>
56+
57+
@code {
58+
private LineChartConfig _config1;
59+
private Chart _chart1;
60+
61+
protected override async Task OnInitializedAsync()
62+
{
63+
_config1 = new LineChartConfig()
64+
{
65+
Options = new Options()
66+
{
67+
Responsive = true,
68+
MaintainAspectRatio = false
69+
}
70+
};
71+
72+
_config1.Data.Labels = LineDataExamples.SimpleLineText;
73+
_config1.Data.Datasets.Add(new LineDataset()
74+
{
75+
Label = "My First Dataset",
76+
Data = LineDataExamples.SimpleLine.ToList(),
77+
BorderColor = Colors.PaletteBorder1.FirstOrDefault(),
78+
Fill = false
79+
});
80+
_config1.Data.Datasets.Add(new LineDataset()
81+
{
82+
Label = "My Second Dataset",
83+
Data = LineDataExamples.SimpleLine2.ToList(),
84+
BackgroundColor = "rgba(75,192,192,0.2)",
85+
BorderColor = "rgba(75,192,192,1)",
86+
Fill = true
87+
});
88+
}
89+
}

‎ChartjsDemo/Pages/BarSimple.razor

Lines changed: 70 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,21 +2,86 @@
22

33
<h3>Bar Simple</h3>
44

5-
<Chart Config="_config1" @ref="_chart1" Id="@Id1"></Chart>
5+
<Chart Config="_config1" @ref="_chart1" Height="400px" Style="margin-bottom: 75px;"></Chart>
6+
7+
<hr />
8+
9+
<h3>Code</h3>
10+
11+
<p>
12+
This is the component to add in your page.
13+
</p>
14+
15+
<CodeSnippet Language="Language.xml" Style="Style.VisualStudio">
16+
&ltChart Config="_config1" &#64;ref="_chart1">&lt;Chart>
17+
</CodeSnippet>
18+
19+
<p>
20+
Then, in the code section, add the following code:
21+
</p>
22+
23+
<CodeSnippet Language="Language.csharp" Style="Style.VisualStudio" LoadMainScript="false">
24+
private BarChartConfig _config1;
25+
private Chart _chart1;
26+
27+
protected override async Task OnInitializedAsync()
28+
{
29+
_config1 = new BarChartConfig()
30+
{
31+
Options = new Options()
32+
{
33+
Plugins = new Plugins()
34+
{
35+
Legend = new Legend()
36+
{
37+
Align = LegendAlign.Center,
38+
Display = false,
39+
Position = LegendPosition.Right
40+
}
41+
},
42+
Scales = new Scales()
43+
{
44+
X = new XAxes()
45+
{
46+
Stacked = true,
47+
Ticks = new Ticks()
48+
{
49+
MaxRotation = 0,
50+
MinRotation = 0
51+
}
52+
},
53+
Y = new YAxes()
54+
{
55+
Stacked = true
56+
}
57+
}
58+
}
59+
};
60+
61+
_config1.Data.Labels = BarDataExamples.SimpleBarText;
62+
_config1.Data.Datasets.Add(new BarDataset()
63+
{
64+
Label = "Value",
65+
Data = BarDataExamples.SimpleBar.Select(l => l.Value).ToList(),
66+
BackgroundColor = Colors.Palette1,
67+
BorderColor = Colors.PaletteBorder1,
68+
BorderWidth = 1
69+
});
70+
}
71+
</CodeSnippet>
672

773
@code {
8-
private string Id1 = "chart1";
974
private BarChartConfig _config1;
1075
private Chart _chart1;
1176

1277
protected override async Task OnInitializedAsync()
1378
{
1479
_config1 = new BarChartConfig()
1580
{
16-
CanvasId = Id1,
17-
Type = ChartType.Bar,
1881
Options = new Options()
1982
{
83+
Responsive = true,
84+
MaintainAspectRatio = false,
2085
Plugins = new Plugins()
2186
{
2287
Legend = new Legend()
@@ -46,7 +111,7 @@
46111
};
47112

48113
_config1.Data.Labels = BarDataExamples.SimpleBarText;
49-
_config1.Data.Datasets.Add(new Dataset()
114+
_config1.Data.Datasets.Add(new BarDataset()
50115
{
51116
Label = "Value",
52117
Data = BarDataExamples.SimpleBar.Select(l => l.Value).ToList(),

‎ChartjsDemo/Pages/BubbleSimple.razor

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
@page "/bubbleSimple"
2+
3+
<h3>Bubble Simple</h3>
4+
5+
<Chart Config="_config1" @ref="_chart1" Height="400px" Style="margin-bottom: 75px;"></Chart>
6+
7+
<hr />
8+
9+
<h3>Code</h3>
10+
11+
<p>
12+
This is the component to add in your page.
13+
</p>
14+
15+
<CodeSnippet Language="Language.xml" Style="Style.VisualStudio">
16+
&ltChart Config="_config1" &#64;ref="_chart1">&lt;Chart>
17+
</CodeSnippet>
18+
19+
<p>
20+
Then, in the code section, add the following code:
21+
</p>
22+
23+
<CodeSnippet Language="Language.csharp" Style="Style.VisualStudio" LoadMainScript="false">
24+
private BubbleChartConfig _config1;
25+
private Chart _chart1;
26+
27+
protected override async Task OnInitializedAsync()
28+
{
29+
_config1 = new BubbleChartConfig()
30+
{
31+
};
32+
33+
_config1.Data.Labels = BubbleDataExamples.SimpleBubbleText;
34+
_config1.Data.Datasets.Add(new BubbleDataset()
35+
{
36+
Label = "My First Dataset",
37+
Data = BubbleDataExamples.SimpleBubble,
38+
BackgroundColor = Colors.PaletteBorder1.FirstOrDefault()
39+
});
40+
}
41+
</CodeSnippet>
42+
43+
@code {
44+
private BubbleChartConfig _config1;
45+
private Chart _chart1;
46+
47+
protected override async Task OnInitializedAsync()
48+
{
49+
_config1 = new BubbleChartConfig()
50+
{
51+
Options = new Options()
52+
{
53+
Responsive = true,
54+
MaintainAspectRatio = false
55+
}
56+
};
57+
58+
_config1.Data.Labels = BubbleDataExamples.SimpleBubbleText;
59+
_config1.Data.Datasets.Add(new BubbleDataset()
60+
{
61+
Label = "My First Dataset",
62+
Data = BubbleDataExamples.SimpleBubble,
63+
BackgroundColor = Colors.PaletteBorder1.FirstOrDefault()
64+
});
65+
}
66+
}

0 commit comments

Comments
 (0)