SPSRollUpChart WebPart

With the SPSProfessional SPSRollUpChart WebPart the SHOW begins.

Continuing with the SPSRollUp philosophy, with the SPSRollUp Chart you will be able to transform the data given back by rollup into graphs.

Basically the SPSRollUpChart has a similar operation to the SPSRollUp, and this means that it tracks sites and lists collecting information.

Later instead of transforming the results into HTML, what we will do is to process the result to turn it into XML and to draw a graph.

Installation

See: Install SPSProfessional Solutions

Installation Requirements

• The SPSProfessional RollUp WebPart performs in WSS 3 and or MOSS 2007
• SharePoint Administrator’s Account is needed to install the solution

WebPart Properties

The main properties are the same ones that SPSRollUp has.

The SPSRollUPChart adds these properties:

Width: the graph width

Height: The Graph height

Chart Type: The graph could be type:

• Line
• Bar2D
• Area2D
• Column2D
• Column3D
• Pie2D
• Pie3D
• MSColumn3D
• MSColumn3DLineDY
• StackedColumn3D

See the graph gallery.

Debug XML Chart shows the XML generated by the transformation from which the graphs will be drawn.

Notes

The SPSRollUpChart, makes use of the FusionCharts company graphs, these graphs work using FLASH. So that internally what the SPSRollUpChart, does is to transform the results of the tracking the XML, into XML that is understood by the FusionCharts graphs.

The result as you can see will be spectacular.

Operation

Let us see a simple example, in where we hope to obtain a graph of the projects tasks state

We will select the "Project Tasks" list and the "Title and PercentComplete" fields, then in the XSL we will enter the following code that will be in charge to transform the XML obtained with the tracking into XML that can be understood by the FusionCharts.

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0"                 

xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxsl="urn:schemas-microsoft-com:xslt" 
exclude-result-prefixes="msxsl">
  
  <xsl:output method="xml" indent="yes"/>

  <xsl:template match="@* | node()">
    <!-- Graph -->
    <graph caption="Title" 
           xAxisName="Tasks"
           yAxisName="Completed"
           decimalPrecision="0" 
           formatNumberScale="0">
      <xsl:apply-templates />
    </graph>
  </xsl:template>

  <xsl:template match="Row">    
    <set name="{Title}" value="{PercentComplete}" />
  </xsl:template>
  
</xsl:stylesheet>

Later, we will fix the width and the height that we wish for our graph, as well as the type of graph which we wish to obtain. (Some graphs, as multiple serial graphs can require a more complex transformation)

SPSRollUpChart includes XSLT as an example to make this type of graphs.

We will mark the Debug XML Results and Debug XML Chart boxes, to see how the data is transformed.

The result:

DEBUG XML

<Rows> 
 <Row> 
  <_RowNumber>0</_RowNumber> 
  <Title>Task in Main Project</Title> 
  <PercentComplete>0.6</PercentComplete> 
 </Row> 
 <Row> 
  <_RowNumber>1</_RowNumber> 
  <Title>New Task</Title> 
  <PercentComplete>0.4</PercentComplete> 
 </Row> 
 <Row> 
  <_RowNumber>2</_RowNumber> 
  <Title>Task Completed</Title> 
  <PercentComplete>1</PercentComplete> 
 </Row> 
</Rows> 

DEBUG XML

<graph caption="Title" 
       xAxisName="Tasks" 
       yAxisName="Completed" 
       decimalPrecision="1" 
       formatNumberScale="0"> 
  <set name="Task in Main Project" value="0.6" color="AFD8F8" /> 
  <set name="New Task" value="0.4" color="F6BD0F" /> 
  <set name="Task Completed" value="1" color="8BBA00" /> 
</graph>

The result:

Additional Documentation

Fusion Chart XML reference