Plugin - Custom Coloring of Bar and Column Chart Type Widgets (barChartCustomColor)

[JeremyFriedel]

Plugin - Custom Coloring of Bar and Column chart-type widgets

This plugin modifies the color scheme of bar and column chart-type widgets to match the current color palette of the dashboard.

Installation

To install this plugin, download and unzip the attachment. Then drop the barChartCustomColor folder into your plugins folder (/opt/sisense/storage/plugins). Enable the plugin on the Add-ons tab in the Admin section, wait for the plugin to build, and the plugin will be enabled. The plugin API can also be used, as well as the file management UI.

Notes

When a bar or column chart type Sisense widget is very straightforward and focused and does not have multiple values, breaks by's, categories, or conditional coloring, it can sometimes appear relatively mono-color but still be the most effective way to quickly visually communicate important data.

While Sisense includes numerous powerful and varied methods and options to change widget styling and includes functionality to set bar color to vary based on the bar value, it sometimes may be desired to use the dashboard palette to vary the bar colors independently of bar value and guarantee a colorful widget regardless of the data and current filter state of the current dashboard and widget. This plugin allows the current dashboard palette to be used in this manner in a simple and quick matter and allows this to be applied quickly to an entire dashboard at once. Linking the widget coloring to the dashboard palette allows this color scheme to be quickly changed in the native UI without modifying individual widgets. This plugin also allows using a color dictionary config option to modify the coloring of a value in all widgets this plugin is enabled in.

 

This plugin uses the processresult widget event to modify the color parameter of each bar or column in a series.

The dashboard palette is retrieved using the getPalette() function within the dashboard style parameter, which returns the current dashboard palette. This can be used in other plugins and scripts.

dashboard.style.getPalette()

This plugin is enabled via dashboard or widget scripts that set the widget parameter changeColor to true for a widget.

For a widget script, this is as simple as adding this one line to the script:

widget.changeColor = true;

Adding this three-line dashboard script will set this parameter to true for all widgets in the dashboard:

dashboard.on('widgetinitialized', function (_, dashObj) {
	dashObj.widget.changeColor = true;
});

This can be modified with custom logic as needed, for example, based on widget title or ordering in the dashboard. If this option is enabled for a type of widget this plugin does not apply to, it will simply be ignored by the plugin. This plugin ignores widgets with Break By's or Date Categories, or widgets that are not bar or column chart-type widgets.

The color scheme is based on the current dashboard palette. 

Changing the dashboard palette using the standard Sisense palette UI will result in a matching change of all widgets in the dashboard where this plugin is enabled.

The config file of this plugin includes an option called colorDictionary, this can be used to override the standard palette color for all instances this value appears as the bar category, for all widgets this plugin is enabled for, regardless of the dashboard palette. Any standard HTML color naming format may be used in the dictionary config value.

For example, if the colorDictionary is set to:

    colorDictionary :
        {
            'Bikes': '#AA6C39',
            'ABC' : 'yellow'
        }

 Then the ABC bar or column will be yellow in the widget, regardless of the current widget palette or positioning. This will apply to all widgets where this plugin is active.

This plugin can be used as a basic template for your own Sisense plugins that run on a specific widget or dashboard event, that can be enabled or disabled via widget script, and that includes a configuration file to modify settings without modifying code files. 

 

How did the plugin work for you? What other type of plugin are you looking to learn more about?

Let me know in the comments!