Skip to content

Commit 3e79836

Browse files
joadanjoadan
committed
Added support for Treemap
1 parent f95ea71 commit 3e79836

File tree

12 files changed

+842
-90
lines changed

12 files changed

+842
-90
lines changed

‎Blazor-ApexCharts.sln

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

22
Microsoft Visual Studio Solution File, Format Version 12.00
3-
# Visual Studio Version 16
4-
VisualStudioVersion = 16.0.29521.150
3+
# Visual Studio Version 17
4+
VisualStudioVersion = 17.0.31717.71
55
MinimumVisualStudioVersion = 10.0.40219.1
66
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Blazor-ApexCharts", "src\Blazor-ApexCharts\Blazor-ApexCharts.csproj", "{4AE79EC9-B419-430D-A70F-FE9AF8A1A4B3}"
77
EndProject

‎samples/DemoCharts/Pages/BasicCharts.razor

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,11 @@
55
<div class="row">
66
<div class="col-md-12 col-lg-6">
77
<div>
8-
Pie/Donut
8+
Pie/Donut/Treemap
99
<select class="form-control" @bind="pieChartType">
1010
<option>Pie</option>
1111
<option>Donut</option>
12+
<option>Treemap</option>
1213
</select>
1314
</div>
1415

@@ -36,6 +37,7 @@
3637
<option>Radar</option>
3738
<option>Scatter</option>
3839
<option>Histogram</option>
40+
<option>Treemap</option>
3941
</select>
4042

4143
</div>

‎samples/DemoCharts/Pages/DateTimeChart.razor

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66

77
<div class="row">
88
<div class="col-md-12 col-lg-6">
9-
<ApexChart TItem="Order" Title="Orders Value" Debug
9+
<ApexChart TItem="Order" Title="Orders Value"
1010
OnDataPointSelection="DataPointSelected"
1111
ChartType="ChartType.Bar"
1212
XAxisType="XaxisType.Datetime"

‎samples/DemoCharts/Pages/Treemap.razor

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
@page "/treemap-chart"
2+
3+
<div class="row">
4+
<div class="col-sm-12 col-md-8 col-lg-6">
5+
6+
<ApexChart TItem="Order" Title="Orders Net By Type"
7+
ChartType="ChartType.Treemap"
8+
Options=options>
9+
10+
<ApexSeries TItem="Order"
11+
Items="Orders"
12+
Name="Order Value"
13+
XValue="@(e => e.OrderType)"
14+
YAggregate="@(e => e.Sum(e => e.NetValue))"
15+
ShowDataLabels="true" />
16+
</ApexChart>
17+
</div>
18+
</div>
19+
20+
@code {
21+
private List<Order> Orders { get; set; }
22+
private ApexChartOptions<Order> options = new ApexChartOptions<Order>();
23+
24+
protected override void OnInitialized()
25+
{
26+
Orders = SampleData.GetOrders();
27+
28+
options.PlotOptions = new PlotOptions
29+
{
30+
Treemap = new PlotOptionsTreemap
31+
{
32+
EnableShades = true,
33+
ShadeIntensity = 0.5,
34+
ReverseNegativeShade = true,
35+
ColorScale = new TreemapColorScale
36+
{
37+
Ranges = new List<TreemapRanges>
38+
{
39+
new TreemapRanges {
40+
Color = "#CD363A",
41+
From = 0,
42+
To = 65000
43+
},
44+
new TreemapRanges
45+
{
46+
Color = "#52B12C",
47+
From = 65000,
48+
To = 100000
49+
},
50+
new TreemapRanges
51+
{
52+
Color = "#3B93A5",
53+
From = 100000,
54+
To = 300000
55+
}
56+
}
57+
}
58+
}
59+
};
60+
}
61+
}

