0

My task is to change a Power BI report from dark theme to light theme. Most things are working, however I haven't written json that effects the color (or general styles) of the the chiclet slicers yet. I have been using Power BI Desktop to trade themes similar to this video https://www.youtube.com/watch?v=AyFc2JTSlhc. I'm adding both versions of json below. Any help would be appreciated.

Light Theme

{
    "name": "Stone Light",
    "dataColors": [
        "#a9c23f",
        "#53565A",
        "#509e2f",
        "#004E42",
        "#5B7F95",
        "#8DB9CA",
        "#337079",
        "#e03c31",
        "#fce300",
        "#00b5e2",
        "#440099",
        "#9a3324",
        "#d3832b",
        "#F4D25A",
        "#7F898A",
        "#A4DDEE",
        "#FDAB89",
        "#B687AC",
        "#28738A",
        "#A78F8F",
        "#168980",
        "#293537",
        "#BB4A4A",
        "#B59525",
        "#475052",
        "#6A9FB0",
        "#BD7150",
        "#7B4F71",
        "#1B4D5C",
        "#706060",
        "#0F5C55",
        "#1C2325"
    ],
    "background": "#ffffff",
    "foreground": "#000000",
    "tableAccent": "#a9c23f",
    "visualStyles": {
        "*": {
            "*": {
                "*": [
                    {
                        "fontFamily": "Verdana, Calibri, Cambria",
                        "fontColor": {
                            "solid": {
                                "color": "#000000"
                            }
                        },
                        "color": {
                            "solid": {
                                "color": "#000000"
                            }
                        },
                        "selectedColor": {
                            "solid": {
                                "color": "#000000"
                            }
                        }   
                    }
                ],
                "border": [
                    {
                        "show": true,
                        "radius": 4,
                        "color": {
                            "solid": {
                                "color": "#444444"
                            }
                        }
                    }
                ],
                "background": [
                    {
                        "show": true,
                        "color": {
                            "solid": {
                                "color": "#333333"
                            }
                        },
                        "transparency": 0
                    }
                ],
                "title": [
                    {
                        "show": true,
                        "fontColor": {
                            "solid": {
                                "color": "#000000"
                            }
                        }
                    }
                ]
            }
        },
        "image": {
            "*": {
                "background": [
                    {
                        "show": false
                    }
                ],
                "border": [
                    {
                        "show": false
                    }
                ]
            }
        },
        "basicShape": {
            "*": {
                "background": [
                    {
                        "show": false
                    }
                ],
                "border": [
                    {
                        "show": false
                    }
                ]
            }
        },
        "textbox": {
            "*": {
                "background": [
                    {
                        "show": false
                    }
                ],
                "border": [
                    {
                        "show": false
                    }
                ]
            }
        },
        "ChicletSlicer 1.6.3": {
            "*": {
            "chiclets": {
                        "selectedColor": {
                            "solid": {
                                "color": "#ffffff"
                            }
                        },
                        "unselectedColor": {
                            "solid": {
                                "color": "#D0D0D0"
                            }
                        },
                        "fontColor": {
                            "solid": {
                                "color": "#F5F5F5"
                            }
                        }
            }
            }
        },
        "card": {
            "*": {
                "background": [
                    {
                        "color": {
                            "solid": {
                                "color": "#ffffff"
                            }
                        }
                    }
                ]
            }
        },
        "tableEx": {
            "*": {
                "columnHeaders":[{
                    "backColor":{"solid":{"color":"#ffffff"}}
                }],
                "background":[{
                    "color":{"solid":{"color":"#ffffff"}}
                }]
            }
        },
        "page": {
            "*": {
                "background": [
                    {
                        "color": {
                            "solid": {
                                "color": "#ffffff"
                            }
                        },
                        "transparency": 0
                    }
                ],
                "outspace": [
                    {
                        "color": {
                            "solid": {
                                "color": "#ffffff"
                            }
                        },
                        "transparency": 0
                    }
                ]
            }
        }
    }
}

Dark Theme

