Skip to content
This repository was archived by the owner on Oct 14, 2024. It is now read-only.

Commit 86b0612

Browse files
SyncfusionBuildSyncfusionBuild
committed
v20.4.0.38
1 parent 42626ee commit 86b0612

File tree

2,729 files changed

+1395889
-1
lines changed

Some content is hidden

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

2,729 files changed

+1395889
-1
lines changed

Diff for: ‎README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -77,4 +77,4 @@ To use the Syncfusion Essential JS 1 samples, Syncfusion license key should be r
7777

7878
* To renew the subscription, click [here](https://www.syncfusion.com/sales/products?utm_source=github&utm_medium=listing) or contact our sales team at <salessupport@syncfusion.com>.
7979

80-
<p>Copyright © 2001-2022 Syncfusion, Inc. Updated on 2022-12-22 at precisely 08:41:36 EST.</p>
80+
<p>Copyright © 2001-2022 Syncfusion, Inc. Updated on 2022-12-22 at precisely 08:48:34 EST.</p>

Diff for: ‎Sparkline/Sparkline.html

+181
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,181 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
<title>Sparkline</title>
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<link href="../content/bootstrap.min.css" rel="stylesheet">
7+
<link href="../content/ejthemes/default-theme/ej.web.all.min.css" rel="stylesheet" />
8+
<link href="../content/default.css" rel="stylesheet" />
9+
<link href="../content/default-responsive.css" rel="stylesheet" />
10+
<!--[if lt IE 9]>
11+
<script src="../scripts/jquery-1.11.3.min.js" type="text/javascript"></script>
12+
<!--<![endif]-->
13+
<!--[if gte IE 9]><!-->
14+
<script src="../scripts/jquery-3.4.1.min.js" type="text/javascript"></script>
15+
<!--<![endif]-->
16+
<script src="../scripts/ej.web.all.min.js" type="text/javascript"></script>
17+
<script src="../scripts/properties.js" type="text/javascript"></script>
18+
</head>
19+
<body>
20+
<div class="content-container-fluid">
21+
<div id="sparkline" class="row">
22+
<div class="cols-sample-area">
23+
<table style="width:100%;">
24+
<tr>
25+
<td align ="center"><i>Mean Working Hours for year</i></td>
26+
<td>
27+
<div id="line" style="width:170px;"></div>
28+
</td>
29+
<tr>
30+
<td align="center"><i>Revenue Status</i></td>
31+
<td>
32+
<div id="column" style="height:100px;width:150px"></div>
33+
</td>
34+
35+
</tr>
36+
<tr>
37+
<td align="center"><i>Project Status Tracing</i></td>
38+
<td>
39+
<div id="area" style="height:100px;width:150px"></div>
40+
</td>
41+
42+
</tr>
43+
<tr>
44+
<td align="center"><i>Profit Comparison for each months</i></td>
45+
<td>
46+
<div id="winloss" style="height:100px;width:150px"></div>
47+
</td>
48+
49+
</tr>
50+
<tr>
51+
<td align="center"><i>Expenditure for a year</i></td>
52+
53+
<td>
54+
<table>
55+
<tr>
56+
<td>
57+
<div id="pie1" style="height:40px;width:40px"></div>
58+
</td>
59+
<td>
60+
<div id="pie2" style="height:40px;width:40px"></div>
61+
</td>
62+
<td>
63+
<div id="pie3" style="height:40px;width:40px"></div>
64+
</td>
65+
<td>
66+
<div id="pie4" style="height:40px;width:40px"></div>
67+
</td>
68+
</tr>
69+
<tr>
70+
<td align="center">Q1</td>
71+
<td align="center"> Q2</td>
72+
<td align="center"> Q3</td>
73+
<td align="center"> Q4</td>
74+
</tr>
75+
</table>
76+
</td>
77+
</tr>
78+
</table>
79+
</div>
80+
</div>
81+
</div>
82+
<script>
83+
if (!!window.SVGSVGElement) {
84+
$("#sparkline").css('visibility', 'visible');
85+
$("#line").ejSparkline({
86+
dataSource: [12, 14, 11, 12, 11, 15, 12, 10, 11, 12, 15, 13, 12, 11, 10, 13, 15, 12, 14, 16, 14, 12, 11],
87+
tooltip: {
88+
visible: true,
89+
font: {
90+
size: "12px",
91+
}
92+
},
93+
type: "line",
94+
size: { height: 40, width: 170 },
95+
});
96+
$("#column").ejSparkline({
97+
dataSource: [2, 6, -1, 1, 12, 5, -2, 7, -3, 5, 8, 10, ],
98+
negativePointColor: "red",
99+
highPointColor: "blue",
100+
tooltip: {
101+
visible: true,
102+
font: {
103+
size: "12px",
104+
}
105+
},
106+
type: "column",
107+
size: { height: 100, width: 150 },
108+
});
109+
$("#area").ejSparkline({
110+
dataSource: [12, -10, 11, 8, 17, 6, 2, -17, 13, -6, 8, 10, ],
111+
markerSettings: { visible: true },
112+
highPointColor: "blue",
113+
lowPointColor: "orange",
114+
type: "area",
115+
opacity: 0.5,
116+
tooltip: {
117+
visible: true,
118+
font: {
119+
size: "12px",
120+
}
121+
},
122+
size: { height: 100, width: 150 },
123+
});
124+
$("#winloss").ejSparkline({
125+
dataSource: [12, 15, -11, 13, 17, 0, -12, 17, 13, -15, 8, 10, ],
126+
type: "winloss",
127+
size: { height: 100, width: 150 },
128+
});
129+
$("#pie1").ejSparkline({
130+
dataSource: [4, 6, 7],
131+
type: "pie",
132+
tooltip: {
133+
visible: true,
134+
font: {
135+
size: "12px",
136+
}
137+
},
138+
size: { height: 40, width: 40 },
139+
});
140+
$("#pie2").ejSparkline({
141+
dataSource: [8, 9, 1, ],
142+
type: "pie",
143+
tooltip: {
144+
visible: true,
145+
font: {
146+
size: "12px",
147+
}
148+
},
149+
size: { height: 40, width: 40 },
150+
});
151+
$("#pie3").ejSparkline({
152+
dataSource: [2, 3, 5],
153+
type: "pie",
154+
tooltip: {
155+
visible: true,
156+
font: {
157+
size: "12px",
158+
}
159+
},
160+
size: { height: 40, width: 40 },
161+
});
162+
$("#pie4").ejSparkline({
163+
dataSource: [10, 12, 11],
164+
type: "pie",
165+
tooltip: {
166+
visible: true,
167+
font: {
168+
size: "12px",
169+
}
170+
},
171+
size: { height: 40, width: 40 },
172+
});
173+
} else {
174+
$("#sparkline").css('visibility', 'hidden');
175+
alert("Sparkline will not be supported in IE Version < 9");
176+
}
177+
</script>
178+
</body>
179+
180+
</html>
181+

Diff for: ‎Sparkline/Sparklinegrid.html

+97
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
<title>Essential JS 1 : Sparkline Integrated with Grid</title>
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<meta charset="utf-8" />
7+
<link href="../content/bootstrap.min.css" rel="stylesheet" />
8+
<link href="../content/ejthemes/default-theme/ej.web.all.min.css" rel="stylesheet" />
9+
<link href="../content/default.css" rel="stylesheet" />
10+
<link href="../content/default-responsive.css" rel="stylesheet" />
11+
<link href="../content/ejthemes/responsive-css/ej.responsive.css" rel="stylesheet" />
12+
<!--[if lt IE 9]>
13+
<script src="../scripts/jquery-1.11.3.min.js"></script>
14+
<![endif]-->
15+
<!--[if gte IE 9]><!-->
16+
<script src="../scripts/jquery-3.4.1.min.js"></script>
17+
<!--<![endif]-->
18+
<script src="../scripts/jsonspark.js"></script>
19+
<script src="../scripts/jsrender.min.js"></script>
20+
<script src="../scripts/ej.web.all.min.js" type="text/javascript"></script>
21+
<script src="../scripts/properties.js" type="text/javascript"></script>
22+
</head>
23+
<body>
24+
<div class="content-container-fluid">
25+
<div id="sparkline" class="row">
26+
<div class="cols-sample-area">
27+
<script type="text/x-jsrender" id="columnTemplate1">
28+
<span id="spkline{{:EmployeeID}}" />
29+
</script>
30+
<script type="text/x-jsrender" id="columnTemplate3">
31+
<span id="spkarea{{:EmployeeID}}" />
32+
</script>
33+
<script type="text/x-jsrender" id="columnTemplate4">
34+
<span id="spkwl{{:EmployeeID}}" />
35+
</script>
36+
<div id="Grid"></div>
37+
</div>
38+
</div>
39+
</div>
40+
<script type="text/javascript">
41+
$(function () {
42+
if (!!window.SVGSVGElement) {
43+
$("#sparkline").css('visibility', 'visible');
44+
$("#Grid").ejGrid({
45+
dataSource: ej.DataManager(window.gridData).executeLocal(ej.Query().take(50)),
46+
allowSelection: false,
47+
allowScrolling: true,
48+
scrollSettings: { height: 400 },
49+
enableRowHover: false,
50+
columns: [
51+
52+
{ field: "EmployeeID", headerText: "ID", textAlign: ej.TextAlign.Right, width: 50 },
53+
{ field: "CustomerID", headerText: "Customer ID", width: 90 },
54+
{ field: "OrderDate", headerText: "Order Date", width: 90, format: "{0:MM/dd/yyyy}", textAlign: ej.TextAlign.Right },
55+
{ field: "ShipCountry", headerText: "Ship Country", width: 80 },
56+
{ headerText: "Tax per annum", height: 50, template: true, templateID: "#columnTemplate1", textAlign: "center" },
57+
{ headerText: "One Day Index", height: 50, template: true, templateID: "#columnTemplate3", textAlign: "center" },
58+
{ headerText: "Year GR", height: 50, template: true, templateID: "#columnTemplate4", textAlign: "center" },
59+
60+
],
61+
create: "render",
62+
actionComplete: "render"
63+
});
64+
}
65+
else {
66+
$("#sparkline").css('visibility', 'hidden');
67+
alert("Sparkline will not be supported in IE Version < 9");
68+
}
69+
});
70+
function render(args) {
71+
for (var i = 0; i < 51; i++) {
72+
$("#spkline" + i).ejSparkline({ size: { height: 50, width: 150 } });
73+
$("#spkarea" + i).ejSparkline({ type: "column", size: { height: 50, width: 150 } });
74+
$("#spkwl" + i).ejSparkline({ dataSource: winloss(), type: "winloss", size: { height: 50, width: 150 } });
75+
}
76+
if (args.type == "create")
77+
this.getScrollObject().refresh();
78+
}
79+
function winloss() {
80+
var windata = [], r;
81+
for (var i = 1; i <= 12; i++) {
82+
r = Math.random();
83+
if (r <= 0.2)
84+
windata.push(-Math.random() * 10);
85+
else
86+
windata.push(Math.random() * 10);
87+
}
88+
return windata;
89+
}
90+
</script>
91+
<style type="text/css" class="cssStyles">
92+
.rowcell {
93+
font-size: 15px !important;
94+
}
95+
</style>
96+
</body>
97+
</html>

0 commit comments

Comments
 (0)