121 lines
3.6 KiB
JavaScript
121 lines
3.6 KiB
JavaScript
/**
|
|
* Created by Pensare Software.
|
|
* User: Theo Weijmer
|
|
* Date: 30/01/2018
|
|
* Time: 16:03
|
|
*/
|
|
|
|
dbo.charts = {
|
|
|
|
monthLabels : ['januari', 'februari', 'maart', 'april', 'mei', 'juni', 'juli', 'augustus', 'september', 'oktober', 'november', 'december'],
|
|
|
|
drawHoursVsBudget: function ( hours, budget, element ) {
|
|
var ctx = document.getElementById( element ).getContext( '2d' );
|
|
|
|
var myChart = new Chart( ctx, {
|
|
type : 'bar',
|
|
data : {
|
|
labels : ["uren", "budget"],
|
|
datasets: [{
|
|
data : [hours, budget],
|
|
backgroundColor: [
|
|
'#f3a921', '#f2770c'
|
|
]
|
|
}]
|
|
},
|
|
options: {
|
|
maintainAspectRatio: false,
|
|
scales : {
|
|
yAxes: [{
|
|
ticks: {
|
|
beginAtZero: true
|
|
}
|
|
}]
|
|
},
|
|
legend : {
|
|
display: false,
|
|
},
|
|
title : {
|
|
display : true,
|
|
text : 'Uren vs budget',
|
|
fontSize : 16,
|
|
fontColor: '#b2b2b2'
|
|
}
|
|
}
|
|
} );
|
|
},
|
|
|
|
drawInvoicesVsPayed: function ( offer, invoice, payed, element ) {
|
|
var ctx = document.getElementById( element ).getContext( '2d' );
|
|
|
|
var myChart = new Chart( ctx, {
|
|
type : 'bar',
|
|
data : {
|
|
labels : ["offerte", "facturen", "betaald"],
|
|
datasets: [{
|
|
data : [offer, invoice, payed],
|
|
backgroundColor: [
|
|
'#f3a921', '#f2770c', '#72221a'
|
|
]
|
|
}]
|
|
},
|
|
options: {
|
|
maintainAspectRatio: false,
|
|
scales : {
|
|
yAxes: [{
|
|
ticks: {
|
|
beginAtZero: true
|
|
}
|
|
}]
|
|
},
|
|
legend : {
|
|
display: false,
|
|
},
|
|
title : {
|
|
display : true,
|
|
text : 'offerte vs facuren vs betalingen',
|
|
fontSize : 16,
|
|
fontColor: '#b2b2b2'
|
|
}
|
|
}
|
|
} );
|
|
},
|
|
|
|
drawHoursChart: function (element, chartData, labels, title, colors) {
|
|
console.log( chartData );
|
|
var ctx = document.getElementById( element ).getContext( '2d' );
|
|
|
|
var myChart = new Chart( ctx, {
|
|
type : 'bar',
|
|
data : {
|
|
labels : labels,
|
|
datasets: [{
|
|
data : chartData,
|
|
backgroundColor: colors,
|
|
}]
|
|
},
|
|
options: {
|
|
maintainAspectRatio: false,
|
|
scales : {
|
|
yAxes: [{
|
|
ticks: {
|
|
beginAtZero: true
|
|
}
|
|
}]
|
|
},
|
|
legend : {
|
|
display: false,
|
|
fontColor: '#ffffff',
|
|
},
|
|
title : {
|
|
display : true,
|
|
text : title,
|
|
fontSize : 16,
|
|
fontColor: '#ffffff'
|
|
}
|
|
}
|
|
|
|
} );
|
|
}
|
|
|
|
} |