‎samples/DemoCharts/Properties/launchSettings.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
"IIS Express": {
1212
"commandName": "IISExpress",
1313
"launchBrowser": true,
14-
"launchUrl": "datetime-chart",
14+
"launchUrl": "treemap-chart",
1515
"environmentVariables": {
1616
"ASPNETCORE_ENVIRONMENT": "Development"
1717
},

‎samples/DemoCharts/Shared/MainLayout.razor

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,7 @@
66
</div>
77

88
<div class="main">
9-
<div class="top-row px-4">
10-
<a href="http://blazor.net" target="_blank" class="ml-md-auto">About</a>
11-
</div>
12-
9+
1310
<div class="content px-4">
1411
@Body
1512
</div>

‎samples/DemoCharts/Shared/NavMenu.razor

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,11 @@
3131
<NavLink class="nav-link" href="radialbar-chart">
3232
<span class="oi oi-dial" aria-hidden="true"></span>Radial Bar Chart
3333
</NavLink>
34+
</li>
35+
<li class="nav-item px-3">
36+
<NavLink class="nav-link" href="treemap-chart">
37+
<span class="oi oi-grid-three-up" aria-hidden="true"></span>Treemap Chart
38+
</NavLink>
3439
</li>
3540
<li class="nav-item px-3">
3641
<NavLink class="nav-link" href="sparklines">

‎samples/DemoCharts/wwwroot/index.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
<link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
1010
<link href="css/app.css" rel="stylesheet" />
1111
<link href="DemoCharts.styles.css" rel="stylesheet" />
12+
<link href="_content/Blazor-ApexCharts/css/apexcharts.css" rel="stylesheet" />
13+
1214
</head>
1315

1416
<body>

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

Lines changed: 51 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,54 @@ public class ApexChartOptions<TItem>
117117
public List<YAxis> Yaxis { get; set; }
118118
}
119119

120+
public class PlotOptionsTreemap
121+
{
122+
public bool? EnableShades { get; set; }
123+
public double? ShadeIntensity { get; set; }
124+
public bool? Distributed { get; set; }
125+
public bool? ReverseNegativeShade { get; set; }
126+
public bool? UseFillColorAsStroke { get; set; }
127+
public TreemapColorScale ColorScale { get; set; }
128+
}
129+
130+
public class TreemapColorScale
131+
{
132+
public bool? Inverse { get; set; }
133+
public List<TreemapRanges> Ranges { get; set; }
134+
public double? Min { get; set; }
135+
public double? Max { get; set; }
136+
}
137+
138+
public class TreemapRanges
139+
{
140+
public double? From { get; set; }
141+
public double? To { get; set; }
142+
public string Color { get; set; }
143+
public string ForeColor { get; set; }
144+
public string Name { get; set; }
145+
}
146+
// treemap?: {
147+
// enableShades?: boolean
148+
// shadeIntensity?: number
149+
// distributed?: boolean
150+
// reverseNegativeShade?: boolean
151+
// useFillColorAsStroke?: boolean
152+
// colorScale?: {
153+
// inverse?: boolean
154+
// ranges?: {
155+
// from?: number
156+
// to?: number
157+
// color?: string
158+
// foreColor?: string
159+
// name?: string
160+
// }
161+
// [];
162+
// min?: number
163+
// max?: number
164+
//};
165+
// }
166+
// }
167+
120168
public class Annotations
121169
{
122170
public List<AnnotationsImage> Images { get; set; }
@@ -730,6 +778,7 @@ public class PlotOptions
730778
public PlotOptionsPolarArea PolarArea { get; set; }
731779
public PlotOptionsRadar Radar { get; set; }
732780
public PlotOptionsRadialBar RadialBar { get; set; }
781+
public PlotOptionsTreemap Treemap { get; set; }
733782
}
734783

735784
public class PlotOptionsBar
@@ -3162,7 +3211,7 @@ public enum StackType
31623211

31633212
public enum AutoSelected { Pan, Selection, Zoom };
31643213

3165-
public enum ChartType { Area, Bar, Bubble, Candlestick, Donut, Heatmap, Histogram, Line, Pie, PolarArea, Radar, RadialBar, RangeBar, Scatter };
3214+
public enum ChartType { Area, Bar, Bubble, Candlestick, Donut, Heatmap, Histogram, Line, Pie, PolarArea, Radar, RadialBar, RangeBar, Scatter, Treemap };
31663215

