kenmirrors/firefly-iii
1
0
Fork 0
mirror of https://github.com/firefly-iii/firefly-iii.git synced 2025-11-11 12:18:08 +00:00
Code Issues Projects Releases Wiki Activity

Expand some layouts to accept chartJS charts.

Browse Source
This commit is contained in:
James Cole
2015-06-27 16:00:50 +02:00
parent c581080f3f
commit 2194c4e0a9
13 changed files with 217 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
public/js/charts.js
View File

@@ -1,33 +1,174 @@
/* globals $, Chart, currencySymbol */
/*
Make some colours:
*/
var colourSet = [
[53, 124, 165],
[0, 141, 76],
[219, 139, 11],
[202, 25, 90]
];
var fillColors = [];
var strokePointHighColors = [];
for (var i = 0; i < colourSet.length; i++) {
fillColors.push("rgba(" + colourSet[i][0] + ", " + colourSet[i][1] + ", " + colourSet[i][2] + ", 0.2)");
strokePointHighColors.push("rgba(" + colourSet[i][0] + ", " + colourSet[i][1] + ", " + colourSet[i][2] + ", 0.9)");
}
/*
Set default options:
*/
var defaultAreaOptions = {
scaleShowGridLines: false,
pointDotRadius: 2,
datasetStrokeWidth: 1,
pointHitDetectionRadius: 5,
datasetFill: true,
scaleFontSize: 10,
responsive: true,
scaleLabel: "<%= '" + currencyCode + " ' + Number(value).toFixed(2).replace('.', ',') %>",
tooltipFillColor: "rgba(0,0,0,0.5)",
multiTooltipTemplate: "<%=datasetLabel%>: <%= '" + currencyCode + " ' + Number(value).toFixed(2).replace('.', ',') %>"
};
var defaultLineOptions = defaultAreaOptions;
defaultLineOptions.datasetFill = false;
/**
* Function to draw a line chart:
* @param URL
* @param container
* @param options
*/
function lineChart(URL, container, options) {
"use strict";
console.log('no impl for lineChart');
options = options || defaultLineOptions;
$.getJSON(URL).success(function (data) {
var ctx = document.getElementById(container).getContext("2d");
var newData = {};
newData.datasets = [];
for (var i = 0; i < data.count; i++) {
newData.labels = data.labels;
var dataset = data.datasets[i];
dataset.fillColor = fillColors[i];
dataset.strokeColor = strokePointHighColors[i];
dataset.pointColor = strokePointHighColors[i];
dataset.pointStrokeColor = "#fff";
dataset.pointHighlightFill = "#fff";
dataset.pointHighlightStroke = strokePointHighColors[i];
newData.datasets.push(dataset);
}
var myAreaChart = new Chart(ctx).Line(newData, options);
}).fail(function () {
$('#' + container).addClass('google-chart-error');
});
console.log('URL for line chart : ' + URL);
}
/**
* Function to draw an area chart:
*
* @param URL
* @param container
* @param options
*/
function areaChart(URL, container, options) {
"use strict";
console.log('no impl for areaChart');
options = options || defaultAreaOptions;
$.getJSON(URL).success(function (data) {
var ctx = document.getElementById(container).getContext("2d");
var newData = {};
newData.datasets = [];
for (var i = 0; i < data.count; i++) {
newData.labels = data.labels;
var dataset = data.datasets[i];
dataset.fillColor = fillColors[i];
dataset.strokeColor = strokePointHighColors[i];
dataset.pointColor = strokePointHighColors[i];
dataset.pointStrokeColor = "#fff";
dataset.pointHighlightFill = "#fff";
dataset.pointHighlightStroke = strokePointHighColors[i];
newData.datasets.push(dataset);
}
new Chart(ctx).Line(newData, options);
}).fail(function () {
$('#' + container).addClass('google-chart-error');
});
console.log('URL for area chart: ' + URL);
}
/**
*
* @param URL
* @param container
* @param options
*/
function columnChart(URL, container, options) {
"use strict";
console.log('no impl for columnChart');
$.getJSON(URL).success(function (data) {
var ctx = document.getElementById(container).getContext("2d");
var newData = {};
newData.datasets = [];
for (var i = 0; i < data.count; i++) {
newData.labels = data.labels;
var dataset = data.datasets[i];
dataset.fillColor = fillColors[i];
dataset.strokeColor = strokePointHighColors[i];
dataset.pointColor = strokePointHighColors[i];
dataset.pointStrokeColor = "#fff";
dataset.pointHighlightFill = "#fff";
dataset.pointHighlightStroke = strokePointHighColors[i];
newData.datasets.push(dataset);
}
new Chart(ctx).Column(newData, options);
}).fail(function () {
$('#' + container).addClass('google-chart-error');
});
console.log('URL for column chart : ' + URL);
}
/**
*
* @param URL
* @param container
* @param options
*/
function stackedColumnChart(URL, container, options) {
"use strict";
console.log('no impl for stackedColumnChart');
}
/**
*
* @param URL
* @param container
* @param options
*/
function comboChart(URL, container, options) {
"use strict";
console.log('no impl for comboChart');
}
/**
*
* @param URL
* @param container
* @param options
*/
function pieChart(URL, container, options) {
"use strict";
console.log('no impl for pieChart');