629 lines
20 KiB
JavaScript
629 lines
20 KiB
JavaScript
|
/*global $, document*/
|
||
|
|
$(document).ready(function () {
|
||
|
|
|
||
|
|
'use strict';
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Charts Gradients
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var ctx1 = $("canvas").get(0).getContext("2d");
|
||
|
|
var gradient1 = ctx1.createLinearGradient(150, 0, 150, 300);
|
||
|
|
gradient1.addColorStop(0, 'rgba(133, 180, 242, 0.91)');
|
||
|
|
gradient1.addColorStop(1, 'rgba(255, 119, 119, 0.94)');
|
||
|
|
|
||
|
|
var gradient2 = ctx1.createLinearGradient(146.000, 0.000, 154.000, 300.000);
|
||
|
|
gradient2.addColorStop(0, 'rgba(104, 179, 112, 0.85)');
|
||
|
|
gradient2.addColorStop(1, 'rgba(76, 162, 205, 0.85)');
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Line Chart
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var LINECHARTEXMPLE = $('#lineChartExample');
|
||
|
|
var lineChartExample = new Chart(LINECHARTEXMPLE, {
|
||
|
|
type: 'line',
|
||
|
|
options: {
|
||
|
|
legend: {labels:{fontColor:"#777", fontSize: 12}},
|
||
|
|
scales: {
|
||
|
|
xAxes: [{
|
||
|
|
display: true,
|
||
|
|
gridLines: {
|
||
|
|
color: '#eee'
|
||
|
|
}
|
||
|
|
}],
|
||
|
|
yAxes: [{
|
||
|
|
display: true,
|
||
|
|
gridLines: {
|
||
|
|
color: '#eee'
|
||
|
|
}
|
||
|
|
}]
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: {
|
||
|
|
labels: ["January", "February", "March", "April", "May", "June", "July"],
|
||
|
|
datasets: [
|
||
|
|
{
|
||
|
|
label: "Data Set One",
|
||
|
|
fill: true,
|
||
|
|
lineTension: 0.3,
|
||
|
|
backgroundColor: gradient1,
|
||
|
|
borderColor: gradient1,
|
||
|
|
borderCapStyle: 'butt',
|
||
|
|
borderDash: [],
|
||
|
|
borderDashOffset: 0.0,
|
||
|
|
borderJoinStyle: 'miter',
|
||
|
|
borderWidth: 1,
|
||
|
|
pointBorderColor: gradient1,
|
||
|
|
pointBackgroundColor: "#fff",
|
||
|
|
pointBorderWidth: 1,
|
||
|
|
pointHoverRadius: 5,
|
||
|
|
pointHoverBackgroundColor: gradient1,
|
||
|
|
pointHoverBorderColor: "rgba(220,220,220,1)",
|
||
|
|
pointHoverBorderWidth: 2,
|
||
|
|
pointRadius: 1,
|
||
|
|
pointHitRadius: 10,
|
||
|
|
data: [30, 50, 40, 61, 42, 35, 40],
|
||
|
|
spanGaps: false
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "Data Set Two",
|
||
|
|
fill: true,
|
||
|
|
lineTension: 0.3,
|
||
|
|
backgroundColor: gradient2,
|
||
|
|
borderColor: gradient2,
|
||
|
|
borderCapStyle: 'butt',
|
||
|
|
borderDash: [],
|
||
|
|
borderDashOffset: 0.0,
|
||
|
|
borderJoinStyle: 'miter',
|
||
|
|
borderWidth: 1,
|
||
|
|
pointBorderColor: gradient2,
|
||
|
|
pointBackgroundColor: "#fff",
|
||
|
|
pointBorderWidth: 1,
|
||
|
|
pointHoverRadius: 5,
|
||
|
|
pointHoverBackgroundColor: gradient2,
|
||
|
|
pointHoverBorderColor: "rgba(220,220,220,1)",
|
||
|
|
pointHoverBorderWidth: 2,
|
||
|
|
pointRadius: 1,
|
||
|
|
pointHitRadius: 10,
|
||
|
|
data: [50, 40, 50, 40, 45, 40, 30],
|
||
|
|
spanGaps: false
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Doughnut Chart
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var DOUGHNUTCHARTEXMPLE = $('#doughnutChartExample');
|
||
|
|
var pieChartExample = new Chart(DOUGHNUTCHARTEXMPLE, {
|
||
|
|
type: 'doughnut',
|
||
|
|
options: {
|
||
|
|
cutoutPercentage: 70,
|
||
|
|
},
|
||
|
|
data: {
|
||
|
|
labels: [
|
||
|
|
"A",
|
||
|
|
"B",
|
||
|
|
"C",
|
||
|
|
"D"
|
||
|
|
],
|
||
|
|
datasets: [
|
||
|
|
{
|
||
|
|
data: [250, 50, 100, 40],
|
||
|
|
borderWidth: 0,
|
||
|
|
backgroundColor: [
|
||
|
|
'#3eb579',
|
||
|
|
'#49cd8b',
|
||
|
|
"#54e69d",
|
||
|
|
"#71e9ad"
|
||
|
|
],
|
||
|
|
hoverBackgroundColor: [
|
||
|
|
'#3eb579',
|
||
|
|
'#49cd8b',
|
||
|
|
"#54e69d",
|
||
|
|
"#71e9ad"
|
||
|
|
]
|
||
|
|
}]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
var pieChartExample = {
|
||
|
|
responsive: true
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Line Chart 1
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var LINECHART1 = $('#lineChartExample1');
|
||
|
|
var myLineChart = new Chart(LINECHART1, {
|
||
|
|
type: 'line',
|
||
|
|
options: {
|
||
|
|
scales: {
|
||
|
|
xAxes: [{
|
||
|
|
display: true,
|
||
|
|
gridLines: {
|
||
|
|
display: false
|
||
|
|
}
|
||
|
|
}],
|
||
|
|
yAxes: [{
|
||
|
|
ticks: {
|
||
|
|
max: 40,
|
||
|
|
min: 0,
|
||
|
|
stepSize: 0.5
|
||
|
|
},
|
||
|
|
display: false,
|
||
|
|
gridLines: {
|
||
|
|
display: false
|
||
|
|
}
|
||
|
|
}]
|
||
|
|
},
|
||
|
|
legend: {
|
||
|
|
display: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: {
|
||
|
|
labels: ["A", "B", "C", "D", "E", "F", "G"],
|
||
|
|
datasets: [
|
||
|
|
{
|
||
|
|
label: "Total Overdue",
|
||
|
|
fill: true,
|
||
|
|
lineTension: 0,
|
||
|
|
backgroundColor: "transparent",
|
||
|
|
borderColor: '#6ccef0',
|
||
|
|
pointBorderColor: '#59c2e6',
|
||
|
|
pointHoverBackgroundColor: '#59c2e6',
|
||
|
|
borderCapStyle: 'butt',
|
||
|
|
borderDash: [],
|
||
|
|
borderDashOffset: 0.0,
|
||
|
|
borderJoinStyle: 'miter',
|
||
|
|
borderWidth: 3,
|
||
|
|
pointBackgroundColor: "#59c2e6",
|
||
|
|
pointBorderWidth: 0,
|
||
|
|
pointHoverRadius: 4,
|
||
|
|
pointHoverBorderColor: "#fff",
|
||
|
|
pointHoverBorderWidth: 0,
|
||
|
|
pointRadius: 4,
|
||
|
|
pointHitRadius: 0,
|
||
|
|
data: [20, 28, 30, 22, 24, 10, 7],
|
||
|
|
spanGaps: false
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Line Chart 2
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var LINECHART1 = $('#lineChartExample2');
|
||
|
|
var myLineChart = new Chart(LINECHART1, {
|
||
|
|
type: 'line',
|
||
|
|
options: {
|
||
|
|
scales: {
|
||
|
|
xAxes: [{
|
||
|
|
display: true,
|
||
|
|
gridLines: {
|
||
|
|
display: false,
|
||
|
|
color: '#eee'
|
||
|
|
}
|
||
|
|
}],
|
||
|
|
yAxes: [{
|
||
|
|
ticks: {
|
||
|
|
max: 40,
|
||
|
|
min: 0,
|
||
|
|
stepSize: 0.5
|
||
|
|
},
|
||
|
|
display: false,
|
||
|
|
gridLines: {
|
||
|
|
display: false
|
||
|
|
}
|
||
|
|
}]
|
||
|
|
},
|
||
|
|
legend: {
|
||
|
|
display: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: {
|
||
|
|
labels: ["A", "B", "C", "D", "E", "F", "G"],
|
||
|
|
datasets: [
|
||
|
|
{
|
||
|
|
label: "Total Overdue",
|
||
|
|
fill: true,
|
||
|
|
lineTension: 0,
|
||
|
|
backgroundColor: "transparent",
|
||
|
|
borderColor: '#ff7676',
|
||
|
|
pointBorderColor: '#ff7676',
|
||
|
|
pointHoverBackgroundColor: '#ff7676',
|
||
|
|
borderCapStyle: 'butt',
|
||
|
|
borderDash: [],
|
||
|
|
borderDashOffset: 0.0,
|
||
|
|
borderJoinStyle: 'miter',
|
||
|
|
borderWidth: 3,
|
||
|
|
pointBackgroundColor: "#ff7676",
|
||
|
|
pointBorderWidth: 0,
|
||
|
|
pointHoverRadius: 4,
|
||
|
|
pointHoverBorderColor: "#fff",
|
||
|
|
pointHoverBorderWidth: 0,
|
||
|
|
pointRadius: 4,
|
||
|
|
pointHitRadius: 0,
|
||
|
|
data: [20, 8, 30, 22, 24, 17, 20],
|
||
|
|
spanGaps: false
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Pie Chart
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var PIECHARTEXMPLE = $('#pieChartExample');
|
||
|
|
var pieChartExample = new Chart(PIECHARTEXMPLE, {
|
||
|
|
type: 'pie',
|
||
|
|
data: {
|
||
|
|
labels: [
|
||
|
|
"A",
|
||
|
|
"B",
|
||
|
|
"C",
|
||
|
|
"D"
|
||
|
|
],
|
||
|
|
datasets: [
|
||
|
|
{
|
||
|
|
data: [300, 50, 100, 80],
|
||
|
|
borderWidth: 0,
|
||
|
|
backgroundColor: [
|
||
|
|
'#44b2d7',
|
||
|
|
"#59c2e6",
|
||
|
|
"#71d1f2",
|
||
|
|
"#96e5ff"
|
||
|
|
],
|
||
|
|
hoverBackgroundColor: [
|
||
|
|
'#44b2d7',
|
||
|
|
"#59c2e6",
|
||
|
|
"#71d1f2",
|
||
|
|
"#96e5ff"
|
||
|
|
]
|
||
|
|
}]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
var pieChartExample = {
|
||
|
|
responsive: true
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Bar Chart
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var BARCHARTEXMPLE = $('#barChartExample');
|
||
|
|
var barChartExample = new Chart(BARCHARTEXMPLE, {
|
||
|
|
type: 'bar',
|
||
|
|
options: {
|
||
|
|
scales: {
|
||
|
|
xAxes: [{
|
||
|
|
display: true,
|
||
|
|
gridLines: {
|
||
|
|
color: '#eee'
|
||
|
|
}
|
||
|
|
}],
|
||
|
|
yAxes: [{
|
||
|
|
display: true,
|
||
|
|
gridLines: {
|
||
|
|
color: '#eee'
|
||
|
|
}
|
||
|
|
}]
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: {
|
||
|
|
labels: ["January", "February", "March", "April", "May", "June", "July"],
|
||
|
|
datasets: [
|
||
|
|
{
|
||
|
|
label: "Data Set 1",
|
||
|
|
backgroundColor: [
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1
|
||
|
|
],
|
||
|
|
hoverBackgroundColor: [
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1
|
||
|
|
],
|
||
|
|
borderColor: [
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1,
|
||
|
|
gradient1
|
||
|
|
],
|
||
|
|
borderWidth: 1,
|
||
|
|
data: [65, 59, 80, 81, 56, 55, 40],
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "Data Set 2",
|
||
|
|
backgroundColor: [
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2
|
||
|
|
],
|
||
|
|
hoverBackgroundColor: [
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2
|
||
|
|
],
|
||
|
|
borderColor: [
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2,
|
||
|
|
gradient2
|
||
|
|
],
|
||
|
|
borderWidth: 1,
|
||
|
|
data: [35, 40, 60, 47, 88, 27, 30],
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Bar Chart 1
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var BARCHART1 = $('#barChart1');
|
||
|
|
var barChartHome = new Chart(BARCHART1, {
|
||
|
|
type: 'bar',
|
||
|
|
options:
|
||
|
|
{
|
||
|
|
scales:
|
||
|
|
{
|
||
|
|
xAxes: [{
|
||
|
|
display: false
|
||
|
|
}],
|
||
|
|
yAxes: [{
|
||
|
|
display: false
|
||
|
|
}],
|
||
|
|
},
|
||
|
|
legend: {
|
||
|
|
display: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: {
|
||
|
|
labels: ["A", "B", "C", "D", "E", "F", "G", "H"],
|
||
|
|
datasets: [
|
||
|
|
{
|
||
|
|
label: "Data Set 1",
|
||
|
|
backgroundColor: [
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7'
|
||
|
|
],
|
||
|
|
borderColor: [
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7',
|
||
|
|
'#44b2d7'
|
||
|
|
],
|
||
|
|
borderWidth: 0,
|
||
|
|
data: [35, 55, 65, 85, 30, 22, 18, 35]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "Data Set 1",
|
||
|
|
backgroundColor: [
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6'
|
||
|
|
],
|
||
|
|
borderColor: [
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6',
|
||
|
|
'#59c2e6'
|
||
|
|
],
|
||
|
|
borderWidth: 0,
|
||
|
|
data: [49, 68, 85, 40, 27, 35, 20, 25]
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Bar Chart 2
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var BARCHART2 = $('#barChart2');
|
||
|
|
var barChartHome = new Chart(BARCHART2, {
|
||
|
|
type: 'bar',
|
||
|
|
options:
|
||
|
|
{
|
||
|
|
scales:
|
||
|
|
{
|
||
|
|
xAxes: [{
|
||
|
|
display: false
|
||
|
|
}],
|
||
|
|
yAxes: [{
|
||
|
|
display: false
|
||
|
|
}],
|
||
|
|
},
|
||
|
|
legend: {
|
||
|
|
display: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: {
|
||
|
|
labels: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O"],
|
||
|
|
datasets: [
|
||
|
|
{
|
||
|
|
label: "Data Set 1",
|
||
|
|
backgroundColor: [
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d'
|
||
|
|
],
|
||
|
|
borderColor: [
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d',
|
||
|
|
'#54e69d'
|
||
|
|
],
|
||
|
|
borderWidth: 1,
|
||
|
|
data: [40, 33, 22, 28, 40, 25, 30, 40, 28, 27, 22, 15, 20, 24, 30]
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Polar Chart
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var POLARCHARTEXMPLE = $('#polarChartExample');
|
||
|
|
var polarChartExample = new Chart(POLARCHARTEXMPLE, {
|
||
|
|
type: 'polarArea',
|
||
|
|
options: {
|
||
|
|
elements: {
|
||
|
|
arc: {
|
||
|
|
borderWidth: 0,
|
||
|
|
borderColor: '#aaa'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: {
|
||
|
|
datasets: [{
|
||
|
|
data: [
|
||
|
|
11,
|
||
|
|
16,
|
||
|
|
12,
|
||
|
|
11,
|
||
|
|
7
|
||
|
|
],
|
||
|
|
backgroundColor: [
|
||
|
|
"#e05f5f",
|
||
|
|
"#e96a6a",
|
||
|
|
"#ff7676",
|
||
|
|
"#ff8b8b",
|
||
|
|
"#fc9d9d"
|
||
|
|
],
|
||
|
|
label: 'My dataset' // for legend
|
||
|
|
}],
|
||
|
|
labels: [
|
||
|
|
"A",
|
||
|
|
"B",
|
||
|
|
"C",
|
||
|
|
"D",
|
||
|
|
"E"
|
||
|
|
]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
var polarChartExample = {
|
||
|
|
responsive: true
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
// ------------------------------------------------------- //
|
||
|
|
// Radar Chart
|
||
|
|
// ------------------------------------------------------ //
|
||
|
|
var RADARCHARTEXMPLE = $('#radarChartExample');
|
||
|
|
var radarChartExample = new Chart(RADARCHARTEXMPLE, {
|
||
|
|
type: 'radar',
|
||
|
|
data: {
|
||
|
|
labels: ["A", "B", "C", "D", "E", "C"],
|
||
|
|
datasets: [
|
||
|
|
{
|
||
|
|
label: "First dataset",
|
||
|
|
backgroundColor: "rgba(84, 230, 157, 0.4)",
|
||
|
|
borderWidth: 2,
|
||
|
|
borderColor: "rgba(75, 204, 140, 1)",
|
||
|
|
pointBackgroundColor: "rgba(75, 204, 140, 1)",
|
||
|
|
pointBorderColor: "#fff",
|
||
|
|
pointHoverBackgroundColor: "#fff",
|
||
|
|
pointHoverBorderColor: "rgba(75, 204, 140, 1)",
|
||
|
|
data: [65, 59, 90, 81, 56, 55]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: "Second dataset",
|
||
|
|
backgroundColor: "rgba(255, 119, 119, 0.4)",
|
||
|
|
borderWidth: 2,
|
||
|
|
borderColor: "rgba(255, 119, 119, 1)",
|
||
|
|
pointBackgroundColor: "rgba(255, 119, 119, 1)",
|
||
|
|
pointBorderColor: "#fff",
|
||
|
|
pointHoverBackgroundColor: "#fff",
|
||
|
|
pointHoverBorderColor: "rgba(255, 119, 119, 1)",
|
||
|
|
data: [50, 60, 80, 45, 96, 70]
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
});
|
||
|
|
var radarChartExample = {
|
||
|
|
responsive: true
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
});
|