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.
106 lines
3.6 KiB
106 lines
3.6 KiB
/*global $, document, Chart, LINECHART, data, options, window*/
|
|
$(document).ready(function () {
|
|
|
|
'use strict';
|
|
|
|
// Main Template Color
|
|
var brandPrimary = '#33b35a';
|
|
|
|
|
|
// ------------------------------------------------------- //
|
|
// Line Chart
|
|
// ------------------------------------------------------ //
|
|
var LINECHART = $('#lineCahrt');
|
|
var myLineChart = new Chart(LINECHART, {
|
|
type: 'line',
|
|
options: {
|
|
legend: {
|
|
display: false
|
|
}
|
|
},
|
|
data: {
|
|
labels: ["Jan", "Feb", "Mar", "Apr", "May", "June", "July"],
|
|
datasets: [
|
|
{
|
|
label: "My First dataset",
|
|
fill: true,
|
|
lineTension: 0.3,
|
|
backgroundColor: "rgba(77, 193, 75, 0.4)",
|
|
borderColor: brandPrimary,
|
|
borderCapStyle: 'butt',
|
|
borderDash: [],
|
|
borderDashOffset: 0.0,
|
|
borderJoinStyle: 'miter',
|
|
borderWidth: 1,
|
|
pointBorderColor: brandPrimary,
|
|
pointBackgroundColor: "#fff",
|
|
pointBorderWidth: 1,
|
|
pointHoverRadius: 5,
|
|
pointHoverBackgroundColor: brandPrimary,
|
|
pointHoverBorderColor: "rgba(220,220,220,1)",
|
|
pointHoverBorderWidth: 2,
|
|
pointRadius: 1,
|
|
pointHitRadius: 0,
|
|
data: [50, 20, 60, 31, 52, 22, 40],
|
|
spanGaps: false
|
|
},
|
|
{
|
|
label: "My First dataset",
|
|
fill: true,
|
|
lineTension: 0.3,
|
|
backgroundColor: "rgba(75,192,192,0.4)",
|
|
borderColor: "rgba(75,192,192,1)",
|
|
borderCapStyle: 'butt',
|
|
borderDash: [],
|
|
borderDashOffset: 0.0,
|
|
borderJoinStyle: 'miter',
|
|
borderWidth: 1,
|
|
pointBorderColor: "rgba(75,192,192,1)",
|
|
pointBackgroundColor: "#fff",
|
|
pointBorderWidth: 1,
|
|
pointHoverRadius: 5,
|
|
pointHoverBackgroundColor: "rgba(75,192,192,1)",
|
|
pointHoverBorderColor: "rgba(220,220,220,1)",
|
|
pointHoverBorderWidth: 2,
|
|
pointRadius: 1,
|
|
pointHitRadius: 10,
|
|
data: [65, 59, 30, 81, 46, 55, 30],
|
|
spanGaps: false
|
|
}
|
|
]
|
|
}
|
|
});
|
|
|
|
|
|
// ------------------------------------------------------- //
|
|
// Pie Chart
|
|
// ------------------------------------------------------ //
|
|
var PIECHART = $('#pieChart');
|
|
var myPieChart = new Chart(PIECHART, {
|
|
type: 'doughnut',
|
|
data: {
|
|
labels: [
|
|
"First",
|
|
"Second",
|
|
"Third"
|
|
],
|
|
datasets: [
|
|
{
|
|
data: [300, 50, 100],
|
|
borderWidth: [1, 1, 1],
|
|
backgroundColor: [
|
|
brandPrimary,
|
|
"rgba(75,192,192,1)",
|
|
"#FFCE56"
|
|
],
|
|
hoverBackgroundColor: [
|
|
brandPrimary,
|
|
"rgba(75,192,192,1)",
|
|
"#FFCE56"
|
|
]
|
|
}]
|
|
}
|
|
});
|
|
|
|
});
|