You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
112 lines
3.5 KiB
112 lines
3.5 KiB
|
|
/**
|
|
* Theme: Moltran Admin Template
|
|
* Author: Coderthemes
|
|
* Morris Chart
|
|
*/
|
|
|
|
!function($) {
|
|
"use strict";
|
|
|
|
var MorrisCharts = function() {};
|
|
|
|
//creates line chart
|
|
MorrisCharts.prototype.createLineChart = function(element, data, xkey, ykeys, labels, lineColors) {
|
|
Morris.Line({
|
|
element: element,
|
|
data: data,
|
|
xkey: xkey,
|
|
ykeys: ykeys,
|
|
labels: labels,
|
|
resize: true, //defaulted to true
|
|
lineColors: lineColors
|
|
});
|
|
},
|
|
//creates area chart
|
|
MorrisCharts.prototype.createAreaChart = function(element, pointSize, lineWidth, data, xkey, ykeys, labels, lineColors) {
|
|
Morris.Area({
|
|
element: element,
|
|
pointSize: 0,
|
|
lineWidth: 0,
|
|
data: data,
|
|
xkey: xkey,
|
|
ykeys: ykeys,
|
|
labels: labels,
|
|
resize: true,
|
|
lineColors: lineColors
|
|
});
|
|
},
|
|
//creates Bar chart
|
|
MorrisCharts.prototype.createBarChart = function(element, data, xkey, ykeys, labels, lineColors) {
|
|
Morris.Bar({
|
|
element: element,
|
|
data: data,
|
|
xkey: xkey,
|
|
ykeys: ykeys,
|
|
labels: labels,
|
|
barColors: lineColors
|
|
});
|
|
},
|
|
//creates Donut chart
|
|
MorrisCharts.prototype.createDonutChart = function(element, data, colors) {
|
|
Morris.Donut({
|
|
element: element,
|
|
data: data,
|
|
colors: colors
|
|
});
|
|
},
|
|
MorrisCharts.prototype.init = function() {
|
|
|
|
//create line chart
|
|
var $data = [
|
|
{ y: '2009', a: 100, b: 90 },
|
|
{ y: '2010', a: 75, b: 65 },
|
|
{ y: '2011', a: 50, b: 40 },
|
|
{ y: '2012', a: 75, b: 65 },
|
|
{ y: '2013', a: 50, b: 40 },
|
|
{ y: '2014', a: 75, b: 65 },
|
|
{ y: '2015', a: 100, b: 90 }
|
|
];
|
|
this.createLineChart('morris-line-example', $data, 'y', ['a', 'b'], ['Series A', 'Series B'], ['#317eeb', '#999999']);
|
|
|
|
//creating area chart
|
|
var $areaData = [
|
|
{ y: '2009', a: 10, b: 20 },
|
|
{ y: '2010', a: 75, b: 65 },
|
|
{ y: '2011', a: 50, b: 40 },
|
|
{ y: '2012', a: 75, b: 65 },
|
|
{ y: '2013', a: 50, b: 40 },
|
|
{ y: '2014', a: 75, b: 65 },
|
|
{ y: '2015', a: 90, b: 60 }
|
|
];
|
|
this.createAreaChart('morris-area-example', 0, 0, $areaData, 'y', ['a', 'b'], ['Series A', 'Series B'], ['#317eeb', '#999999']);
|
|
|
|
//creating bar chart
|
|
var $barData = [
|
|
{ y: '2009', a: 100, b: 90 },
|
|
{ y: '2010', a: 75, b: 65 },
|
|
{ y: '2011', a: 50, b: 40 },
|
|
{ y: '2012', a: 75, b: 65 },
|
|
{ y: '2013', a: 50, b: 40 },
|
|
{ y: '2014', a: 75, b: 65 },
|
|
{ y: '2015', a: 100, b: 90 }
|
|
];
|
|
this.createBarChart('morris-bar-example', $barData, 'y', ['a', 'b'], ['Series A', 'Series B'], ['#317eeb', '#bcbcbc']);
|
|
|
|
//creating donut chart
|
|
var $donutData = [
|
|
{label: "Download Sales", value: 12},
|
|
{label: "In-Store Sales", value: 30},
|
|
{label: "Mail-Order Sales", value: 20}
|
|
];
|
|
this.createDonutChart('morris-donut-example', $donutData, ['#dcdcdc', '#317eeb', '#999999']);
|
|
},
|
|
//init
|
|
$.MorrisCharts = new MorrisCharts, $.MorrisCharts.Constructor = MorrisCharts
|
|
}(window.jQuery),
|
|
|
|
//initializing
|
|
function($) {
|
|
"use strict";
|
|
$.MorrisCharts.init();
|
|
}(window.jQuery); |