topic Re: actionButton Power BI JSON Theme in Developer

actionButton Power BI JSON Theme

jkerski — Fri, 08 Mar 2019 20:21:47 GMT

I am trying to put together a theme for the action button, but have not figured out the right syntax to set the Default State, On Hover, and On Press outline theme. Below is what I have so far. Anybody have an example? Thanks.

"actionButton": {

"*": {

"visualHeader": [{

"show": true

}],

"border": [{

"show": false

}],

"fill": [{

"show": true

}],

"outline": [

{

"show":true

}

]

}

Re: actionButton Power BI JSON Theme

Anonymous — Wed, 08 May 2019 15:54:46 GMT

@jkerski

Did you ever work out an answer to this?

I am trying to work this out atm.

Cheers

Re: actionButton Power BI JSON Theme

Anonymous — Thu, 16 May 2019 13:23:24 GMT

Anybody got any help on this yet?

Re: actionButton Power BI JSON Theme

Anonymous — Thu, 16 May 2019 13:24:53 GMT

Not yet and I still haven't worked out a solution.

Re: actionButton Power BI JSON Theme

Anonymous — Thu, 16 May 2019 13:26:11 GMT

Thanks for getting back to me, If I find anything I will post it back in here.

Re: actionButton Power BI JSON Theme

jkerski — Thu, 16 May 2019 13:37:00 GMT

I haven't figured it out yet either. I have been looking through the custom visual docs to see if I can find the schema. I will share if I find something.

Re: actionButton Power BI JSON Theme

Anonymous — Sat, 18 May 2019 06:22:28 GMT

I haven't had a chance to try this yet, but the theming support for filter pane may give some clues.
$id: "on hover"
Or something similar might work.

Re: actionButton Power BI JSON Theme

Anonymous — Mon, 20 May 2019 07:43:41 GMT

Success !!!!

"fill":
		[
			{
				"show":true
			},
			{
				"$id": "default",
				"transparency": 20,
				"fillColor": {"solid":{"color":"#111111"}}
			},
			{
				"$id": "hover",
				"transparency": 70,
				"fillColor": {"solid":{"color":"#555556"}}
			},
			{
				"$id": "selected",
				"transparency": 30,
				"fillColor": {"solid":{"color":"#ddd556"}}
			}
		]

Re: actionButton Power BI JSON Theme

jkerski — Mon, 20 May 2019 13:46:45 GMT

Awesome. Thank you! Can finally complete the theme file on my project.

Re: actionButton Power BI JSON Theme

Anonymous — Mon, 20 May 2019 13:58:24 GMT

No worries @jkerski

Put a solved flag on this thread in case someone else stumbles across this problem.

Re: actionButton Power BI JSON Theme

jcarville — Tue, 09 Jul 2019 08:32:09 GMT

@Anonymous could you elaborate on this please and submit a .json file that can be imported to a desktop file so I can see the structure of the file. My JSON skills aren't the best and I've been struggling to get this working even with your example. Thanks

Re: actionButton Power BI JSON Theme

Anonymous — Tue, 09 Jul 2019 08:37:00 GMT

{"name":"Theme Example of Action Buttons",
"background":"#333333",
"foreground":"#FFFFFF",
"tableAccent":"#4A8DDC",
"dataColors":["#4A8DDC", "#F3C911", "#DC5B57","#33AE81","#8D6FD1","#FE6DB6","#4C5D8A","#95C8F0"],
"visualStyles":{
	"*": {
             "*": {
                 
                 
             }
         },

"actionButton":{"*":
	{
	"border":
		[{
			"show":false
		}],
	"visualHeader":
		[{
			"show":false
		}],
	"background":
		[{
			"show":false
		}],
	"title":
		[{
			"show":false
		}],
	"outline":
		[
			{
				"show":true
			},
			{
				"$id": "default",
				"weight":0
			},
			{
				"$id": "hover",
				"weight":0
			},
			{
				"$id": "selected",
				"weight":0
			}
		],
	"fill":
		[
			{
				"show":true
			},
			{
				"$id": "default",
				"transparency": 0,
				"fillColor": {"solid":{"color":"#25476E"}}
			},
			{
				"$id": "hover",
				"transparency": 0,
				"fillColor": {"solid":{"color":"#386AA5"}}
			},
			{
				"$id": "selected",
				"transparency": 0,
				"fillColor": {"solid":{"color":"#4A8DDC"}}
			}
		],
	"icon":
		[
			{
			"show":true
			},
			{
				"$id": "default",
				"lineColor":{"solid":{"color":"#FFFFFF"}}
			},
			{
				"$id": "hover",
				"lineColor":{"solid":{"color":"#FFFFFF"}}
			},
			{
				"$id": "selected",
				"lineColor":{"solid":{"color":"#FFFFFF"}}
			}
		
		]
	}},

"*":{"*":
	{
	"outspacePane": [{
                     "backgroundColor": {"solid": {"color": "#4A8DDC"}},
                     "foregroundColor": {"solid": {"color": "#FFFFFF"}},
                     "transparency": 15,
                     "titleSize": 24,
                     "headerSize": 12,
                     "fontFamily": "Arial",
                     "border": true,
					 "width":240,
                     "borderColor": {"solid": {"color": "#374649"}}
                 }],
	"filterCard": [
                     {
                     "$id": "Applied",
                     "transparency": 0,
                     "backgroundColor": {"solid": {"color": "#25476E"}},
                     "foregroundColor": {"solid": {"color": "#FFFFFF"}},
                     "textSize": 12,
                     "border": true,
                     "borderColor": {"solid": {"color": "#ffffff"}},
                     "inputBoxColor": {"solid": {"color": "#333333"}}
                     },
                     {
                     "$id": "Available",
                     "transparency": 40,
                     "backgroundColor": {"solid": {"color": "#4A8DDC"}},
                     "foregroundColor": {"solid": {"color": "#333333"}},
                     "textSize": 12,
                     "border": true,
                     "borderColor": {"solid": {"color": "#123456"}},
                     "inputBoxColor": {"solid": {"color": "#E6E6E6"}}
                 }] 

	}}
	}}

Re: actionButton Power BI JSON Theme

Anonymous — Tue, 09 Jul 2019 08:38:47 GMT

@jcarville

The above post will show you how to apply this to both Action Buttons and the Filter Pane & Cards.

Any questions then give me a shout.

Re: actionButton Power BI JSON Theme

jcarville — Tue, 09 Jul 2019 08:55:04 GMT

@Anonymousthats brilliant, thanks very much and for the quick reply

Re: actionButton Power BI JSON Theme

rks — Fri, 05 Nov 2021 12:36:52 GMT

I wonder wheter one can set the default size as well?

Re: actionButton Power BI JSON Theme

Anonymous — Tue, 19 Dec 2023 08:51:18 GMT

Hi @jcarville @jkerski ,

I've got a doubt related JSON themes into Power BI, please help to guide me on that.

I have two JSON themes where in power Bi we could apply it to the dashbaords one after one. But I've got a requirement where The JSON's to be imported and used simulteneously using toggle switch. Please let me know how do I achive this?

Regards,

Haveesh