Gráficas con OpenFlashChart 2 y CakePHP

En varias oportunidades nos hemos encontrado con el requerimiento de incorporar gráficas en nuestras aplicaciones creadas con CakePHP. Una de las formas más sencillas que hemos encontrado, es combinar Open Flash Chart 2.0 y CakePHP. Sin embargo, hemos encontrado que el Helper disponible en el sitio oficial de CakePHP tiene algunos errores (por ej. el gráfico de barras horizontal no está soportado por el helper)

Supongamos que tenemos una lista de gastos por fecha y queremos mostrar un gráfico de línea representando el gasto en función del tiempo:



begin();
$max = 0;
foreach ($gastos as $key => $model){
if ($gastos[$key]['Expense']['monto'] > $max) $max = $gastos[$key]['Expense']['monto'];
$gastos[$key]['Expense']['fecha'] = $time->format('M',$gastos[$key]['Expense']['fecha']);
}
$max+=200;
$step = 100;

$flashChart->setTitle('Gastos totales x rubro','{font-size:14px;}');
$flashChart->setData($gastos,'/Expense/monto','{n}.Expense.fecha','Gastos','dig');
$flashChart->axis('y',array('range' => array(0,$max,$step)));
$flashChart->axis('x');
echo $flashChart->chart('area_line',array('colour'=>'#3399AA'),'Gastos','dig');
echo $flashChart->render(450,250,'dig');
?>

El método setData recibe el DataSet, una expresión xpath para indicar cuáles son los valores a graficar, otra expresión xpath para indicar las etiquetas en el eje de las x para esos valores, un nombre para el gráfico y un id de gráfico (de esta forma pueden superponerse varios gráficos en uno).

Es importante destacar que en el ejemplo del código del helper se muestra que la expresión xpath para determinar las etiquetas debería ser “default.{n}.Day.date“, pero revisando el código nos dimos cuenta que para que funcione no debe incluirse el nodo “default”.

Deja un comentario