Skip to content

Commit 0461d8b

Browse files
authored
Merge pull request #4 from kmuthukumar23/EJ2-24507-github
Source Updated with V17.1.0.38-beta
2 parents 8bafbb1 + f8ed035 commit 0461d8b

Some content is hidden

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

48 files changed

+18325
-4731
lines changed

ej2-blazor-samples/Pages/Buttons/Button/RadioButton.cshtml

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -80,14 +80,6 @@
8080
margin: 20px 0;
8181
}
8282
83-
.radio-control h4 {
84-
color: rgba(0, 0, 0, 0.64);
85-
}
86-
87-
.highcontrast .radio-control h4 {
88-
color: rgba(255, 255, 255, 0.64);
89-
}
90-
9183
.e-bigger .radio-control h4 {
9284
font-size: 20px;
9385
}

ej2-blazor-samples/Pages/Charts/Chart/DefaultFunctionalities.cshtml

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
@*End:Hidden*@
3434

3535
<div class="control-section">
36-
<EjsChart id="charts" title="Inflation - Consumer Price" ref="chart" primaryXAxis="@xAxis" primaryYAxis="@yAxis">
36+
<EjsChart id="charts" title="Inflation - Consumer Price" primaryXAxis="@xAxis" primaryYAxis="@yAxis" chartArea="@chartArea">
3737
<ChartTooltipsettings enable="true"></ChartTooltipsettings>
3838
<ChartSeriesCollection>
3939
<ChartSeries dataSource="@dataSource" name="Germany" xName="xValue" width="2"
@@ -48,10 +48,6 @@
4848

4949
@functions{
5050

51-
EjsChart chart;
52-
53-
54-
5551
public class LineChartData
5652
{
5753
public DateTime xValue;
@@ -68,6 +64,9 @@
6864
majorGridLines = new { width = 0.0000001 }
6965
};
7066

67+
public Object chartArea = new {
68+
border = new { width = 0.00000001 }
69+
};
7170

7271

7372
public Object yAxis = new

ej2-blazor-samples/Pages/Charts/Chart/Trackball.cshtml

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
@*End:Hidden*@
3737

3838
<div class="control-section">
39-
<EjsChart id="trackball" title="Inflation - Consumer Price" primaryXAxis="@xAxis" primaryYAxis="@yAxis" dataSource="@chartData">
39+
<EjsChart id="trackball" title="Inflation - Consumer Price" primaryXAxis="@xAxis" primaryYAxis="@yAxis" dataSource="@chartData" chartArea="@chartArea">
4040
<ChartTooltipsettings enable="true" shared="true"></ChartTooltipsettings>
4141
<ChartChartarea chartareaborder=""></ChartChartarea>
4242
<ChartCrosshairsettings enable="true" lineType="@linetype"></ChartCrosshairsettings>
@@ -86,15 +86,18 @@
8686
majorGridLines = new { width = 0.0000001 }
8787
};
8888

89-
89+
public Object chartArea = new {
90+
border = new { width = 0.00000001 }
91+
};
9092

9193
public Object yAxis = new
9294
{
9395
labelFormat = "{value}M",
9496
rangePadding = "None",
9597
title = "Revenue",
9698
majorTickLines = new { width = 0.000001 },
97-
minorTickLines = new { width = 0.000001 }
99+
minorTickLines = new { width = 0.000001 },
100+
lineStyle = new { width = 0.000001 }
98101
};
99102

100103
public Object tooltip = new
Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
@page "/Charts/LightWeight"
2+
@using Syncfusion.EJ2.RazorComponents.Charts
3+
@using System;
4+
@using System.Collections.Generic;
5+
@using System.Linq;
6+
@using System.Threading.Tasks;
7+
@using Newtonsoft.Json;
8+
@*Hidden:Lines*@
9+
@using ej2_blazor_samples
10+
@{
11+
SampleBrowser.CurrentSampleName = SampleBrowser.Config.RangeNavigator[1].Name;
12+
SampleBrowser.CurrentControlName = "RangeNavigator";
13+
SampleBrowser.CurrentControlCategory = "RangeNavigator";
14+
SampleBrowser.CurrentControl = SampleBrowser.Config.RangeNavigator;
15+
SampleBrowser.ActionDescription = new string[] {
16+
@"<p>
17+
This sample visualizes the bitcoin price range with area series in the light weight range navigator. Selected range values are enhanced with tooltip.
18+
</p>"
19+
};
20+
SampleBrowser.Description = new string[] {
21+
@"<p>
22+
In this example, you can see how to render and configure the Light Weight Range Navigator.
23+
</p>"
24+
};
25+
}
26+
@*End:Hidden*@
27+
28+
<div class="control-section">
29+
30+
<h4 id="default" style="font-family: Segoe UI;font-weight: 500; font-style:normal; font-size:15px;" align="center">LightWeight Range Navigator</h4>
31+
<EjsRangeNavigator id="range" valueType=Syncfusion.EJ2.RazorComponents.Charts.RangeValueType.DateTime tooltip="@tooltip" dataSource="@data" xName="xValue" yName="yValue">
32+
</EjsRangeNavigator>
33+
34+
</div>
35+
36+
@functions{
37+
public Object tooltip = new
38+
{
39+
enable = true,
40+
displayMode = "Always"
41+
};
42+
43+
public List<object> data { get; set; } = new List<object> {
44+
45+
new LineChartData { xValue = new DateTime(2005, 01, 01), yValue = 21, yValue1 = 28 },
46+
new LineChartData { xValue = new DateTime(2006, 01, 01), yValue = 24, yValue1 = 44 },
47+
new LineChartData { xValue = new DateTime(2007, 01, 01), yValue = 36, yValue1 = 48 },
48+
new LineChartData { xValue = new DateTime(2008, 01, 01), yValue = 38, yValue1 = 50 },
49+
new LineChartData { xValue = new DateTime(2009, 01, 01), yValue = 54, yValue1 = 66 },
50+
new LineChartData { xValue = new DateTime(2010, 01, 01), yValue = 57, yValue1 = 78 },
51+
new LineChartData { xValue = new DateTime(2011, 01, 01), yValue = 70, yValue1 = 84 },
52+
};
53+
54+
public class LineChartData
55+
{
56+
public DateTime xValue;
57+
public double yValue;
58+
public double yValue1;
59+
};
60+
61+
}

