416.467.9100 | Dundas Data Visualization | Login
Welcome Guest
Dashboard v5.0

This site makes extensive use of JavaScript.

Please enable JavaScript in your web browser and reload the page before proceeding.

Periodic analysis using State Indicator by applying states at run-time

Hide navigation
RSS
Modified on Tue, 18 Mar 2014 03:57 PM Categorized as Data Controls, Datasets, Gauge, Level-Advanced, Parameters, Script Library, Scripting, State Indicator

Overview

This article will show how to analyze periodic data using a state indicator by assigning state colors at run time based on the comparison of current year’s data with the previous year’s data. The example uses a bullet graph that shows current year’s data as the actual value and previous year’s data as the target value. Based on the difference between the values, a color is assigned to the state indicator.

Assign state colors at run-time

Before proceeding with the setup, see below on how the states and colors are assigned at run-time using script. This follows three steps in scripting after adding the state indicator control to the canvas:

  • Add an indicator to the control
  • Add a state to the indicator
  • Add the color to the state

//Add an indicator to the control
DashboardIndicator i = new DashboardIndicator();
StateIndicator1.Indicators.Add(i);

//Add State to the indicator DashboardState state = new DashboardState(); StateIndicator1.Indicators[0].States.Add(state);

//Add the color to the state StateIndicator1.Indicators[0].States[0].ShapeFill = new DashboardSolidColorBrush(Colors.Green);

Steps

  • Add a bullet graph control to the canvas and drop the KPI/Dataset twice on it. Actual value will show the current year’s
    data. Target value will show the previous year’s data.
  • Add a parameter called Date that acts on both the two KPIs of the Bullet Graph.
  • Add an offset parameter called Date_Offset that acts on the second KPI.

Date Offset

Date Offset


Parameters

Parameters


  • Drag and drop the parameter Date onto the canvas.
  • Add a state indicator control to the canvas.

The final setup will look like this:

Final setup

Final setup


Load Interaction

Add this script to the Load Interaction that adds an indicator on load and calculates the state for the default values and adds the colors:

//Add State to the State Indicator control
DashboardIndicator i = new DashboardIndicator();
StateIndicator1.Indicators.Add(i);

DashboardState state = new DashboardState(); StateIndicator1.Indicators[0].States.Add(state); //Get the Actual Value. Change the FieldValues index based on your value column in the KPI. float thisYear = BulletGraph1.DataDescriptors[0].DataResult.DataPoints[0].FieldValues[3];

//Get the Target Value. Change the FieldValues index based on your value column in the KPI. float lastYear = BulletGraph1.DataDescriptors[1].DataResult.DataPoints[0].FieldValues[3];

//Get the difference between the values float difference = thisYear-lastYear;

//Assign the state colors if(difference > 0) { StateIndicator1.Indicators[0].States[0].ShapeFill = new DashboardSolidColorBrush(Colors.Green); }

if(difference < 0) { StateIndicator1.Indicators[0].States[0].ShapeFill = new DashboardSolidColorBrush(Colors.Red); }

else if(difference == 0) { StateIndicator1.Indicators[0].States[0].ShapeFill = new DashboardSolidColorBrush(Colors.Yellow); }

Parameter Changed Interaction

Add this code to the Parameter Changed Interaction that first check what parameter has changed and then calculates the state on every parameter change and fills the color accordingly:

//Check what parameter has changed
if(e.Parameter.Name == "Date")
{
  //Get the Actual Value. Change the FieldValues index based on your value column in the KPI.  
  float thisYear = BulletGraph1.DataDescriptors[0].DataResult.DataPoints[0].FieldValues[3];

//Get the Target Value. Change the FieldValues index based on your value column in the KPI. float lastYear = BulletGraph1.DataDescriptors[1].DataResult.DataPoints[0].FieldValues[3];

//Get the difference between the values float difference = thisYear-lastYear;

//Assign the state colors if(difference > 0) { StateIndicator1.Indicators[0].States[0].ShapeFill = new DashboardSolidColorBrush(Colors.Green); }

if(difference < 0) { StateIndicator1.Indicators[0].States[0].ShapeFill = new DashboardSolidColorBrush(Colors.Red); }

else if(difference == 0) { StateIndicator1.Indicators[0].States[0].ShapeFill = new DashboardSolidColorBrush(Colors.Yellow); }

}

Result

Result

Result


Related Topics

About Dundas | Contact Us Follow us on Twitter! | Privacy Statement | Report Site Issues

Copyright © 2009-2014 Dundas Data Visualization, Inc.