Forum Discussion

Anonymous's avatar
Anonymous
Not applicable
6 years ago

PowerBI JSON Theme Slicer Default Mode to Dropdown

Hello,

I am working on a JSON Theme file to make creating a reports front end more streamline. However, I am having diffcultly trying to get the slicers to default to the Dropdown Mode instead of the List Mode.I have attached a snipt of my code below:

{
"name": "Custom Theme",
	 "dataColors": [
				"#09264E", 
        		"#004AB5",
        		"#FFA300", 
        		"#f2ebdb", 
        		"#D64550",
        		"#197278", 
        		"#1AAB40",
				"#3BB44A",
        		"#F2C811", 
        		"#D63817"
	],

	"visualStyles": {
		"slicer": {
              "*": {
                "responsive":true,
                "selection": [
                  {
                    "singleSelect": false,
                    "selectAllCheckboxEnabled": false
                  }
                ],
                "data": [{
					"mode": "Dropdown"
						}],	
				
				"header": [
                  {
                    "show": false
                  }
                ],
				"title": [
					{
						"show": true,
						"fontColor": { "solid": { "color": "#333333" } },
						"background": { "transparency": { "color": "" } },
						"alignment": "left",
						"fontSize": 10,
						"fontFamily": "Segoe UI Black"
					}
				],
				"items": [{
					"fontColor": { "solid": { "color": "#605E5C"}},
					"background": { "solid": { "color": "#FFFFFF"}},
					"outline": "None",
					"textSize": 9,
					"fontFamily": "Segoe UI"
					}],
				
				"visualHeader": [{
                    "show": false}]
              }
        }
	}
}

 Thank you in advance,

 

Chantelle

9 Replies

  • Hi,

     

    I'm experiencing the same problem. I have the following json, but the default slicer does not change to dropdown. It is in list / basic mode. According to this documentation, the mode should be changeable to "Dropdown".

     

     

    {
    "name": "Custom Theme",
    	"visualStyles": {
    		"slicer": {
                  "*": {
                    "data": [{
    					"mode": "Dropdown"
    						}]
                  }
            }
        }
    }

     

  • The issue still exists.

     

    . In general, we always use drop-down slicers so it would make sense for us to set this up in the JSON by default. As a good boy developer, I initialized the JSON in Visual Studio Code and made sure to use the latest $schema. Reading the documentation, I found that I just need to set the data.mode to "Dropdown" and all should be fine. In the screenshot is a bare minimum snippet of code that should just make the slicer a dropdown by default.

     

    However, loading this JSON theme into Power BI changed nothing in the default behavior: The slicer was still showing the data as a list. After studying my code, getting a coffee, staring at my screen some more, and searching the internet again, I finally came to the the post of AllisonKennedy that said: it actually works, but you need to do something before you can see it.

     

    After applying the theme and adding a slicer to your report, look carefully at the settings pane: The 'Reset to default' link is activated! Now for thebig magic trick!: Click it!

    Behold! The slicer suddenly decides that actually the JSON told it to be a dropdown, so it should probably transform.

     

    So definately a bug in may 2023 version of Power BI still

     

    • BasSteeg's avatar
      BasSteeg
      Regular Visitor

      Thanks, this helped me a lot—this is still the case in juni of 2026! The "Reset to default"-trick is still working.

  • Hi Chantelle

    Did you ever resolve this? All the references I have found to date says to set the "data" cardName property  to "mode" : "Dropdown", exactly like you did below, but for whatever reason, I cannot get any of the valid "mode" options to actually work from the template.

    Thanks in advance for your reply.

  • Hi Anonymous ,

    I think this may not be possible, the JSON file can only change the parameters of the features that exist in the Format. If you want the initial mode of the slicer to be Dropdown, you can try using the custom slicer, like Smart Filter by OKViz, etc.

    Best Regards,

    Community Support Team _ Joey
    If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

  • spham1215's avatar
    spham1215
    Frequent Visitor

    I'd like to bump this thread now that the December release has placed the dropdown option into the visualizations pane. Is there a way to identify the JSON label that will allow us to set the Dropdown option in our JSON Theme files?

    • AllisonKennedy's avatar
      AllisonKennedy
      Icon for Community Champion rankCommunity Champion

      In my experience, the code provided by bayeshelsinki works, but only after you click 'reset to default' in the formatting pane.

       

       

      So still a bit of a bug...

  • Anonymous's avatar
    Anonymous
    Not applicable

    Hi, denpries. Do you know if this has been fixed, or adressed by MIcrosoft, because this bug is still in PowerBI.

  • Hello,

    I tried the same today. PowerBI Desktop is still not responsive to the JSON for setting Slicer Default Mode to Dropdown.

    This is the JSON that I used:

    "slicer": {
                "*": {
                            "data": [
                                { "mode": "Dropdown" } // Comment: PowerBI still shows the default vertical list.
                    ],
                    "header": [
                        {
                            "show": true,
                            "fontColor": {
                                "solid": {
                                    "color": "#FFFFFF"
                                }
                            },
                            "textSize": 9,
                            "fontFamily": "Arial",
                            "background": {
                                "solid": {
                                    "color": "#0091DC"
                                }
                            },
                            "border": [
                                {
                                    "color": {
                                        "solid": {
                                            "color": "#FFFFFF"
                                        }
                                    },
                                    "show": true,
                                    "radius": 0
                                }
                            ],
                            "outlineStyle": 4,  // Comment: Line for bottom of header area. According to documentation Bottom should be a 2. But 2 shows a line on the left.
                            "outlineColor": {
                                "solid": {
                                    "color": "#FFFFFF" } // Comment: Line color. The color of the line doesn't adjust to white when I apply the JSON.
                                },
                            "outlineWeight": 4    
                            }
                    ],
                    "background": [
                        {
                            "transparency": 100
                        }
                    ],
                    "items": [
                        {
                            "fontColor": {
                                "solid": {
                                    "color": "#000000"
                                }
                            },
                            "background": {
                                "solid": {
                                    "color": "#FFFFFF"
                                }
                            },
                            "selectedColor": {
                                "solid": {
                                    "color": "#0091DC"
                                }
                            },
                            "selectedFontColor": {
                                "solid": {
                                    "color": "#FFFFFF"
                                }
                            },
                            "selectedFontWeight": "Bold",
                            "outline": "None",
                            "textSize": 8,
                            "fontFamily": "Arial",
                            "padding": 0
                        }
                    ],
                    "title": [
                        {
                            "fontsize": 10,
                            "show": true,
                            "fontColor": {
                                "solid": {
                                    "color": {
                                        "expr": {
                                            "ThemeDataColor": {
                                                "ColorId": 1,
                                                "Percent": 0
                                            }
                                        }
                                    }
                                }
                            },
                            "fontFamily": "Arial"
                        }
                    ],
                    "border": [
                        {
                            "color": {
                                "solid": {
                                    "color": "#e3e5e5"
                                }
                            },
                            "show": false,
                            "radius": 0
                        }
                    ]
                }
            },"
     
    I hope Microsoft wil fix these bugs some day soon. (Or let me know what i'm doing wrong, which is also always a possibility of course.)