ej2-blazor-samples/Pages/Charts/RangeNavigator/RangeNavigator.cshtml

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,18 +10,25 @@
1010
@{
1111
SampleBrowser.CurrentSampleName = "RangeNavigator";
1212
SampleBrowser.CurrentControlName = "RangeNavigator";
13-
SampleBrowser.CurrentControlCategory = "Chart";
13+
SampleBrowser.CurrentControlCategory = "RangeNavigator";
1414
SampleBrowser.CurrentControl = SampleBrowser.Config.RangeNavigator;
1515
SampleBrowser.ActionDescription = new string[] {
16+
@"<p>
17+
This sample visualizes the bitcoin price range with area series in the range navigator. Selected range values are enhanced with tooltip.
18+
</p>"
1619
};
1720
SampleBrowser.Description = new string[] {
21+
@"<p>
22+
In this example, you can see how to render and configure the Range Navigator.
23+
<code>AreaSeries</code> is used to represent selected data value.
24+
</p>"
1825
};
1926
}
2027
@*End:Hidden*@
2128

2229
<div class="control-section">
2330

24-
<h4 id="default" style="font-family: Segoe UI;font-weight: 500; font-style:normal; font-size:15px;">Bitcoin (USD) Price Range</h4>
31+
<h4 id="default" style="font-family: Segoe UI;font-weight: 500; font-style:normal; font-size:15px;" align="center">Bitcoin (USD) Price Range</h4>
2532
<EjsRangeNavigator id="range" valueType=Syncfusion.EJ2.RazorComponents.Charts.RangeValueType.DateTime tooltip="@tooltip" dataSource="@data" series="@series">
2633
</EjsRangeNavigator>
2734

ej2-blazor-samples/Pages/Charts/SampleList.cs

Lines changed: 20 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,15 @@ internal partial class SampleConfig
6464
Url = "Charts/RangeNavigator",
6565
FileName = "RangeNavigator.cshtml",
6666
Type = SampleType.New
67+
},
68+
new Sample
69+
{
70+
Name = "Light weight",
71+
Category = "Range Navigator",
72+
Directory = "Charts/RangeNavigator",
73+
Url = "Charts/LightWeight",
74+
FileName = "LightWeight.cshtml",
75+
Type = SampleType.New
6776
}
6877
};
6978

