Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

July 7 - July 17 | Round 2 of the Power BI Dataviz World Championships. Don't miss your chance! Learn more

Reply
spandl
Helper I
Helper I

Working example for new format pane

Hello,

 

I am looking for a full example of the new format pane.

https://learn.microsoft.com/en-us/power-bi/developer/visuals/format-pane

 

With the documentation in the help section, I am able to create and configure the new format pane, but I am somehow unsure how to read the updated values. The function `getFormattingModel` seems to return always the default settings, but I am sure I simply implemented it the wrong way.

 

Seeing a complete integration would certainly help.

 

Thanks

ralph

 

3 REPLIES 3
spandl
Helper I
Helper I

I did find a working example in this branch:

https://github.com/microsoft/PowerBI-visuals-sampleBarChart/tree/barChartTutorial

 

The code sample is quite different from the code in the tutorial.

I will digg a bit deeper here and report back.

dm-p
Super User
Super User

Hi @spandl,

The getFormattingModel() method is used to customise the format layout. You still need to parse the data view when your visual updates so that these values are read and exposed.

Previously, you would typically call VisualSettings.parse() on your data view in the update() method, and this is  typically what's included in the visual when you run pbiviz new.

If you're using powerbi-visuals-utils-formattingmodel to use the new layout then this has a helper method - populateFormattingSettingsModel() - which can be used instead, although the 'legacy' way still should work fine (I added formatting cards to one of my visuals prior to the new doc being made available, and this works fine, but I wouldn't recommend you follow my example and try and do everything using the supplied doc and libraries).

I'd recommend looking at the revised tutorial, which includes the new formatting pane, specifically step 11.

If you've tried this, then it's probably better if you share the relevant parts of your code (including your capabilities) so we can have a look and see if there's anything that sticks out.

Good luck!

Daniel





Did I answer your question? Mark my post as a solution!

Proud to be a Super User!


On how to ask a technical question, if you really want an answer (courtesy of SQLBI)




Thank-You Daniel!

Indeed, I missed step 2 in the new tutorial!

I installed the sample chart with `pbiviz new CircleCard` and checked the Github code. As this sample was still the old version, I didn't continue. My fault.

 

The tutorial example pretty much matches what I had in the past.

However, when I call 

```

this.visualSettings = this.formattingSettingsService.populateFormattingSettingsModel(VisualSettings, dataView);
```
 
`this.visualSettings` is always populated with the default values, even if I cange circle thickness to another value, this always returns the initial value 2.
 
Does this ring a bell?
Otherwise I will review my code and try to be more specific.
 
Thanks.

 

Helpful resources

Announcements
FabCon and SQLCon Barcelona 2026

FabCon & SQLCon – Barcelona 2026

Join us in Barcelona for FabCon and SQLCon, the Fabric, Power BI, SQL, and AI community event. Save €200 with code FABCMTY200.

60 days of Data Days Carousel

Data Days 2026

Join Data Days 2026: 60 days of free live/on-demand sessions, challenges, study groups, and certification opportunities.

Power BI DataViz World Championships carousel

Power BI DataViz World Championships - June 2026

A new Power BI DataViz World Championship is coming this June! Don't miss out on submitting your entry.

Top Solution Authors