1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
|
| /**
| * Theme: Uplon Admin Template
| * Author: Coderthemes
| * Dashboard
| */
|
| !function($) {
| "use strict";
|
| var Dashboard = function() {};
|
| //creates Stacked chart
| Dashboard.prototype.createStackedChart = function(element, data, xkey, ykeys, labels, lineColors) {
| Morris.Bar({
| element: element,
| data: data,
| xkey: xkey,
| ykeys: ykeys,
| stacked: true,
| labels: labels,
| hideHover: 'auto',
| barSizeRatio: 0.4,
| resize: true, //defaulted to true
| gridLineColor: '#eeeeee',
| barColors: lineColors
| });
| },
|
|
| //creates Donut chart
| Dashboard.prototype.createDonutChart = function(element, data, colors) {
| Morris.Donut({
| element: element,
| data: data,
| resize: true, //defaulted to true
| colors: colors
| });
| },
|
| Dashboard.prototype.init = function() {
|
| //creating Stacked chart
| var $stckedData = [
| { y: '2005', a: 45, b: 180, c: 100 },
| { y: '2006', a: 75, b: 65, c: 80 },
| { y: '2007', a: 100, b: 90, c: 56 },
| { y: '2008', a: 75, b: 65, c: 89 },
| { y: '2009', a: 100, b: 90, c: 120 },
| { y: '2010', a: 75, b: 65, c: 110 },
| { y: '2011', a: 50, b: 40, c: 85 },
| { y: '2012', a: 75, b: 65, c: 52 },
| { y: '2013', a: 50, b: 40, c: 77 },
| { y: '2014', a: 75, b: 65, c: 90 },
| { y: '2015', a: 100, b: 90, c: 130 }
| ];
| this.createStackedChart('morris-bar-stacked', $stckedData, 'y', ['a', 'b' ,'c'], ['Series A', 'Series B', 'Series C'], ['#3db9dc','#1bb99a', '#ebeff2']);
|
| //creating donut chart
| var $donutData = [
| {label: "English Language 01", value: 12},
| {label: "Italian Language 02", value: 30},
| {label: "French Language 03", value: 20}
| ];
| this.createDonutChart('morris-donut-example', $donutData, ['#3db9dc','#1bb99a', '#ebeff2']);
| },
| //init
| $.Dashboard = new Dashboard, $.Dashboard.Constructor = Dashboard
| }(window.jQuery),
|
| //initializing
| function($) {
| "use strict";
| $.Dashboard.init();
| }(window.jQuery);
|
|