{
    "name": "Stone Dark",
    "dataColors": [
        "#a9c23f",
        "#53565A",
        "#509e2f",
        "#004E42",
        "#5B7F95",
        "#8DB9CA",
        "#337079",
        "#e03c31",
        "#fce300",
        "#00b5e2",
        "#440099",
        "#9a3324",
        "#d3832b"
    ],
    "background": "#1E1E1E",
    "foreground": "#ffffff",
    "tableAccent": "#D1DB86",
    "visualStyles": {
        "*": {
            "*": {
                "*": [
                    {
                        "fontFamily": "Verdana, Calibri, Cambria",
                        "fontColor": {
                            "solid": {
                                "color": "#ffffff"
                            }
                        },
                        "color": {
                            "solid": {
                                "color": "#ffffff"
                            }
                        }
                    }
                ],
                "border": [
                    {
                        "show": true,
                        "radius": 8,
                        "color": {
                            "solid": {
                                "color": "#1E1E1E"
                            }
                        }
                    }
                ],
                "background": [
                    {
                        "show": true,
                        "color": {
                            "solid": {
                                "color": "#1E1E1E"
                            }
                        },
                        "transparency": 0
                    }
                ],
                "title": [
                    {
                        "fontColor": {
                            "solid": {
                                "color": "#ffffff"
                            }
                        }
                    }
                ]
            }
        },
        "image": {
            "*": {
                "background": [
                    {
                        "show": false
                    }
                ],
                "border": [
                    {
                        "show": false
                    }
                ]
            }
        },
        "basicShape": {
            "*": {
                "background": [
                    {
                        "show": false
                    }
                ],
                "border": [
                    {
                        "show": false
                    }
                ]
            }
        },
        "textbox": {
            "*": {
                "background": [
                    {
                        "show": false
                    }
                ],
                "border": [
                    {
                        "show": false
                    }
                ]
            }
        },
        "ChicletSlicer 1.6.3": {
            "*": {
            "chiclets": [{
                        "selectedColor": {
                            "solid": {
                                "color": "#000000"
                            }
                        },
                        "unselectedColor": {
                            "solid": {
                                "color": "#ffffff"
                            }
                        },
                        "fontColor": {
                            "solid": {
                                "color": "#F5F5F5"
                            }
                        }
            }]
            }
        },
        "tableEx": {
            "*": {
                "columnHeaders":[{
                    "backColor":{"solid":{"color":"#0D0D0D"}}
                }],
                "background":[{
                    "color":{"solid":{"color":"#0D0D0D"}}
                }]
            }
        },
        "page": {
            "*": {
                "background": [
                    {
                        "color": {
                            "solid": {
                                "color": "#0D0D0D"
                            }
                        },
                        "transparency": 0
                    }
                ],
                "outspace": [
                    {
                        "color": {
                            "solid": {
                                "color": "#0D0D0D"
                            }
                        },
                        "transparency": 0
                    }
                ]
            }
        
        },
        "visualStyles": {
            "slicer": {
                "*": {
                    "*": [
                        {
                            "fontColor": { "solid": { "color": "#FFFFFF" } },
                            "foreground": { "solid": { "color": "#FFFFFF" } },
                            "background": { "solid": { "color": "#000000" } }
                        }
                    ]
                }
            }

        }
    } 
}
  • Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. – Community Nov 18 '21 at 14:19
  • This problem is I can't change the color (or other styles) of the Chiclet visuals of a PowerBI report using a JSON theme. The syntax of my JSON is wrong. I haven't been able to find anything that says how to fix it. – Jess Flintstone Nov 18 '21 at 17:23

1 Answers1

0

It seems like custom themes for the ChicletSlicer are not supported due to an outdated API being used. Updating the API would result in breaking changes.

https://github.com/microsoft/PowerBI-visuals-ChicletSlicer/issues/68

On a side note (if you happen to add support for other custom visuals), in your theme.json you should reference the Id of the visual and not the Name.

"ChicletSlicer1448559807354"

instead of

"ChicletSlicer 1.6.3"