That Thing Called columnMap

With Salesforce’s Spring 18 release they introduced a new parameter in the Dashboard JSON called columnMap. While Salesforce has good reasons to introduce this – more on this is still to come – then it can cause a little conflict in your Dashboards when you try to customize it behind the scenes. One thing I always use when I design dashboard is static steps, they are amazing and you can read more about it here and here. The static step is a typical example where you have to use bindings with grouping and measures and this is where the columnMap parameter often is acting up throwing errors. The error might not tell you exactly what is wrong or that it has to to with columnMap, but you’ll get a “lovely” little error indication and no results on your dashboard.

So if you are doing bindings is a dashboard that is created after Spring18 there is a good chance the columnMap parameter is to blame. Now I am sure you are asking how do we fix this? It’s actually relatively simple.

If we look at the dashboard above I have two steps in it; one that shows a waterfall graph (or should when it is working) and one toggle. The toggle step is a static step that is bound to the waterfall graph. In case you want to see how it looks behind the scene here are the details of my two steps “BindingStep_1” and “Static_1” (you can get the same view by hitting command+E or control+E):

"steps": {
 "BindingStep_1": {
 "type": "aggregateflex",
 "visualizationParameters": {
 "options": {},
 "type": "chart",
 "parameters": {
 "visualizationType": "waterfall",
 "theme": "wave",
 "title": {
 "label": "",
 "fontSize": 14,
 "subtitleLabel": "",
 "subtitleFontSize": 11,
 "align": "center"
 },
 "showValues": true,
 "dimensionAxis": {
 "showAxis": true,
 "showTitle": true,
 "title": ""
 },
 "measureAxis1": {
 "sqrtScale": false,
 "showAxis": true,
 "customDomain": {
 "showDomain": false
 },
 "showTitle": true,
 "title": ""
 },
 "tooltip": {
 "customizeTooltip": false,
 "showDimensions": true,
 "dimensions": "",
 "showMeasures": true,
 "measures": "",
 "showPercentage": true,
 "showBinLabel": true
 },
 "trellis": {
 "enable": false,
 "showGridLines": true,
 "flipLabels": false,
 "type": "x",
 "chartsPerLine": 4,
 "size": [
 100,
 100
 ]
 },
 "columnMap": {
 "trellis": [],
 "dimensionAxis": [
 "StageName"
 ],
 "measureAxis1": [
 "sum_Amount"
 ]
 },
 "totalValue": "computeTotal",
 "totalLabel": "",
 "positiveColor": "#0BA976",
 "negativeColor": "#E41E42",
 "startColor": "#1674D9",
 "totalColor": "#1674D9"
 }
 },
 "datasets": [
 {
 "id": "0Fb0N000000bmLLSAY",
 "name": "Oppty",
 "label": "Oppty",
 "url": "/services/data/v42.0/wave/datasets/0Fb0N000000bmLLSAY"
 }
 ],
 "useGlobal": true,
 "isGlobal": false,
 "query": {
 "measures": [
 [
 "sum",
 "Amount"
 ]
 ],
 "groups": "{{column(Static_1.selection, [\"value\"]).asObject()}}"
 },
 "label": "BindingStep",
 "broadcastFacet": true,
 "receiveFacet": true,
 "selectMode": "single"
 },
 "Static_1": {
 "type": "staticflex",
 "numbers": [],
 "strings": [],
 "groups": [],
 "broadcastFacet": true,
 "selectMode": "singlerequired",
 "label": "Static",
 "values": [
 {
 "display": "Type",
 "value": "Type"
 },
 {
 "display": "Stage",
 "value": "StageName"
 }
 ]
 }
 },

Now what we need to focus on is the BindingStep_1, cause this is where we have the troublemaker columnMap, you can see the details highlighted below.