31673216
public enum ZoomType { X, Xy, Y };
31683217

@@ -3257,72 +3306,7 @@ public struct DatumDatum
32573306
public bool IsNull => UnionArray == null && Double == null;
32583307
}
32593308

3260-
//public struct SeriesDatum
3261-
//{
3262-
// public List<DatumDatum> AnythingArray;
3263-
// public double? Double;
3264-
// public PurpleDatum PurpleDatum;
3265-
3266-
// public static implicit operator SeriesDatum(List<DatumDatum> AnythingArray) => new SeriesDatum { AnythingArray = AnythingArray };
3267-
// public static implicit operator SeriesDatum(double Double) => new SeriesDatum { Double = Double };
3268-
// public static implicit operator SeriesDatum(PurpleDatum PurpleDatum) => new SeriesDatum { PurpleDatum = PurpleDatum };
3269-
// public bool IsNull => AnythingArray == null && PurpleDatum == null && Double == null;
3270-
//}
3271-
3272-
//public struct SeriesElement
3273-
//{
3274-
// public double? Double;
3275-
// public Series SeriesClass;
3276-
3277-
// public static implicit operator SeriesElement(double Double) => new SeriesElement { Double = Double };
3278-
// public static implicit operator SeriesElement(Series SeriesClass) => new SeriesElement { SeriesClass = SeriesClass };
3279-
//}
3280-
3281-
//public struct Custom
3282-
//{
3283-
// public Dictionary<string, object> AnythingMap;
3284-
// public List<Dictionary<string, object>> AnythingMapArray;
3285-
3286-
// public static implicit operator Custom(Dictionary<string, object> AnythingMap) => new Custom { AnythingMap = AnythingMap };
3287-
// public static implicit operator Custom(List<Dictionary<string, object>> AnythingMapArray) => new Custom { AnythingMapArray = AnythingMapArray };
3288-
//}
3289-
3290-
//public struct TooltipY
3291-
//{
3292-
// public FluffyY FluffyY;
3293-
// public List<PurpleY> PurpleYArray;
3294-
3295-
// public static implicit operator TooltipY(FluffyY FluffyY) => new TooltipY { FluffyY = FluffyY };
3296-
// public static implicit operator TooltipY(List<PurpleY> PurpleYArray) => new TooltipY { PurpleYArray = PurpleYArray };
3297-
//}
3298-
3299-
//public struct TickAmountUnion
3300-
//{
3301-
// public double? Double;
3302-
// public TickAmountEnum? Enum;
3303-
3304-
// public static implicit operator TickAmountUnion(double Double) => new TickAmountUnion { Double = Double };
3305-
// public static implicit operator TickAmountUnion(TickAmountEnum Enum) => new TickAmountUnion { Enum = Enum };
3306-
//}
3307-
3308-
//public struct Max
3309-
//{
3310-
// public Dictionary<string, object> AnythingMap;
3311-
// public double? Double;
3312-
3313-
// public static implicit operator Max(Dictionary<string, object> AnythingMap) => new Max { AnythingMap = AnythingMap };
3314-
// public static implicit operator Max(double Double) => new Max { Double = Double };
3315-
//}
3316-
3317-
//public struct Yaxis_Old
3318-
//{
3319-
// public List<YaxisYaxi> YaxisYaxiArray;
3320-
// public YaxisYaxis YaxisYaxis;
3321-
3322-
// public static implicit operator Yaxis(List<YaxisYaxi> YaxisYaxiArray) => new Yaxis { YaxisYaxiArray = YaxisYaxiArray };
3323-
// public static implicit operator Yaxis(YaxisYaxis YaxisYaxis) => new Yaxis { YaxisYaxis = YaxisYaxis };
3324-
//}
3325-
3309+
33263310
public struct ApexAxisChartSeryDatum
33273311
{
33283312
public List<DatumDatum> AnythingArray;

0 commit comments

Comments
 (0)