Estoy desarrollando una pequeña herramienta para realizar reportes dinámicos sobre un sistema de seguimiento de tickets. Hasta el momento estoy realizando los reportes a mano, pero quiero automatizarlo.
En estos reportes me gustaría agregar algunos gráficos que mes a mes se alimenten y formar un pequeño bigdata con el historial del trabajo y tiempo invertido en cada proyecto, por cada técnico que trabaja con nosotros, etc.
Para realizar varios gráficos lineales, hice una función java script alimentada desde php. Pasó a los códigos
JAVASCRIPT
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load("current", {"packages":["corechart"]});
google.charts.setOnLoadCallback(drawChartLines);
function drawChartLines(name, data, div) {
var data = google.visualization.arrayToDataTable(data,false);
var options = {
title: name,
curveType: "function",
legend: { position: "bottom" }
};
var chart = new google.visualization.LineChart(document.getElementById(div));
chart.draw(data, options);
}
window.onerror = function(msg, url, linenumber) {
alert("Error message: "+msg+"\nURL: "+url+"\nLine Number: "+linenumber);
return true;
}
</script>
LLAMADA DESDE PHP
<div id="totalanual" style="width: 1000px; height: 300px"><script>
datos = ';
echo chart_anualtotales($id_proyecto, $id_usuario, $fecha_desde);
print ';<br>';
print 'drawChartLines("Resumen anual de tareas", datos, "totalanual");</script></div>
Y les agrego como queda esto final en el html para que se pueda ver el formato en que pasa los datos.
<script>
datos = ["Mes", "Abiertos", "Actualizados", "Cerrados"],["Apr", 0, 0, 0],["May", 0, 0, 0],["Jun", 0, 0, 0],["Jul", 0, 0, 0],["Aug", 0, 0, 0],["Sep", 0, 0, 0],["Oct", 0, 0, 0],["Nov", 0, 0, 0],["Dec", 3, 0, 3],["Jan", 2, 0, 0],["Feb", 34, 0, 10],["Mar", 80, 1, 63],["Apr", 166, 19, 144],["May", 204, 1, 194];
drawChartLines("Resumen anual de tareas", datos, "totalanual");</script>