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.

Create a Pyramid Chart

Hide navigation
RSS
Modified on Wed, 04 Jun 2014 02:10 PM Categorized as Chart, Script Library, Scripting
Dundas Dashboard Script LibraryPrevious


Overview

Currently, there is no built-in Pyramid Chart Data Visualization Control in Dundas Dashboard. A workaround is to use a Funnel Chart, use the Measure Column in setting the Height property of each Funnel/Pyramid Chart section, and then use scripting to automatically compute for the Width property.

Note: This sample merely demonstrates how to use scripting in order to create a Pyramid Chart in Dundas Dashboard, and in no way intended to represent a Best Practice in Data Visualization.

Setup

KPI/Dataset Preview

KPI/Dataset Preview.

KPI/Dataset Preview.

Dashboard Setup

  1. Drag and Drop a Funnel Chart Data Visualization control to the Dashboard canvas.
  2. Drag and Drop your KPI/Dataset to the Funnel Chart Data Visualization control.
  3. On the Data Settings Configuration dialog's Basic KPI/Dataset Settings, leave the defaults as-is and click Next.
  4. On the Metric Settings dialog, select the Sales Amount measure as the Height.
    Set the Height.

    Set the Height.

  5. Leave the default value of Width to None as this will be computed automatically by the script.
  6. On the Dimension Selection dialog, select the Sales Agent dimension.
    Set the Dimension.

    Set the Dimension.

  7. Leave the other defaults as-is and close the dialog.

Adding the DundasScript™

You can add this script on the Load Interaction.

double width = 0;
DashboardFunnelChart chart =  FunnelChart1; //Change to your own Funnel Chart name if needed

if (chart.Series.Count > 0) { // The first point only supplies the first width chart.Series[0].Points.Insert(0, new DashboardDataPoint(0, 0)); }

foreach (DashboardDataSeries series in chart.Series) { foreach (DashboardDataPoint point in series.Points) { // The width of a pyramid grows cumulatively width += point.YValues[0]; point.YValues[1] = width; } }

Testing

Preview the dashboard:
Pyramid Chart.

Pyramid Chart.


Formatting the Labels

To hide the Width labels (since they no longer mean anything):
  • Set the series' Width Label Type property to Disabled.

To include the Sales Agent name and display the currency with 2 decimals:
  • Set the series' Height Label Text property to #XVALUE: #YVALUE{C2}.

To align the labels and add a label line:
  • Set the series' Height Label Type property to Right Column.

Preview the dashboard:
Pyramid Chart after formatting the labels.

Pyramid Chart after formatting the labels.



Related topics

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

Copyright © 2009-2014 Dundas Data Visualization, Inc.