D3 Tree Ring Chart

[intapiuser]

Download: Tree Ring

Introduction

This article explains how to import a Tree Ring Chart from D3 as a plugin in Sisense.

Purpose/Benefits

Tree charts show the relationship between different levels of data.  It can be used visualizes how certain metrics roll up from the bottom level to the top.   See the referenced wiki page on tree charts for more information.  

Steps

The following steps will walk through the process of adding the new chart type and creating a sample Tree Ring Chart.

STEP 1 - ADD THE PLUGIN

Download the attachment and unzip the contents into your C:\Program Files\Sisense\PrismWeb\plugins\ folder. If you are using version 7.2 and higher unzip the contents into your C:\Program Files\Sisense\app\plugins\ folder. If the plugins folder doesn't exist, just create it. After those files have been unzipped there, you may also have to restart the web server. Now, when you create a new widget the tree ring chart should show up in the list of options

STEP 2 - CREATE THE CHART

On your dashboard, click the Create Widget button and select Advanced Configuration. Next, select the Tree Ring Chart from the chart types menu.  Choose between 1 and 3 dimensions to use as the hierarchy, making sure the top level items are listed first.  Then, pick a metric to use as the size.  The size of each circle should correlate to its value. 

Notes

•  This plugin uses the default sisense color palette, but this can be customized.  If you open widget.js in any text editor, there is a variable name Colors on line 127.  Enter in your own hex color codes, and they will be reflected in the chart.
• In order to calculate the values for each node, this plugin takes the SUM of the child nodes.  This means that the results may look a bit off when using other formulas like COUNT, AVERAGE, MEDIAN, etc.

References

• D3 Tree Ring Chart - GitHub project that this chart is based off
• Tree Structure Wikipedia