"BindingStep_1": {
 "type": "aggregateflex",
 "visualizationParameters": {
 "options": {},
 "type": "chart",
 "parameters": {
 "visualizationType": "waterfall",
 "theme": "wave",
 "title": {
 "label": "",
 "fontSize": 14,
 "subtitleLabel": "",
 "subtitleFontSize": 11,
 "align": "center"
 },
 "showValues": true,
 "dimensionAxis": {
 "showAxis": true,
 "showTitle": true,
 "title": ""
 },
 "measureAxis1": {
 "sqrtScale": false,
 "showAxis": true,
 "customDomain": {
 "showDomain": false
 },
 "showTitle": true,
 "title": ""
 },
 "tooltip": {
 "customizeTooltip": false,
 "showDimensions": true,
 "dimensions": "",
 "showMeasures": true,
 "measures": "",
 "showPercentage": true,
 "showBinLabel": true
 },
 "trellis": {
 "enable": false,
 "showGridLines": true,
 "flipLabels": false,
 "type": "x",
 "chartsPerLine": 4,
 "size": [
 100,
 100
 ]
 },
 "columnMap": {
 "trellis": [],
 "dimensionAxis": [
 "StageName"
 ],
 "measureAxis1": [
 "sum_Amount"
 ]
 },
 "totalValue": "computeTotal",
 "totalLabel": "",
 "positiveColor": "#0BA976",
 "negativeColor": "#E41E42",
 "startColor": "#1674D9",
 "totalColor": "#1674D9"
 }
 },
 "datasets": [
 {
 "id": "0Fb0N000000bmLLSAY",
 "name": "Oppty",
 "label": "Oppty",
 "url": "/services/data/v42.0/wave/datasets/0Fb0N000000bmLLSAY"
 }
 ],
 "useGlobal": true,
 "isGlobal": false,
 "query": {
 "measures": [
 [
 "sum",
 "Amount"
 ]
 ],
 "groups": "{{column(Static_1.selection, [\"value\"]).asObject()}}"
 },
 "label": "BindingStep",
 "broadcastFacet": true,
 "receiveFacet": true,
 "selectMode": "single"
 },

So what do we do? Well, remove the highlighted bit and replace it with “columnMap”: null, – it should look something like this:

"BindingStep_1": {
 "type": "aggregateflex",
 "visualizationParameters": {
 "options": {},
 "type": "chart",
 "parameters": {
 "visualizationType": "waterfall",
 "theme": "wave",
 "title": {
 "label": "",
 "fontSize": 14,
 "subtitleLabel": "",
 "subtitleFontSize": 11,
 "align": "center"
 },
 "showValues": true,
 "dimensionAxis": {
 "showAxis": true,
 "showTitle": true,
 "title": ""
 },
 "measureAxis1": {
 "sqrtScale": false,
 "showAxis": true,
 "customDomain": {
 "showDomain": false
 },
 "showTitle": true,
 "title": ""
 },
 "tooltip": {
 "customizeTooltip": false,
 "showDimensions": true,
 "dimensions": "",
 "showMeasures": true,
 "measures": "",
 "showPercentage": true,
 "showBinLabel": true
 },
 "trellis": {
 "enable": false,
 "showGridLines": true,
 "flipLabels": false,
 "type": "x",
 "chartsPerLine": 4,
 "size": [
 100,
 100
 ]
 },
 "columnMap": null,
 "totalValue": "computeTotal",
 "totalLabel": "",
 "positiveColor": "#0BA976",
 "negativeColor": "#E41E42",
 "startColor": "#1674D9",
 "totalColor": "#1674D9"
 }
 },
 "datasets": [
 {
 "id": "0Fb0N000000bmLLSAY",
 "name": "Oppty",
 "label": "Oppty",
 "url": "/services/data/v42.0/wave/datasets/0Fb0N000000bmLLSAY"
 }
 ],
 "useGlobal": true,
 "isGlobal": false,
 "query": {
 "measures": [
 [
 "sum",
 "Amount"
 ]
 ],
 "groups": "{{column(Static_1.selection, [\"value\"]).asObject()}}"
 },
 "label": "BindingStep",
 "broadcastFacet": true,
 "receiveFacet": true,
 "selectMode": "single"
 },

