topic percentage in format options of custom visual in Developer

percentage in format options of custom visual

SonaliDhotre — Mon, 13 Dec 2021 12:27:26 GMT

I am creating a bar chart and I want to have a property in format page in percentage for Inner Padding between bars. Can anyone please help me with how to declare this in capebilities.json along with the visual setting?
It would be helpful if you can share any tutorials for the same.

Thank You.

Re: percentage in format options of custom visual

Anonymous — Mon, 13 Dec 2021 08:08:53 GMT

Hi @SonaliDhotre ,

If you create a bar chart using default bar chart, it can be achieved by the solution in the following threads.

How to Show Percentages in Power BI Bar or Column Chart

1. Create a measure to get the percentage
2. Put the measure onto Values field

Bar chart with data label percentage

Select a table visual instead of a graph.

Drag your category to the Axis

Drag sales twice to the Values field well.

Right click on the 1st sales values > Conditional formatting > Data bars.

Right click on the 2nd sales values > Show values as > Percentage of grand total.

I created a sample pbix file with creating default bar chart and unzipp the pbix file. I didn't find a specific property in the theme file to set the percentage display. Maybe you can try to contact custom visual support for professional help.

Best Regards

Re: percentage in format options of custom visual

SonaliDhotre — Mon, 13 Dec 2021 12:26:58 GMT

Hey @Anonymous,
sorry for not being earlier but I think you misunderstood the use case.

I want to have the following property in the Format pane for my custom visual. Can you please help me with this?

Re: percentage in format options of custom visual

dm-p — Mon, 13 Dec 2021 21:45:35 GMT

Hi @SonaliDhotre,

Percentage sliders are only available in special cases for reserved names, and these are not documented anywhere (despite it being a common ask).

That being said, you should be able to manage this particular case by naming it innerPadding with a type of integer - the naming has to be exactly right, including case.

In capabilities.json:

.... "innerPadding": { "displayName": "Inner Padding", "type": { "integer": true } }, ....

And you need to instantiate the property in the approprate settings class property with an initial value between 1 and 100.

This will then show as desired in the properties pane:

For these properties (if you can find them), the property pane validation and enumeration is handled by the main window.

Regards,

Daniel