| Current Path : /var/www/v3.cesa.co.za/assets/ |
| Current File : /var/www/v3.cesa.co.za/assets/report.js |
import './styles/report.scss';
require('chart.js/auto');
import Chart from 'chart.js/auto';
(function ($, window)
{
window.drawPieChart = function (chartCanvasId, dataSet, labels, links, labelName) {
new Chart(
document.getElementById(chartCanvasId),
{
type: 'pie',
data: {
labels: labels,
datasets: [
{
label: labelName,
data: dataSet
}
]
},
options: {
plugins: {
datalabels: {
display: true,
color: '#000000',
anchor: 'middle',
clamp: 'true',
font: {
size: '10'
},
padding: {
top: 1,
bottom: 1
},
formatter: function (value, context) {
//return context.chart.data.labels[context.dataIndex];
return value > 2 ? value : "";
}
}
}
}
}
);
};
}(jQuery, window));
(function ($, window)
{
window.drawStackedbarChart = function (chartCanvasId, dataSet, labels, links, labelName) {
var chartObject = new Chart(
document.getElementById(chartCanvasId),
{
type: 'bar',
data: {
labels: labels,
// links: links,
datasets: dataSet
},
options: {
plugins: {
datalabels: {
display: true,
color: '#000000',
anchor: 'middle',
clamp: 'true',
font: {
size: '10'
},
padding: {
top: 1,
bottom: 1
},
formatter: function (value, context) {
//return context.chart.data.labels[context.dataIndex];
return value > 2 ? value : "";
}
},
title: {
display: true,
text: labelName
}
},
scales: {
x: {
stacked: true
},
y: {
stacked: true
}
}
// ,
// onClick: function (evt, activePoints) {
// // console.log(activePoints[0]);
// var clickedElementindex = activePoints[0].index;
// var datasetindex = activePoints[0].datasetIndex;
//
// // console.log(data[datasetindex]);
//
// var monthIndex = data[datasetindex].clientId + '_' + data[datasetindex].natureId + '_' + clickedElementindex;
// // console.log(monthIndex);
// var linkUrl = links[monthIndex];
//
// // console.log(linkUrl);
// window.location = linkUrl;
// }
}
}
);
};
}(jQuery, window));
(function ($, window)
{
window.drawGroupedbarChart = function (chartCanvasId, dataSet, labels, links, labelName) {
var chartObject = new Chart(
document.getElementById(chartCanvasId),
{
type: 'bar',
data: {
labels: labels,
// links: links,
datasets: dataSet
},
options: {
plugins: {
datalabels: {
display: true,
color: '#000000',
anchor: 'middle',
clamp: 'true',
font: {
size: '10'
},
padding: {
top: 1,
bottom: 1
},
formatter: function (value, context) {
//return context.chart.data.labels[context.dataIndex];
return value > 2 ? value : "";
}
},
title: {
display: true,
text: labelName
}
},
scales: {
x: {
stacked: true
},
y: {
stacked: true
}
}
// ,
// onClick: function (evt, activePoints) {
// // console.log(activePoints[0]);
// var clickedElementindex = activePoints[0].index;
// var datasetindex = activePoints[0].datasetIndex;
//
// // console.log(data[datasetindex]);
//
// var monthIndex = data[datasetindex].clientId + '_' + data[datasetindex].natureId + '_' + clickedElementindex;
// // console.log(monthIndex);
// var linkUrl = links[monthIndex];
//
// // console.log(linkUrl);
// window.location = linkUrl;
// }
}
}
);
};
}(jQuery, window));