@@ -112,12 +121,21 @@ internal partial class SampleConfig
112121
public List<Sample> StockChart { get; set; } = new List<Sample>{
113122
new Sample
114123
{
115-
Name = "Stock Chart",
116-
Category = "StockChart",
124+
Name = "StockChart",
125+
Category = "Stock Chart",
117126
Directory = "Charts/StockChart",
118127
Url = "Charts/StockChart",
119128
FileName = "StockChart.cshtml",
120129
Type = SampleType.New
130+
},
131+
new Sample
132+
{
133+
Name = "Hide Range Selector",
134+
Category = "Stock Chart",
135+
Directory = "Charts/StockChart",
136+
Url = "Charts/HideSelector",
137+
FileName = "HideSelector.cshtml",
138+
Type = SampleType.New
121139
}
122140
};
123141
}
Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
@page "/Charts/HideSelector"
2+
@using Syncfusion.EJ2.RazorComponents.Charts
3+
@using System;
4+
@using System.Collections.Generic;
5+
@using System.Linq;
6+
@using System.Threading.Tasks;
7+
@using Newtonsoft.Json;
8+
@*Hidden:Lines*@
9+
@using ej2_blazor_samples
10+
@{
11+
SampleBrowser.CurrentSampleName = SampleBrowser.Config.StockChart[1].Name;
12+
SampleBrowser.CurrentControlName = "StockChart";
13+
SampleBrowser.CurrentControlCategory = "StockChart";
14+
SampleBrowser.CurrentControl = SampleBrowser.Config.StockChart;
15+
SampleBrowser.ActionDescription = new string[] {
16+
@"<p>
17+
This sample visualizes stock chart without range Slider.
18+
</p>"
19+
};
20+
SampleBrowser.Description = new string[] {
21+
@"<p>
22+
In this example, you can see how to render and configure the Stock chart.
23+
<code>LineSeries</code> is used to represent selected data value.
24+
</p>
25+
<br>"
26+
};
27+
}
28+
@*End:Hidden*@
29+
30+
<div class="control-section">
31+
<EjsStockChart id="stockChart" title="AAPL Stock Price" series="@seriesData" primaryXAxis="@xAxis" primaryYAxis="@yAxis" tooltip="@tooltip" dataSource="@data" enableSelector="false">
32+
</EjsStockChart>
33+
</div>
34+
35+
@functions{
36+
37+
public Object xAxis = new
38+
{
39+
valueType = "DateTime",
40+
labelFormat = "y",
41+
intervalType = "Years",
42+
edgelabelPalcement = "Shift",
43+
majorGridLines = new { width = 0.0000001 }
44+
};
45+
46+
47+
48+
public Object yAxis = new
49+
{
50+
labelFormat = "{value}M",
51+
rangePadding = "None",
52+
title = "Revenue",
53+
majorTickLines = new { width = 0.000001 },
54+
minorTickLines = new { width = 0.000001 }
55+
};
56+
57+
public Object tooltip = new
58+
{
59+
enable = false,
60+
shared = true
61+
};
62+
63+
64+
65+
public Object crosshair = new
66+
{
67+
enable = false,
68+
lineType = "Vertical"
69+
};
70+
71+
public List<object> data { get; set; } = new List<object> {
72+
73+
new LineChartData { xValue = new DateTime(2005, 01, 01), yValue = 21, yValue1 = 28 },
74+
new LineChartData { xValue = new DateTime(2006, 01, 01), yValue = 24, yValue1 = 44 },
75+
new LineChartData { xValue = new DateTime(2007, 01, 01), yValue = 36, yValue1 = 48 },
76+
new LineChartData { xValue = new DateTime(2008, 01, 01), yValue = 38, yValue1 = 50 },
77+
new LineChartData { xValue = new DateTime(2009, 01, 01), yValue = 54, yValue1 = 66 },
78+
new LineChartData { xValue = new DateTime(2010, 01, 01), yValue = 57, yValue1 = 78 },
79+
new LineChartData { xValue = new DateTime(2011, 01, 01), yValue = 70, yValue1 = 84 },
80+
};
81+
82+
public class LineChartData
83+
{
84+
public DateTime xValue;
85+
public double yValue;
86+
public double yValue1;
87+
};
88+
89+
90+
91+
92+
public List<object> seriesData { get; set; } = new List<object>
93+
{
94+
new { xName = "xValue", type = "Line", yName = "yValue" }
95+
};
96+
97+
}

ej2-blazor-samples/Pages/Charts/StockChart/StockChart.cshtml

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
@*Hidden:Lines*@
99
@using ej2_blazor_samples
1010
@{
11-
SampleBrowser.CurrentSampleName = "Stock Chart";
11+
SampleBrowser.CurrentSampleName = SampleBrowser.Config.StockChart[0].Name;
1212
SampleBrowser.CurrentControlName = "StockChart";
1313
SampleBrowser.CurrentControlCategory = "StockChart";
1414
SampleBrowser.CurrentControl = SampleBrowser.Config.StockChart;
@@ -20,15 +20,15 @@
2020
SampleBrowser.Description = new string[] {
2121
@"<p>
2222
In this example, you can see how to render and configure the Stock chart.
23-
<code>CandleSeries</code> is used to represent selected data value.
23+
<code>LineSeries</code> is used to represent selected data value.
2424
</p>
2525
<br>"
2626
};
2727
}
2828
@*End:Hidden*@
2929

3030
<div class="control-section">
31-
<EjsStockChart id="stockChart" Title="AAPL Stock Price" series="@seriesData" primaryXAxis="@xAxis" primaryYAxis="@yAxis" tooltip="@tooltip" dataSource="@data">
31+
<EjsStockChart id="stockChart" title="AAPL Stock Price" series="@seriesData" primaryXAxis="@xAxis" primaryYAxis="@yAxis" tooltip="@tooltip" dataSource="@data">
3232
</EjsStockChart>
3333
</div>
3434

@@ -59,15 +59,15 @@
5959

6060
public Object tooltip = new
6161
{
62-
enable = true,
62+
enable = false,
6363
shared = true
6464
};
6565

6666

6767

6868
public Object crosshair = new
6969
{
70-
enable = true,
70+
enable = false,
7171
lineType = "Vertical"
7272
};
7373

@@ -97,4 +97,4 @@
9797
new { xName = "xValue", type = "Line", yName = "yValue" }
9898
};
9999

100-
};
100+
}

0 commit comments

Comments
 (0)