Reply
Frequent Visitor
Posts: 3
Registered: ‎10-09-2018

Chiclet Slicer / Themes JSON Edits

Is there currently a way to code a JSON theme file to adjust the default behavior for a chiclet slicer? My JSON file sets global visual styles (title) that are not applied to the chiclet slicers.

 

I've also tried using "chicletSlicer" to adjust the theme at the visual level, but have not been able to adjust the defaults.

 

 

Moderator
Posts: 1,610
Registered: ‎12-02-2016

Re: Chiclet Slicer / Themes JSON Edits

Can you share what Chiclet Slicer styles you wanna customize?

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Frequent Visitor
Posts: 3
Registered: ‎10-09-2018

Re: Chiclet Slicer / Themes JSON Edits

I was hoping to do something like the below code to edit the default orientation, number of rows, title style and font.

 

      "ChicletSlicerProps":{ 
         "general":{ 
            "orientation":"Horizontal",
            "rows":5
         },
         "header":{ 
            "title":[ 
               { 
                  "show":true,
                  "fontColor":{ 
                     "solid":{ 
                        "color":"#0F0F0F"
                     }
                  },
                  "background":{ 
                     "solid":{ 
                        "color":"#E0E0E0"
                     }
                  },
                  "alignment":"left",
                  "fontSize":10,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif"
               }
            ]
         }

Moderator
Posts: 1,610
Registered: ‎12-02-2016

Re: Chiclet Slicer / Themes JSON Edits

Does it work? If not, please share the whole Power BI Theme file to check it out from our side.

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Frequent Visitor
Posts: 3
Registered: ‎10-09-2018

Re: Chiclet Slicer / Themes JSON Edits

This theme worked with the exception of the Chiclet slicer formatting. 

{  
   "name":"Gray Title Bars",
   "background":"#FFFFFF",
   "foreground":"#0F0F0F",
   "tableAccent":"#0F0F0F",
   "dataColors":[  
      "#00A8FF",
      "#FF8100",
      "#6200FF"
   ],
   "visualStyles":{  
      "*":{  
         "*":{  
            "title":[  
               {  
                  "show":true,
                  "fontColor":{  
                     "solid":{  
                        "color":"#0F0F0F"
                     }
                  },
                  "background":{  
                     "solid":{  
                        "color":"#E0E0E0"
                     }
                  },
                  "alignment":"left",
                  "fontSize":10,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif"
               }
            ],
            "background":[  
               {  
                  "show":false,
                  "color":{  
                     "solid":{  
                        "color":"#ffffff"
                     }
                  },
                  "transparency":50
               }
            ],
            "lockAspect":[  
               {  
                  "show":true
               }
            ],
            "border":[  
               {  
                  "show":false,
                  "color":{  
                     "solid":{  
                        "color":"#ffffff"
                     }
                  }
               }
            ],
            "visualTooltip":[  
               {  
                  "type":"Default"
               }
            ],
            "stylePreset":[  
               {  
                  "name":"Minimal"
               }
            ]
         }
      },
      "page":{  
         "*":{  
            "background":[  
               {  
                  "color":{  
                     "solid":{  
                        "color":"#ffffff"
                     }
                  },
                  "transparency":100
               }
            ],
            "outspace":[  
               {  
                  "color":{  
                     "solid":{  
                        "color":"#ffffff"
                     }
                  },
                  "transparency":0
               }
            ]
         }
      },
      "tableEx":{  
         "*":{  
            "grid":[  
               {  
                  "gridVertical":false,
                  "gridHorizontal":false,
                  "rowPadding":3,
                  "outlineColor":{  
                     "solid":{  
                        "color":"#0f0f0f"
                     }
                  },
                  "outlineWeight":1,
                  "textSize":8
               }
            ],
            "title":[  
               {  
                  "show":true,
                  "fontColor":{  
                     "solid":{  
                        "color":"#0F0F0F"
                     }
                  },
                  "background":{  
                     "solid":{  
                        "color":"#E0E0E0"
                     }
                  },
                  "alignment":"left",
                  "fontSize":10,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif"
               }
            ],
            "columnHeaders":[  
               {  
                  "fontColor":{  
                     "solid":{  
                        "color":"#0f0f0f"
                     }
                  },
                  "backColor":{  
                     "solid":{  
                        "color":"#e0e0e0"
                     }
                  },
                  "autoSizeColumnWidth":true,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif",
                  "fontSize":8
               }
            ],
            "total":[  
               {  
                  "fontColor":{  
                     "solid":{  
                        "color":"#0f0f0f"
                     }
                  },
                  "backColor":{  
                     "solid":{  
                        "color":"#e0e0e0"
                     }
                  },
                  "autoSizeColumnWidth":true,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif",
                  "fontSize":8
               }
            ]
         }
      },
      "pivotTable":{  
         "*":{  
            "grid":[  
               {  
                  "gridVertical":false,
                  "gridHorizontal":false,
                  "rowPadding":3,
                  "outlineColor":{  
                     "solid":{  
                        "color":"#0f0f0f"
                     }
                  },
                  "outlineWeight":1,
                  "textSize":8
               }
            ],
            "title":[  
               {  
                  "show":true,
                  "fontColor":{  
                     "solid":{  
                        "color":"#0F0F0F"
                     }
                  },
                  "background":{  
                     "solid":{  
                        "color":"#E0E0E0"
                     }
                  },
                  "alignment":"left",
                  "fontSize":10,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif"
               }
            ],
            "columnHeaders":[  
               {  
                  "fontColor":{  
                     "solid":{  
                        "color":"#0f0f0f"
                     }
                  },
                  "backColor":{  
                     "solid":{  
                        "color":"#e0e0e0"
                     }
                  },
                  "autoSizeColumnWidth":true,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif",
                  "fontSize":8
               }
            ],
            "total":[  
               {  
                  "fontColor":{  
                     "solid":{  
                        "color":"#0f0f0f"
                     }
                  },
                  "backColor":{  
                     "solid":{  
                        "color":"#e0e0e0"
                     }
                  },
                  "autoSizeColumnWidth":true,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif",
                  "fontSize":8
               }
            ]
         }
      },

      "ChicletSlicerProps":{  
         "general":{  
            "orientation":"Horizontal",
            "rows":5
         },
         "header":{  
            "title":[  
               {  
                  "show":true,
                  "fontColor":{  
                     "solid":{  
                        "color":"#0F0F0F"
                     }
                  },
                  "background":{  
                     "solid":{  
                        "color":"#E0E0E0"
                     }
                  },
                  "alignment":"left",
                  "fontSize":10,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif"
               }
            ]
         }
      },
      "slicer":{  
         "*":{  
            "header":[  
               {  
                  "show":true,
                  "fontColor":{  
                     "solid":{  
                        "color":"#007EBF"
                     }
                  },
                  "alignment":"left",
                  "textSize":10,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif"
               }
            ],
            "items":[  
               {  
                  "fontColor":{  
                     "solid":{  
                        "color":"#0f0f0f"
                     }
                  },
                  "outline":"None",
                  "textSize":9,
                  "fontFamily":"Segoe UI"
               }
            ]
         }
      },
      "scatterChart":{  
         "*":{  
            "categoryAxis":[  
               {  
                  "show":true,
                  "labelColor":{  
                     "solid":{  
                        "color":"#0F0F0F"
                     }
                  },
                  "fontSize":8,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif",
                  "titleColor":{  
                     "solid":{  
                        "color":"#0F0F0F"
                     }
                  },
                  "titleFontSize":8,
                  "titleFontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif"
               }
            ],
            "valueAxis":[  
               {  
                  "show":true,
                  "labelColor":{  
                     "solid":{  
                        "color":"#0f0f0f"
                     }
                  },
                  "fontSize":8,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif",
                  "titleColor":{  
                     "solid":{  
                        "color":"#0f0f0f"
                     }
                  },
                  "titleFontSize":8,
                  "titleFontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif"
               }
            ]
         }
      }
   }
}
Moderator
Posts: 1,610
Registered: ‎12-02-2016

Re: Chiclet Slicer / Themes JSON Edits

[ Edited ]

ChicletSlicerProps must be renamed to ChicletSlicer1448559807354

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Regular Visitor
Posts: 23
Registered: ‎10-07-2018

Re: Chiclet Slicer / Themes JSON Edits

I am having same issue, and it is not working after rename eather.

 

		"ChicletSlicer1448559807354": {
			"*": {
				"general": {
						"orientation": "Vertical",
						"multiselect": false,
						"forcedSelection": false
					},
				"rows": [{
						"fontColor": {
							"solid": {
								"color": "#ffffff"
							}
						},
						"textSize": 8,
						"height":22,
						"width":84,
						"selectedColor": {
							"solid": {
								"color": "#000000"
							}
						},
						"hoverColor": {
							"solid": {
								"color": "#808080"
							}
						},
						"unselectedColor": {
							"solid": {
								"color": "#b3b3b3"
							}
						},
						"outlineWeight":1,
						"padding":1,
						"borderStyle":"Cut"
						
						
					}
				]
			}
		}
Moderator
Posts: 1,610
Registered: ‎12-02-2016

Re: Chiclet Slicer / Themes JSON Edits

Were any options applied? What verison of Power BI Desktop did you use?

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Regular Visitor
Posts: 23
Registered: ‎10-07-2018

Re: Chiclet Slicer / Themes JSON Edits

I am using OCtober 2018 eidtiton of PBI desktpop and there are no options selected. There is also bug how visual is interacting with colors defined in my theme

 

chicet.gif 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

So far i have managed to set up each visual from my JSON theme file except Chiclet Slicer and Power KPI. Here is entire file:

{
	"name": "Tamedia V4",
	"dataColors": ["#000000","#00fac3", "#00d39a", "#4e4a46", "#fdcb00", "#fff500", "#d20052", "#ff0050", "#F5f5f4"],
	"background": "#FFFFFF",
	"foreground": "#666666",
	"tableAccent": "#999999", 

	"visualStyles": {
		"*": {
			"*": {
				"*": [{
						"responsive": true,
						"wordWrap": true,
						"wordWrap": true,
						"fontFamily": "Arial",
						"fontSize": 10

					}
				],
				"labels": [{
						"show": true,
						"fontSize": 9,
						"color": {
							"solid": {
								"color": "#000000"
							}
						},
						"labelOrientation": "horizontal"
					}
				],
				"categoryAxis": [{
						"showAxisTitle": true,
						"labelColor": {
							"solid": {
								"color": "#000000"
							}
						}
					}
				],
				"valueAxis": [{
						"showAxisTitle": true,
						"labelColor": {
							"solid": {
								"color": "#000000"
							}
						}
					}
				],
				"title": [{
						"show": true,
						"fontSize": 9,
						"fontColor": {
							"solid": {
								"color": "#000000"
							}
						}
					}
				],
				"legend": [{
						"labelColor": {
							"solid": {
								"color": "#000000"
							}
						}
					}
				]
			}
		},
		"lineClusteredColumnComboChart": {
			"*": {
				"labels": [{
						"show": true,
						"fontSize": 9,
						"labelOrientation": "vertical",
						"enableBackground": true,
						"backgroundColor": { "solid": { "color": "#ffffff"}},
						"backgroundTransparency": 20
					}
				],
				"legend": [{
						"show": false
					}
				],
				"valueAxis": [{
						"show": false,
						"showAxisTitle": false
					}
				],
				"categoryAxis": [{
						"show": true,
						"showAxisTitle": false
					}
				]	
			}
		},
		"lineChart": {
			"*": {
				"legend": [{
						"legendMarkerRendering": "lineAndMarker"
					}
				],
				"lineStyles": [{
						"showMarker": false,
						"showSeries": true
					}
				],
				"labels": [{
						"show": true,
						"fontSize": 9
					}
				],
				"dataLabels": [{
						"show": true
					}
				]
			}
		},
		"clusteredBarChart": {
			"*": {
				"labels": [{
						"show": true,
						"fontSize": 9
					}
				],
				"dataLabels": [{
						"show": true
					}
				],
				"categoryLabels": [{
						"show": true
					}
				],
				"categoryAxis": [{
						"axisType": "Categorical"
					}
				]
			}
		},
		"clusteredColumnChart": {
			"*": {
				"labels": [{
						"show": true,
						"fontSize": 9,
						"labelOrientation": "vertical",
						"enableBackground": true,
						"backgroundColor": { "solid": { "color": "#ffffff"}},
						"backgroundTransparency": 20
					}
				],
				"categoryLabels": [{
						"show": true
					}
				],
				"categoryAxis": [{
						"axisType": "Categorical"
					}
				]
			}
		},
		"kpi17922CFD0D3E4D33B4D8C3EB36C178D7_OrgStore": {
			"*": {
				"nameSettings": [{
						"valueName": "",
						"nameFontSize": "8",
						"nameFontFamily": "Arial"
					}
				],
				"valueSettings": [{
						"valueFontSize": "24",
						"valueUnit": "Thousend",
						"valueUnitFlag": false,
						"valuePrecision": "1",
						"valueFontFamily": "Arial"
					}
				],
				"planSettings": [{
						"planFontSize": "10",
						"planUnit": "Thousend",
						"planUnitFlag": false,
						"planPrecision": "1",
						"planPercentPrecision": "0",
						"planFontFamily": "Arial"
					}
				],
				"lastSettings": [{
						"lastFontSize": "10",
						"lastUnit": "Thousend",
						"lastUnitFlag": false,
						"lastPrecision": "1",
						"lastPercentPrecision": "0",
						"lastFontFamily": "Arial"
					}
				],
				"arrowSettings": [{
						"negativeFlag": false,
						"arrowSize": 12
					}
				],
				"renderGroup": [{
						"commaSettingShow": false
					}
				],
				"title": [{
						"show": true,
						"alignment": "left",
						"fontSize": 9,
						"fontFamily": "Arial"
					}
				],
				"background": [{
						"show": false
					}
				],
				"lockAspect": [{
						"show": false
					}
				],
				"border": [{
						"show": false
					}
				]
			}
		},
		"stackedChart6B1A1115A38741C7B49B956F1C12C623_OrgStore": {
			"*": {
				"dataPoint": [{
						"defaultColor": {
							"solid": {
								"color": "#D3D3D3"
							}
						},
						"showAllDataPoints": false
					}
				],
				"dataPointStroke": [{
						"defaultColor": {
							"solid": {
								"color": "#A9A9A9"
							}
						},
						"showAllDataPoints": false
					}
				],
				"dataPointLabel": [{
						"defaultColor": {
							"solid": {
								"color": "#000000"
							}
						},
						"showAllDataPoints": false
					}
				],
				"axis": [{
						"show": false,
						"fontFamily": "Arial",
						"color": {
							"solid": {
								"color": "#000000"
							}
						},
						"fontSize": 10
					}
				],
				"labels": [{

						"show": true,
						"fontFamily": "Arial",
						"color": {
							"solid": {
								"color": "#000000"
							}
						},
						"fontSize": 8,
						"paddingSize": 20
					}
				],
				"columnlabels": [{

						"show": true,
						"fontFamily": "Arial",
						"color": {
							"solid": {
								"color": "#000000"
							}
						},
						"fontSize": 8,
						"paddingSize": 20,
						"columnLabelDataUnit": "Thousend",
						"unitFlag": true,
						"columnLabelDataPrecision": "1"

					}
				],
				"smallmultiplelabels": [{

						"show": true,
						"fontFamily": "Arial",
						"color": {
							"solid": {
								"color": "#000000"
							}
						},
						"fontSize": 8
					}
				],
				"renderGroup": [{

						"renderFullPart": true,
						"renderOthers": false,
						"renderOthersPercent": 5,
						"renderOverflow": false,
						"commaSettingShow": false,
						"decimalSymbol": ".",
						"digitGroupingSymbol": ","
					}
				],
				"title": [{
						"show": true,
						"fontColor": {
							"solid": {
								"color": "#000000"
							}
						},
						"background": {
							"solid": {
								"color": "#FFFFFF"
							}
						},
						"alignment": "left",
						"fontSize": 9,
						"fontFamily": "Arial"
					}
				],
				"background": [{
						"show": false,
						"color": {
							"solid": {
								"color": "#FFFFFF"
							}
						},
						"transparency": 50
					}
				],
				"border": [{
						"show": false,
						"color": {
							"solid": {
								"color": "#000000"
							}
						}
					}
				]
			}
		},
		"pivotTable": {
			"*": {
				"grid": [{
						"gridVertical": false,
						"gridHorizontalColor": {
							"solid": {
								"color": "#E7E7E7"
							}
						},
						"rowPadding": 6,
						"outlineColor": {
							"solid": {
								"color": "#b3b3b3"
							}
						},
						"outlineWeight": 2,
						"textSize": 8
					}
				],
				"columnHeaders": [{
						"gridAlignment": "Right"
					}
				],
				"values": [{
						"valuesOnRow": true
					}
					
				],				
				"subTotals": [{
						"columnSubtotals": false,
						"textSize": 8
					}
					
				],
				"total": [{
						"textSize": 8
					}
				]	
				
			}
		},
		"tableEx": {
			"*": {
				"grid": [{
						"gridVertical": false,
						"gridHorizontalColor": {
							"solid": {
								"color": "#E7E7E7"
							}
						},
						"rowPadding": 6,
						"outlineColor": {
							"solid": {
								"color": "#b3b3b3"
							}
						},
						"outlineWeight": 2,
						"textSize": 8
					}
				],
				"columnHeaders": [{
						"gridAlignment": "Right"
					}
				],
				"values": [{
						"valuesOnRow": true
					}
					
				],				
				"subTotals": [{
						"columnSubtotals": false,
						"textSize": 8
					}
					
				],
				"total": [{
						"textSize": 8
					}
				]	
				
			}
		},			
		"powerKPI462CE5C2666F4EC8A8BDD7E5587320A3": {
			"*": {
				"kpiIndicatorProperties": [{
						"show": false,
						"fontSize": 11
					}
				],
				"dataLabelSettings": [{
						"units": "K",
						"showUnits": "2"
					}
				]
			}
		},			
		"ChicletSlicer1448559807354": {
			"*": {
				"general": {
						"orientation": "Horizontal",
						"multiselect": false,
						"forcedSelection": false
					},
				"rows": [{
						"fontColor": {
							"solid": {
								"color": "#ffffff"
							}
						},
						"textSize": 8,
						"height":22,
						"width":84,
						"selectedColor": {
							"solid": {
								"color": "#000000"
							}
						},
						"hoverColor": {
							"solid": {
								"color": "#808080"
							}
						},
						"unselectedColor": {
							"solid": {
								"color": "#b3b3b3"
							}
						},
						"outlineWeight":1,
						"padding":1,
						"borderStyle":"Cut"
						
						
					}
				]
			}
		},

      "ChicletSlicer1448559807354":{  
         "general":{  
            "orientation":"Horizontal",
            "rows":5
         },
         "header":{  
            "title":[  
               {  
                  "show":true,
                  "fontColor":{  
                     "solid":{  
                        "color":"#0F0F0F"
                     }
                  },
                  "background":{  
                     "solid":{  
                        "color":"#E0E0E0"
                     }
                  },
                  "alignment":"left",
                  "fontSize":10,
                  "fontFamily":"'Segoe UI Bold', wf_segoe-ui_bold, helvetica, arial, sans-serif"
               }
            ]
         }
      }
	}
}

 

Moderator
Posts: 1,610
Registered: ‎12-02-2016

Re: Chiclet Slicer / Themes JSON Edits

[ Edited ]

This is known issue that we will resolved pretty soon.

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com