Charts "columnChart" and "stackedColumnChart" now support beforeDraw() which will check the data to see if the chart should be drawn. This cleans up the front page for new users and empty months.

This commit is contained in:
James Cole 2016-01-29 13:35:08 +01:00
parent 3d82afd4e6
commit 9ccb67db8a
2 changed files with 55 additions and 12 deletions

View File

@ -27,16 +27,16 @@ var colourSet = [
// Settings object that controls default parameters for library methods:
accounting.settings = {
currency: {
symbol : currencySymbol, // default currency symbol is '$'
symbol: currencySymbol, // default currency symbol is '$'
format: "%s %v", // controls output: %s = symbol, %v = value/number (can be object: see below)
decimal : mon_decimal_point, // decimal point separator
decimal: mon_decimal_point, // decimal point separator
thousand: mon_thousands_sep, // thousands separator
precision : frac_digits // decimal places
precision: frac_digits // decimal places
},
number: {
precision : 0, // default precision on numbers is 0
precision: 0, // default precision on numbers is 0
thousand: ",",
decimal : "."
decimal: "."
}
};
@ -92,7 +92,7 @@ var defaultLineOptions = {
datasetFill: false,
scaleFontSize: 10,
responsive: false,
scaleLabel: "<%= '" + currencySymbol + " ' + Number(value).toFixed(0).replace('.', ',') %>",
scaleLabel: "<%= '" + currencySymbol + " ' + Number(value).toFixed(0).replace('.', ',') %>",
tooltipFillColor: "rgba(0,0,0,0.5)",
tooltipTemplate: "<%if (label){%><%=label%>: <%}%>" + currencySymbol + " <%= value %>",
multiTooltipTemplate: "<%=datasetLabel%>: <%= '" + currencySymbol + " ' + Number(value).toFixed(2).replace('.', ',') %>"
@ -107,9 +107,9 @@ var defaultColumnOptions = {
scaleFontSize: 10,
responsive: false,
animation: false,
scaleLabel: "<%= accounting.formatMoney(value) %>",
scaleLabel: "<%= accounting.formatMoney(value) %>",
tooltipFillColor: "rgba(0,0,0,0.5)",
tooltipTemplate: "<%if (label){%><%=label%>: <%}%> <%= accounting.formatMoney(value) %>",
tooltipTemplate: "<%if (label){%><%=label%>: <%}%> <%= accounting.formatMoney(value) %>",
multiTooltipTemplate: "<%=datasetLabel%>: <%= accounting.formatMoney(value) %>"
};
@ -122,7 +122,7 @@ var defaultStackedColumnOptions = {
animation: false,
scaleFontSize: 10,
responsive: false,
scaleLabel: "<%= accounting.formatMoney(value) %>",
scaleLabel: "<%= accounting.formatMoney(value) %>",
tooltipFillColor: "rgba(0,0,0,0.5)",
multiTooltipTemplate: "<%=datasetLabel%>: <%= accounting.formatMoney(value) %>"
@ -204,8 +204,19 @@ function areaChart(URL, container, options) {
function columnChart(URL, container, options) {
"use strict";
options = options || {};
$.getJSON(URL).success(function (data) {
var result = true;
if (options.beforeDraw) {
result = options.beforeDraw(data, {url: URL, container: container});
}
if (result === false) {
return;
}
console.log('Will draw columnChart(' + URL + ')');
var ctx = document.getElementById(container).getContext("2d");
var newData = {};
newData.datasets = [];
@ -240,6 +251,15 @@ function stackedColumnChart(URL, container, options) {
$.getJSON(URL).success(function (data) {
var result = true;
if (options.beforeDraw) {
result = options.beforeDraw(data, {url: URL, container: container});
}
if (result === false) {
return;
}
var ctx = document.getElementById(container).getContext("2d");
var newData = {};
newData.datasets = [];

View File

@ -34,14 +34,37 @@ function drawChart() {
"use strict";
areaChart('chart/account/frontpage', 'accounts-chart');
pieChart('chart/bill/frontpage', 'bills-chart');
stackedColumnChart('chart/budget/frontpage', 'budgets-chart');
columnChart('chart/category/frontpage', 'categories-chart');
columnChart('chart/account/expense', 'expense-accounts-chart');
stackedColumnChart('chart/budget/frontpage', 'budgets-chart', {beforeDraw: beforeDrawIsEmpty});
columnChart('chart/category/frontpage', 'categories-chart', {beforeDraw: beforeDrawIsEmpty});
columnChart('chart/account/expense', 'expense-accounts-chart', {beforeDraw: beforeDrawIsEmpty});
getBoxAmounts();
}
/**
* Removes a chart container if there is nothing for the chart to draw.
*
* @param data
* @param options
* @returns {boolean}
*/
function beforeDrawIsEmpty(data, options) {
"use strict";
// check if chart holds data.
if (data.labels.length === 0) {
// remove the chart container + parent
console.log(options.container + ' appears empty. Removed.');
$('#' + options.container).parent().parent().remove();
// return false so script stops.
return false;
}
return true;
}
function getBoxAmounts() {
"use strict";
var boxes = ['in', 'out', 'bills-unpaid', 'bills-paid'];