Your IP : 13.59.110.86
/**
* Wrapper for google charts
* @param {object} window global object
* @param {function} $ jQuery library
* @param {object} EventMgr EventMgr library
* @param {object} App Application
* @param {object} pageInfo
*/
/*global App: true*/
App.GoogleCharts = function(window, $, EventMgr, App, pageInfo) {
'use strict';
var init = function() {
EventMgr.bind('appendReport', loadGCharts);
EventMgr.bind('appendListWithDiagram', loadGChartFromList);
EventMgr.bind('loadGCharts', loadGCharts);
EventMgr.bind('loadGChart', loadGChart);
EventMgr.bind('loadGChartPrepare', loadGChartPrepare);
EventMgr.one('loadGChartScripts', loadGChartScript);
},
loadedGChartScripts = false,
//load google charts
loadGCharts = function(e, data) {
var bands = data.bands.bands,
tabId = data.tabId,
len = bands.length,
id, gid, i, j, lenD;
for (i = 0; i < len; i++) {
id = tabId + '-' + i;
gid = id + bands[i].id;
if (bands[i].diagram !== undefined) {
lenD = bands[i].diagram.length;
for (j = 0; j < lenD; j++) {
if (loadedGChartScripts) {
EventMgr.trigger('loadGChart', {
diagram: bands[i].diagram[j],
gid: gid + j,
empty: bands[i].empty,
tabId: tabId,
content: bands[i].content });
} else {
EventMgr.trigger('loadGChartPrepare', {
diagram: bands[i].diagram[j],
gid: gid + j,
empty: bands[i].empty,
tabId: tabId,
content: bands[i].content });
}
}
}
}
if (data.bands.emptyBand) {
var emptyBandData = data.bands.emptyBandData;
if (loadedGChartScripts) {
EventMgr.trigger('loadGChart', {
diagram: emptyBandData.diagram,
gid: tabId + '-band-empty',
tabId: tabId,
content: emptyBandData.content });
} else {
EventMgr.trigger('loadGChartPrepare', {
diagram: emptyBandData.diagram,
gid: tabId + '-band-empty',
tabId: tabId,
content: emptyBandData.content });
}
}
},
//
loadGChartFromList = function(e, data) {
var diagram = data.diagram,
gid = data.gid,
tabId = data.tabId,
content = data.content;
if (loadedGChartScripts) {
EventMgr.trigger('loadGChart', {
diagram: diagram,
gid: gid,
tabId: tabId,
content: content });
} else {
EventMgr.trigger('loadGChartPrepare', {
diagram: diagram,
gid: gid,
tabId: tabId,
content: content });
}
},
//load google chart
loadGChart = function(e, data) {
var diagram = data.diagram,
content = data.content,
gid = data.gid,
wrapper = App.Dom.byId(gid),
tabId = data.tabId,
chart, cdata, options,
empty = data.empty,
chartsData, rawData = false,
colors = ['#5c85d6', '#e36141', '#ffbc58', '#53b858', '#ba70ba', '#3fafd1', '#e37fa0', '#8dc43b', '#cc6665', '#aaa'];
if (diagram.colors && diagram.colors.length > 1) {
colors = diagram.colors;
colors.shift();
}
//check for data form dashbord or report
//dashboard data without line
if (diagram.chartsData && !diagram.chartsData.fakeArr) {
chartsData = diagram.chartsData.data;
rawData = true;
//dashboard data with line
} else if (diagram.chartsData && diagram.chartsData.fakeArr) {
chartsData = diagram.chartsData;
rawData = true;
//report
} else {
chartsData = makeData(diagram, content);
}
if (wrapper === null) { return; }
var len = chartsData.data ? chartsData.data.length : chartsData.length,
len2 = 0,
fakeArr = [],
pointSize = 0,
showTextEvery = 'automatic',
width = wrapper.offsetWidth;
//check for point size
if (len < 32) { pointSize = 3;}
//check for show labels
if (width > 700) {
showTextEvery = Math.round(len / 10);
} else {
showTextEvery = Math.round(len / 5);
}
//check when rawData
if (len === 1) {
if (chartsData.data) {
len2 = chartsData.data[0];
} else {
console.log('empty chart data');
return;
}
while (len2--) {
fakeArr.push(0);
}
// chartsData.push(fakeArr);
}
if (rawData) {
chartsData = prepareRawData(chartsData, len);
}
if (diagram && diagram.type === 'pie') {
if (rawData) {
cdata = window.google.visualization.arrayToDataTable(chartsData);
} else {
cdata = new window.google.visualization.DataTable();
for (var i = 0, l = chartsData.fakeArr.length; i < l; i++) {
if (chartsData.fakeArr[i] === null) {
cdata.addColumn({ type: 'string', role: 'tooltip'});
} else {
cdata.addColumn(i === 0 ? 'string' : 'number', chartsData.fakeArr[i]);
}
}
cdata.addRows(chartsData.data);
}
options = {
// backgroundColor : 'rgb(242, 249, 255)',
'backgroundColor.stroke': '#fff',
'vAxis': {
'minValue': 0,
'textStyle': { 'fontSize': '11'}
},
'colors': colors,
'is3D': true,
'legend': {
'alignment': 'center',
'textStyle': { 'fontSize': '11'}
},
'sliceVisibilityThreshold': diagram.others
};
if (diagram.title) {
options.title = diagram.title;
options.chartArea = { 'height': '80%' };
} else {
options.chartArea = { 'height': '94%' };
}
chart = new window.google.visualization.PieChart(App.Dom.byId(gid));
} else if (diagram && diagram.type === 'histogram') {
if (!chartsData.fakeArr) {
cdata = window.google.visualization.arrayToDataTable(chartsData);
} else {
cdata = new window.google.visualization.DataTable();
/* jshint shadow: true */
for (var i = 0, l = chartsData.fakeArr.length; i < l; i++) {
if (chartsData.fakeArr[i] === null) {
cdata.addColumn({ type: 'string', role: 'tooltip'});
} else {
cdata.addColumn(i === 0 ? 'string' : 'number', chartsData.fakeArr[i]);
}
}
cdata.addRows(chartsData.data);
}
options = {
//backgroundColor : 'rgb(242, 249, 255)',
'backgroundColor.stroke': '#fff',
colors: colors,
vAxis: {
//'minValue': 0,
textStyle: { fontSize: '11'},
viewWindow: {}
},
hAxis: {
textStyle: { fontSize: '11'}
},
legend: {
alignment: 'start',
position: 'right',
textStyle: { fontSize: '11'}
}
};
if (diagram.title) {
options.title = diagram.title;
}
//set min/max viewport for chart
if (diagram.min) {
options.vAxis.viewWindow.min = diagram.min;
}
if (diagram.max) {
options.vAxis.viewWindow.max = diagram.max;
}
chart = new window.google.visualization.ColumnChart(App.Dom.byId(gid));
} else if (diagram && (diagram.type === 'line' || diagram.type === 'area' || diagram.type === 'steppedarea')) {
if (!chartsData.fakeArr) {
cdata = window.google.visualization.arrayToDataTable(chartsData);
} else {
cdata = new window.google.visualization.DataTable();
for (var i = 0, l = chartsData.fakeArr.length; i < l; i++) {
/* jshint shadow: true */
if (chartsData.fakeArr[i] === null) {
cdata.addColumn({ type: 'string', role: 'tooltip'});
} else {
cdata.addColumn(i === 0 ? 'string' : 'number', chartsData.fakeArr[i]);
}
}
cdata.addRows(chartsData.data);
}
options = {
//backgroundColor : 'rgb(242, 249, 255)',
// 'chartArea' : { 'left' : 50 },
'backgroundColor.stroke': '#fff',
colors: colors,
vAxis: {
//'minValue' : 0,
textStyle: { fontSize: '11'},
viewWindow: {}
},
hAxis: {
showTextEvery: showTextEvery,
textStyle: { fontSize: '11'}
},
pointSize: pointSize,
focusTarget: 'category',
legend: {
alignment: 'start',
textStyle: { fontSize: '11'}
}
};
if (diagram.title) {
title = diagram.title
}
//set min/max viewport for chart
if (diagram.min) {
options.vAxis.viewWindow.min = diagram.min;
}
if (diagram.max) {
options.vAxis.viewWindow.max = diagram.max;
}
if (diagram.type === 'line') {
chart = new window.google.visualization.LineChart(App.Dom.byId(gid));
} else if (diagram.type === 'area') {
chart = new window.google.visualization.AreaChart(App.Dom.byId(gid));
} else if (diagram.type === 'steppedarea') {
options.areaOpacity = 1;
options.isStacked = true;
chart = new window.google.visualization.SteppedAreaChart(App.Dom.byId(gid));
} else if (diagram.type === 'column') {
options.isStacked = true;
chart = new window.google.visualization.ColumnChart(App.Dom.byId(gid));
}
} else if (diagram && diagram.type === 'scatter') {
if (!chartsData.fakeArr) {
cdata = window.google.visualization.arrayToDataTable(chartsData);
} else {
//chartsData.data.unshift(chartsData.fakeArr);
//var tmpArr = chartsData.data;
//cdata = google.visualization.arrayToDataTable(tmpArr);
cdata = new window.google.visualization.DataTable();
/* jshint shadow: true */
for (var i = 0, l = chartsData.fakeArr.length; i < l; i++) {
if (chartsData.fakeArr[i] === null) {
cdata.addColumn({ type: 'string', role: 'tooltip'});
} else {
cdata.addColumn('number', chartsData.fakeArr[i]);
}
}
if (diagram.markerline !== undefined) {
for (var i = 0, l = chartsData.data.length; i < l; i++) {
chartsData.data[i].push(diagram.markerline - 0);
}
cdata.addColumn('number', diagram.markerlineLabel);
}
cdata.addRows(chartsData.data);
}
options = {
'backgroundColor.stroke': '#fff',
colors: colors,
vAxis: {
//'minValue' : 0,
textStyle: { fontSize: '11'},
viewWindow: {}
},
hAxis: {
showTextEvery: showTextEvery,
textStyle: { fontSize: '11'}
},
legend: false,
seriesType: 'scatter'
};
if (diagram.markerline !== undefined) {
options.series = {};
options.series[1] = {'type': 'line'}
}
//set min/max viewport for chart
if (diagram.min) {
options.vAxis.viewWindow.min = diagram.min;
}
if (diagram.max) {
options.vAxis.viewWindow.max = diagram.max;
}
//chart = new google.visualization.ScatterChart(App.Dom.byId(gid));
chart = new window.google.visualization.ComboChart(App.Dom.byId(gid));
} else if (diagram) {
EventMgr.trigger('pullMsg', { msg: 'Diagram type "' + diagram.type + '" do not support' });
return;
}
if (empty) {
options.colors = colors;
}
chart.draw(cdata, options);
EventMgr.trigger('addedChart', { chart: chart, tabId: tabId });
var func = function() {
EventMgr.trigger('updateScroll', { id: 'form-scroll-' + tabId });
EventMgr.trigger('updTableHeight');
};
App.Common.noMoreThan('form-scroll-' + tabId, 100, func);
},
prepareRawData = function(chartsData, len) {
var len2,
data = chartsData.data ? chartsData.data : chartsData;
while (len--) {
//check for separate data
//skip first elem with labels
if (len === 0 && !chartsData.fakeArr) {
continue;
}
len2 = data[len].length;
while (len2--) {
if (len2 !== 0) {
//check for separate data
//skip elem with hint
if (chartsData.fakeArr && !chartsData.fakeArr[len2]) {
continue;
}
data[len][len2] = parseData(data[len][len2]);
}
}
}
if (chartsData.data) {
chartsData.data = data;
} else {
chartsData = data;
}
return chartsData;
},
parseData = function(value) {
return value === '' ? null : parseFloat(String(value).replace(/\s/g, ''));
},
makeData = function(diagram, content) {
var type = diagram.type,
data,
elem,
fakeArr,
label = diagram.label,
dataCol = diagram.data,
labels = diagram.labelText,
lines = diagram.lines,
tooltip = diagram.tooltip,
woLabel = diagram.type === 'scatter',
len, labelsLen, i, j, labelsLenSrc;
//if (type == 'histogram' || type == 'pie') {
//withot lines
if (!lines) {
//check for one lines in histogram
dataCol = dataCol[0] ? dataCol[0] : dataCol;
//first fake row
fakeArr = ['fake', labels[0]];
if (dataCol.convert || tooltip) {
fakeArr.push(null);
}
// data = [elem];
data = [];
len = content.length;
i = 0;
while (len--) {
if (tooltip) {
elem = [
content[i][label].v,
parseFloat(content[i][dataCol.name].v.replace(/\s/g, ''))
];
elem.push(content[i][tooltip].v + ': ' + elem[0] + ', ' + elem[1]);
} else if (dataCol.convert) {
elem = [
content[i][label].v,
parseFloat(content[i][dataCol.name].orig || content[i][dataCol.name].v),
content[i][dataCol.name].v
];
} else {
elem = [
content[i][label].v,
parseFloat(content[i][dataCol.name].v.replace(/\s/g, ''))
];
}
//
if (woLabel) {
elem[0] = elem[0] - 0;
}
data.push(elem);
i++;
}
} else {
//first fake row
fakeArr = ['fake'];
labelsLen = dataCol.length;
labelsLenSrc = labelsLen;
i = 0;
while (labelsLen--) {
fakeArr.push(labels[i]);
if (dataCol[i].convert) {
fakeArr.push(null);
}
i++;
}
// data = [elem];
data = [];
len = content.length;
j = 0;
while (len--) {
elem = [content[j][label].v];
labelsLen = labelsLenSrc;
i = 0;
while (labelsLen--) {
if (dataCol[i].convert) {
elem.push(parseFloat(content[j][dataCol[i].name].orig || content[j][dataCol[i].name].v.replace(/\s/g, '')));
elem.push(content[j][dataCol[i].name].v === '' ?
null : content[j][dataCol[i].name].v);
} else {
elem.push(content[j][dataCol[i].name].v === '' ?
null : parseFloat(content[j][dataCol[i].name].v.replace(/\s/g, '')));
}
i++;
}
data.push(elem);
j++;
}
}
return {
data: data,
fakeArr: fakeArr
};
},
queueCharts = [],
loadGChartPrepare = function(e, data) {
queueCharts.push(data);
EventMgr.trigger('loadGChartScripts', {});
},
//loading gchart form queue
runQueue = function() {
var len = queueCharts.length;
while (len--) {
EventMgr.trigger('loadGChart', queueCharts[len]);
}
queueCharts = [];
},
checkScripts = function() {
if (window.google.visualization === undefined) {
setTimeout(function() {
checkScripts();
}, 100);
} else {
if (window.google.visualization.arrayToDataTable === undefined) {
setTimeout(function() {
checkScripts();
}, 100);
} else {
loadedGChartScripts = true;
runQueue();
}
}
},
//load google charts scripts
loadGChartScript = function() {
setTimeout(function() {
window.google.load('visualization', '1', {
'callback': 'console.log("2 sec wait")',
'packages': ['corechart'],
'language': pageInfo.lang });
}, 100);
setTimeout(function() {
checkScripts();
}, 100);
};
return {
init: init
};
}(window, $, EventMgr, App, pageInfo);