insights-how-to-add-a-custom-column-set – Maximizer

Add a Custom Column Set to the Widget

Any widget script customization and can be performed by Professional Services only. Customized widget scrips are not supported by Maximizer Customer Service.

Normally; you can only pull data from Maximizer to create your Insights widgets. It is possible to add a static reference number to KPIs or formulas; but not a whole data set.

This article explains how to create a custom script with a hardcoded data set represented by the red part of the columns in the widget below.

This solution works only for values that don't change often and doesn't work for rolling dates or other categories that involve changing X-axis labels. Any further changes must be manually updated in the script.

The static hardcoded values don't respond to any filters.

Step by step How-to

Create a widget without targets. In the example above we have a column chart
Format X-axis. You will be referencing X-axis display values in the custom script. In this example; it's 'Team A' and 'Team B'.

Any changes in the display values labels must be manually adjusted in the widget script.

Now let's create a custom target line. Click on the 'Edit script' on the top right.

Copy the Script below and make necessary changes to the labels (in violet) and target values (in green).

Copy Code

Code

widget.on('processresult'; function(widget;args){

  let columnColor = "red";
  let columnName = "Target";
  let dataItems = {
    "Team A": 10000;
    "Team B": 7000
  };
  console.log(args.result.xAxis.categories);
  
  let series = args.result.series;
  if (series != null && series.length  0) {
    let duplicatedSeries = $.extend(true; {}; series[0]);
    
    duplicatedSeries.type = "column";
    duplicatedSeries.name = columnName;
    duplicatedSeries.color = columnColor;
    let datas = duplicatedSeries.data;
    let categories = args.result.xAxis.categories;
    for (let  i = 0; i <datas.length; i++)="i++)" {="{">
      let cd = categories[i];   
      if (dataItems[cd] != null) {
        datas[i].y = dataItems[cd];
        datas[i].color = columnColor;
      }
    }
    series.unshift(duplicatedSeries);   
  }

});</datas.length;>

To put this added data on top of the chart use series.unshift(dublicatedSeries)

To put added data on the bottom use series.push(dublicatedSeries)

Click 'Save' for script changes.
Change Column Type to 'Stacked Chart'
Go back to the dashboard and refresh to see applied changes

img_a2qc5vg5.ppo.png
10 KB Download