Gráficos dinámicos en sharepoint

Amigos del mundo sharepoint: supongo que como yo, habrán notado que no es tan sencillo extraer información de las listas de sharepoint y mostrarla en forma gráfica en un tablero de control. He estado investigando el tema y me he encontrado con demasiadas opciones. Hasta el momento he seleccionada una, que a continuación les presentaré. Espero que alguno de ustedes critique la opción elegida y presente alguna mejor, porque estoy en búsqueda de la luz.

La alternativa que elegí es FusionCharts Free debido a que:

• 
  
  Funciona en WSS 3. No requiere MOSS, como Excel Services.
• 
  
  No ha sido discontinuada por el fabricante, como los OWC.
• 
  
  No existe complicación para extraer datos de las listas, siempre que estemos dispuestos a escribir un spquery en CAML.
• 
  
  No requiere instalación de componentes en el cliente, asumiendo que Flash es algo típicamente instalado.
• 
  
  Es bonita. Los tableros son para los directivos y a los directivos les gusta ver gráficos bonitos.
• 
  
  Es open source (existe una versión no abierta con mayor funcionalidad)
• 
  
  Es liviana.

¿Cómo funciona?

Luego de leer el Help de la herramienta, seleccioné una de las tantas maneras que tiene de obtener datos de una fuente para generar un gráfico. La siguiente imagen esquematiza la interacción entre los distintos componentes (en la opción elegida).

Los pasos para implementar la solución son:

1. Crear una Application Page para extraer datos de las listas de Sharepoint a través de un SPQuery.
2. Generar como resultado de la Application Page un XML con el esquema que requieren los componentes de FusionCharts para armar el gráfico.
3. Conectar el XML con los SWF (flash) y hacer el "render" del gráfico vía JavaScript

El resultado se puede ver parcialmente en la siguiente imagen (parcialmente porque no se ve la parte animada)

1. SP Query
Esta es una de las opciones para consultar datos de una lista en sharepoint. A continuación muestro parte del código para una lista en particular llamada "Proyectos".

SPWeb yq_web = SPContext.Current.Web;

SPList list = yq_web.Lists["Proyectos"];

SPQuery query = new SPQuery();

query.ViewFields = "<FieldRef Name='Title' /><FieldRef Name='Referencia' /><FieldRef Name='Cliente' /><FieldRef Name='Jefe_x0020_de_x0020_Proyecto' /><FieldRef Name='Estado' /><FieldRef Name='ID' /><FieldRef Name='Fecha_x0020_de_x0020_inicio' /><FieldRef Name='Fecha_x0020_prevista_x0020_final' />";

query.Query = "<Where><Eq><FieldRef Name='Estado' /><Value Type='Choice'>Activo</Value></Eq></Where>";

query.Query += "<OrderBy><FieldRef Name='Title' /><FieldRef Name='ID' /></OrderBy>";

SPListItemCollection items = list.GetItems(query);

2. XML
La siguiente porción de código muestra como recorrer la lista y generar el XML que necesitan los componentes de FusionCharts para armar un gráfico de barras apiladas en 3D.

string strXML;

strXML = "<graph xaxisname='Costos' yaxisname='Importe' hovercapbg='DEDEBE' hovercapborder='889E6D' rotateNames='0' animation='1' decimalPrecision='0' showNames='1' numberSuffix='$' >";
strXML += "<categories>";
strXML += "<category name='Contrataciones'/>";strXML += "<category name='Otros gastos'/>";strXML += "</categories>";(…)

foreach (SPListItem imp_item in imp_items){strXML += "<dataset seriesname=(…)

strXML += "</graph>";

Response.ContentType = "text/xml";

Response.Write(strXML);

3. JavaScript

Finalmente, tomamos los datos del XML y lo graficamos dentro de un DIV mediante JavaScript.


document.write("<div id='chartdiv' align='left'>The chart will appear within this DIV. This text will be replaced by the chart.</div>");

var myChart = new

FusionCharts("./FusionCharts/FCF_MSColumn3D.swf?XMLLoadingText=Cargando datos. Espere por favor...&ChartNoDataText=No existen datos para mostrar.", "myChartId", "800", "300");

myChart.setDataURL("/_layouts/ProyectoControlChart.aspx);

myChart.render("chartdiv");

Fin
Aquí termina, He simplificado el código con fines didácticos. El Help posee una muy buena referencia del XML a generar (muy sencillo) y varias opciones para llegar al objetivo. Aquí mostré la opción CAML-ASPX-XML-JAVASCRIPT, pero hay otras.
Espero que este haya sido un artículo útil. Si alguien conoce otras opciones para cumplir con este tipo de requerimientos (como FLEX), envíe comentarios por favor. Serán bienvenidos.


Hasta el próximo artículo.