Now if you are quick and go back to view your dashboard you would have noticed you still get the error. Why? Well, there is one more columnMap in the widget section we need to go back to. I know that my step is called BindingStep_1, so I need to find the widget that is referring to that and again you’ll need to find the parameter columnMap as I’ve highlighted. By the way, if you are unsure how to find the correct widget have a look at the step parameter within the widget, which I’ve also highlighted below it’s very easy to find using command+F or control+F (which opens up the search bar).

"chart_1": {
 "type": "chart",
 "parameters": {
 "visualizationType": "waterfall",
 "title": {
 "label": "",
 "fontSize": 14,
 "subtitleLabel": "",
 "subtitleFontSize": 11,
 "align": "center"
 },
 "theme": "wave",
 "showValues": true,
 "dimensionAxis": {
 "showAxis": true,
 "showTitle": true,
 "title": ""
 },
 "measureAxis1": {
 "sqrtScale": false,
 "showAxis": true,
 "customDomain": {
 "showDomain": false
 },
 "showTitle": true,
 "title": ""
 },
 "tooltip": {
 "customizeTooltip": false,
 "showDimensions": true,
 "dimensions": "",
 "showMeasures": true,
 "measures": "",
 "showPercentage": true,
 "showBinLabel": true
 },
 "trellis": {
 "enable": false,
 "showGridLines": true,
 "flipLabels": false,
 "type": "x",
 "chartsPerLine": 4,
 "size": [
 100,
 100
 ]
 },
 "exploreLink": true,
 "totalValue": "computeTotal",
 "totalLabel": "",
 "positiveColor": "#0BA976",
 "negativeColor": "#E41E42",
 "startColor": "#1674D9",
 "totalColor": "#1674D9",
 "columnMap": {
 "trellis": [],
 "dimensionAxis": [
 "StageName"
 ],
 "measureAxis1": [
 "sum_Amount"
 ]
 },
 "step": "BindingStep_1"
 }
 }
We will do the same thing here as we did for the step replace the “columnMap”: {…}, with “columnMap”: null,
"chart_1": {
 "type": "chart",
 "parameters": {
 "visualizationType": "waterfall",
 "title": {
 "label": "",
 "fontSize": 14,
 "subtitleLabel": "",
 "subtitleFontSize": 11,
 "align": "center"
 },
 "theme": "wave",
 "showValues": true,
 "dimensionAxis": {
 "showAxis": true,
 "showTitle": true,
 "title": ""
 },
 "measureAxis1": {
 "sqrtScale": false,
 "showAxis": true,
 "customDomain": {
 "showDomain": false
 },
 "showTitle": true,
 "title": ""
 },
 "tooltip": {
 "customizeTooltip": false,
 "showDimensions": true,
 "dimensions": "",
 "showMeasures": true,
 "measures": "",
 "showPercentage": true,
 "showBinLabel": true
 },
 "trellis": {
 "enable": false,
 "showGridLines": true,
 "flipLabels": false,
 "type": "x",
 "chartsPerLine": 4,
 "size": [
 100,
 100
 ]
 },
 "exploreLink": true,
 "totalValue": "computeTotal",
 "totalLabel": "",
 "positiveColor": "#0BA976",
 "negativeColor": "#E41E42",
 "startColor": "#1674D9",
 "totalColor": "#1674D9",
 "columnMap":null,
 "step": "BindingStep_1"
 }
 }
Now you can return to your dashboard and it should look great!
Note that I previously had “columns”: [] instead of “columnMap”: null. You can use both but the latter should be more future proof of the further changes there may very well come to columnMap.

2 thoughts on “That Thing Called columnMap”

  • 1
    Mark on April 24, 2018 Reply

    Thanks, Rikke!

  • 2
    Jagan on May 22, 2018 Reply

    Thanks for updating the modifications in accordance with Spring18. Its working like magic.

Leave a Reply

Your email address will not be published. Required fields are marked *