That Thing Called columnMap
Note: it is now possible to bind to columnMap, check out more in this blog. You can still set columnMap to null as described in this blog.
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"
}
}
"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"
}
}
Written by
Thanks, Rikke!
Thanks for updating the modifications in accordance with Spring18. Its working like magic.
This blog just saved my life at a customer – yet again!
Happy to help. Also easy trick when selecting is using ctrl+P to – if you are at a starting bracket it will find the matching ending bracket.
Hi
what about vise versa, what if the user clicks on a segment of a stackbar chart the colums and the data of a table changes (both stack chart and the table are from the same dataset), i can control the table with a toggle button (selection function in json) but how can i get the selection event from the chart ?
is it related to “columnMap” thing ??
thanks
Hi, one thing I’m running into that I cannot figure out with this. My chart uses columns where I have derived a value using values from other columns. When creating the chart I’ve hidden the columns I do not want to see when the chart is displayed in the dashboard, however, when I go through the binding steps the fields I did not want to see reappear. I’ve tried to figure out a way to get that piece back in the json (Out of columns A, B, C, D, E I only want to display columns A, C, E), but without luck. Is it possible to do this? Thank you.
Hi, I’m having an issue I’m running into that I’m hoping you might be able to help with. I’ve created a chart where I’m deriving some values using other column data and then hiding the columns I don’t want displayed on the chart in the dashboard. However, when I go through the binding steps, the columns I don’t want to see reappear (I only want to see columns A, C, E, but columns A, B, C, D, E are shown). I’ve attempted to try and figure out how to add back into the json the piece that tells it what columns to display, but without luck. Is it possible to do this? Thanks ~
Rikke, Thank you for your Awesome blog. Super helpful. I couldn’t limit the columns using columnMap when I added a group binding. I needed to add a columns section into the widget json. Have you been able to specify the columns using columnMap with group binding?
I have done this before and it works however if you have hidden columns and if you replace column map with null to add dynamic groups; you won’t be able to hide columns any more .
Hi, is there a way ,we use the binding of static step in the ‘plot’ section of the ColumnMap property?
No, not currently.
Thanks for your reply. Can you please help with one another thing, is there a way where we can project different measures on a chart, by making a selection from a toggle?
A work around is to use 2 layouts, with a link to switch between layouts.
In one layout, use plot with 1 measure in the other the plot uses a different measure.
Not ideal but it is the only way around I could find.
Thanks, Rikke.
This article is still relevant today! I came across it and the columnmap issue can be solved as explained in here!
Very useful blog Rikke, I want to ask one thing like Tableau Dashboard can we add parameters or group the fields in Dashboard directly.