March 31 - April 2, 2025, in Las Vegas, Nevada. Use code MSCUST for a $150 discount! Early bird discount ends December 31.
Register NowBe one of the first to start using Fabric Databases. View on-demand sessions with database experts and the Microsoft product team to learn just how easy it is to get started. Watch now
While modifying an existing bullet chart visual, I want to give the user the option to change font for the Category fields. I've added the format option in the capabilities.json file, and also the settings.ts file. Additionally, I've set the attribute "font-family" to the newly created setting using: .attr("font-family", model.settings.labels.fontFamily), however, the font change does not show in the visual.
I noticed that there's a font family selection in the built-in format item for the "Title" format object. Thinking I could just replicate the existing logic, I scoured the JS and TS files in the package, and cannot locate it.
How can I implement this functionality?
Solved! Go to Solution.
Hi @jazfunk,
Whe you say the font change doesn't show in the visual, is then when packaged or using the developer visual?
If you're testing on a packaged visual that's in AppSource already, Power BI will always load that one, unless you have enabled developer mode in Power BI Desktop, which will temporarily allow you to load the local version as long as the file is open for that session.
If you want this change to be more permanent, you will need to change the guid property in pbiviz.json to a new ID that does not exist in AppSource, so Power BI will not load that one. Note that this is now effectively a new visual as far as Power BI is concerend, so if the original visual is certified then you will not get these benefits.
If you're experiencing the issue in the developer visual, please provide the full details of all changes made, as well as the visual you're extending from, as the information in the question does not provide enough detail for me to debug this reliably for you.
Regarding not being able to find the title font family, the title property menu applies to the visual container and is outside the control of the developer. Anything that customises the visual container and sits 'above' the iframe in the visual's DOM is handled by Power BI and ss such, they are automatically included by Power BI and it's not possible to inspect or extend them. The same applies for the following items:
If you want to add a picker for font family, you can use the formatting type for your desired property in your capabilities.json with fontFamily set to true, e.g.:
...
"type": {
"formatting": { "fontFamily": true }
}
...
Here's the part of the visuals API that is relevant to your challenge - you'll be able to see the other supported pre-defined formatting types here also.
Regads,
Daniel
Proud to be a Super User!
My course: Introduction to Developing Power BI Visuals
On how to ask a technical question, if you really want an answer (courtesy of SQLBI)
Hi @jazfunk,
Whe you say the font change doesn't show in the visual, is then when packaged or using the developer visual?
If you're testing on a packaged visual that's in AppSource already, Power BI will always load that one, unless you have enabled developer mode in Power BI Desktop, which will temporarily allow you to load the local version as long as the file is open for that session.
If you want this change to be more permanent, you will need to change the guid property in pbiviz.json to a new ID that does not exist in AppSource, so Power BI will not load that one. Note that this is now effectively a new visual as far as Power BI is concerend, so if the original visual is certified then you will not get these benefits.
If you're experiencing the issue in the developer visual, please provide the full details of all changes made, as well as the visual you're extending from, as the information in the question does not provide enough detail for me to debug this reliably for you.
Regarding not being able to find the title font family, the title property menu applies to the visual container and is outside the control of the developer. Anything that customises the visual container and sits 'above' the iframe in the visual's DOM is handled by Power BI and ss such, they are automatically included by Power BI and it's not possible to inspect or extend them. The same applies for the following items:
If you want to add a picker for font family, you can use the formatting type for your desired property in your capabilities.json with fontFamily set to true, e.g.:
...
"type": {
"formatting": { "fontFamily": true }
}
...
Here's the part of the visuals API that is relevant to your challenge - you'll be able to see the other supported pre-defined formatting types here also.
Regads,
Daniel
Proud to be a Super User!
My course: Introduction to Developing Power BI Visuals
On how to ask a technical question, if you really want an answer (courtesy of SQLBI)
Daniel,
I solved the problem by figuring out that I was setting the font formatting style in the wrong method. I am now able to change the font family style for the category labels, and it shows as such in the visual.
Thank you for your detailed explanation. I had already been able to assign a new, unique "guid" and my visual works both in PowerBI service, and Desktop.
Jeff.
March 31 - April 2, 2025, in Las Vegas, Nevada. Use code MSCUST for a $150 discount!
Your insights matter. That’s why we created a quick survey to learn about your experience finding answers to technical questions.
Arun Ulag shares exciting details about the Microsoft Fabric Conference 2025, which will be held in Las Vegas, NV.
User | Count |
---|---|
7 | |
3 | |
2 | |
1 | |
1 |