Can I get rid of the grey border on the report visuals with power bi embedded

0 votes
Can I get rid of the grey border i get when i render report visuals with power bi embedded? If so, how?
Apr 10, 2019 in Power BI by Upasana
• 8,620 points
7,050 views

2 answers to this question.

0 votes

You can do the following to make the background transparent and also Fit To Width.

                var embedConfig = {
                    type: type,
                    id: id,
                    embedUrl: embedUrl,
                    viewMode: getViewModeFromModel(viewMode),
                    tokenType: models.TokenType.Aad,
                    accessToken: token,
                    pageView: 'fitToWidth', // applies to Dashboard only; for Report, see below
                    pageName: pageName,

                    // See https://microsoft.github.io/PowerBI-JavaScript/interfaces/_node_modules_powerbi_models_dist_models_d_.isettings.html
                    settings: {
                        filterPaneEnabled: true,
                        navContentPaneEnabled: true,
                        background: models.BackgroundType.Transparent,
                        // START Report specific settings
                        layoutType: models.LayoutType.Custom,
                        customLayout: {
                            displayOption: models.DisplayOption.FitToWidth
                        }
                        // END Report specific settings
                    }
                }
answered Apr 10, 2019 by Shubham
• 13,490 points
+1 vote
It's just a simple css code to remove border from generated iframe by powerbi. It worked perfectly for me

<style>
  iframe {  border: none; }
</style>
answered Apr 19, 2020 by Prateek Mehta
how do you do that if you're using the embed config?

Hey, @Binh,

For a transparent background, you can use the embed config:

By default, the report background is white with gray margins. If the default background does not look good into your application, use transparent background settings as follows:

let embedConfig = {
    ...
    settings: {
	background: models.BackgroundType.Transparent
    }
};

This way, You can give any style you want to the container div element, the report background will be transparent and the container div element will appear.

I hope this explanation will help you.

Thanks for the reply! I tried that and it keep through this error "Uncaught ReferenceError: models is not defined". Is "models" suppose to be an instant that I need to create, if so, what is models an instant of? Fyi, I have the embed config in a visualforce page and added the PBI Javascript library as a static resource for that page.

Related Questions In Power BI

0 votes
1 answer

How can I reduce the size of a Power BI file (PBIX) when working with large datasets?

Here are the most common ways to ...READ MORE

answered Dec 18, 2024 in Power BI by anonymous
• 3,020 points

edited Mar 6 843 views
+1 vote
1 answer

How can I fix issues with Power BI visuals not resizing properly when viewed on different screen resolutions or devices?

In order to solve the problems associated ...READ MORE

answered Nov 11, 2024 in Power BI by pooja
• 24,450 points
1,091 views
0 votes
2 answers

How can I set up cascading slicers in Power BI, where one slicer’s options depend on the selection of another?

Use the dependent slicers by making a ...READ MORE

answered Jan 23 in Power BI by anonymous
• 24,450 points
870 views
+1 vote
2 answers

What techniques can you use to optimize Power BI’s performance when dealing with a large number of visuals on a single report page?

Reduce the number of visuals, use optimized ...READ MORE

answered Feb 28 in Power BI by anonymous
• 3,020 points
684 views
+1 vote
1 answer
0 votes
2 answers
0 votes
1 answer

Embed URL-multiple filters in Power BI

With the release of 2.0.0 you can ...READ MORE

answered Oct 16, 2018 in Power BI by Annie97
• 2,160 points
4,550 views
0 votes
1 answer

Passing a parameter to Power BI Embedded via embedded URL

Add the following to the end of ...READ MORE

answered Oct 23, 2018 in Power BI by Annie97
• 2,160 points
5,489 views
0 votes
1 answer

powerbi embeded in .net core 1.1

See if it helps: https://www.nuget.org/packages/PowerBI.NetStandar ...READ MORE

answered Nov 28, 2018 in Power BI by Upasana
• 8,620 points
2,222 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP