Removed Material Design.

This commit is contained in:
James Cole 2015-03-16 18:02:52 +01:00
parent ccc44a74a0
commit 7374f0f9dd
2 changed files with 75 additions and 20 deletions

View File

@ -1,5 +1,5 @@
var google = google || {}; var google = google || {};
google.load('visualization', '1.1', {'packages': ['corechart', 'bar','line', 'sankey', 'table']}); google.load('visualization', '1.1', {'packages': ['corechart', 'bar', 'line', 'sankey', 'table']});
function googleChart(chartType, URL, container, options) { function googleChart(chartType, URL, container, options) {
if ($('#' + container).length === 1) { if ($('#' + container).length === 1) {
@ -13,10 +13,10 @@ function googleChart(chartType, URL, container, options) {
Format as money Format as money
*/ */
var money = new google.visualization.NumberFormat({ var money = new google.visualization.NumberFormat({
decimalSymbol: ',', decimalSymbol: ',',
groupingSymbol: '.', groupingSymbol: '.',
prefix: currencyCode + ' ' prefix: currencyCode + ' '
}); });
for (var i = 1; i < gdata.getNumberOfColumns(); i++) { for (var i = 1; i < gdata.getNumberOfColumns(); i++) {
money.format(gdata, i); money.format(gdata, i);
} }
@ -26,25 +26,21 @@ function googleChart(chartType, URL, container, options) {
*/ */
var chart = false; var chart = false;
var options = false; var options = false;
var isMaterialDesign = false;
if (chartType === 'line') { if (chartType === 'line') {
chart = new google.charts.Line(document.getElementById(container)); chart = new google.visualization.LineChart(document.getElementById(container));
options = options || defaultLineChartOptions; options = options || defaultLineChartOptions;
isMaterialDesign = true;
} }
if (chartType === 'column') { if (chartType === 'column') {
chart = new google.charts.Bar(document.getElementById(container)); chart = new google.visualization.ColumnChart(document.getElementById(container));
options = options || defaultColumnChartOptions; options = options || defaultColumnChartOptions;
isMaterialDesign = true;
} }
if (chartType === 'pie') { if (chartType === 'pie') {
chart = new google.visualization.PieChart(document.getElementById(container)); chart = new google.visualization.PieChart(document.getElementById(container));
options = options || defaultPieChartOptions; options = options || defaultPieChartOptions;
} }
if (chartType === 'bar') { if (chartType === 'bar') {
chart = new google.charts.Bar(document.getElementById(container)); chart = new google.visualization.BarChart(document.getElementById(container));
options = options || defaultBarChartOptions; options = options || defaultBarChartOptions;
isMaterialDesign = true;
} }
if (chartType === 'stackedColumn') { if (chartType === 'stackedColumn') {
chart = new google.visualization.ColumnChart(document.getElementById(container)); chart = new google.visualization.ColumnChart(document.getElementById(container));
@ -58,12 +54,7 @@ function googleChart(chartType, URL, container, options) {
if (chart === false) { if (chart === false) {
alert('Cannot draw chart of type "' + chartType + '".'); alert('Cannot draw chart of type "' + chartType + '".');
} else { } else {
if(isMaterialDesign && chartType == 'line') { chart.draw(gdata, options);
chart.draw(gdata, google.charts.Line.convertOptions(options));
} else {
chart.draw(gdata, options);
}
} }
}).fail(function () { }).fail(function () {

View File

@ -12,13 +12,56 @@ var defaultLineChartOptions = {
height: '80%' height: '80%'
}, },
height: 400, height: 400,
colors: ["#4285f4", "#db4437", "#f4b400", "#0f9d58", "#ab47bc", "#00acc1", "#ff7043", "#9e9d24", "#5c6bc0", "#f06292", "#00796b", "#c2185b"],
hAxis: {
textStyle: {
color: '#838383',
fontName: 'Roboto2',
fontSize: '12'
},
baselineColor: '#aaaaaa',
gridlines: {
color: 'transparent'
}
},
vAxis: {
textStyle: {
color: '#838383',
fontName: 'Roboto2',
fontSize: '12'
},
baselineColor: '#aaaaaa',
format: '\u20AC #'
}
}; };
var defaultBarChartOptions = { var defaultBarChartOptions = {
height: 400, height: 400,
bars: 'horizontal', bars: 'horizontal',
hAxis: {format: '\u20AC #'}, hAxis: {
textStyle: {
color: '#838383',
fontName: 'Roboto2',
fontSize: '12'
},
baselineColor: '#aaaaaa',
format: '\u20AC #'
},
colors: ["#4285f4", "#db4437", "#f4b400", "#0f9d58", "#ab47bc", "#00acc1", "#ff7043", "#9e9d24", "#5c6bc0", "#f06292", "#00796b", "#c2185b"],
vAxis: {
textStyle: {
color: '#838383',
fontName: 'Roboto2',
fontSize: '12'
},
gridlines: {
color: 'transparent'
},
baselineColor: '#aaaaaa'
},
chartArea: { chartArea: {
left: 75, left: 75,
top: 10, top: 10,
@ -62,7 +105,28 @@ var defaultColumnChartOptions = {
width: '85%', width: '85%',
height: '80%' height: '80%'
}, },
vAxis: {format: '\u20AC #'}, hAxis: {
textStyle: {
color: '#838383',
fontName: 'Roboto2',
fontSize: '12'
},
gridlines: {
color: 'transparent'
},
baselineColor: '#aaaaaa'
},
colors: ["#4285f4", "#db4437", "#f4b400", "#0f9d58", "#ab47bc", "#00acc1", "#ff7043", "#9e9d24", "#5c6bc0", "#f06292", "#00796b", "#c2185b"],
vAxis: {
textStyle: {
color: '#838383',
fontName: 'Roboto2',
fontSize: '12'
},
baselineColor: '#aaaaaa',
format: '\u20AC #'
},
legend: { legend: {
position: 'none' position: 'none'
}, },