Embed Power BI on React App with filters coming from inputs from the react application

[pedro3]

Hey guys. I have a question about embedding a power bi on react application. I was able tosuccessfully embed some reports on my react application but I was wondering if I could have custom filters (like specific dates or data source) on my application and send them to powerBI so they can update the reports based on the filters I select on my react application. Is this possible? How would I go about doing this? Observation (I embedded the reports using powerbi-client-react)

[Anonymous]

Hi @pedro3 ,

You can refer the following links to get it:

Embed PowerBI reports in React application

const report = powerbi.embed(reportContainer, embedConfiguration);
report.off("loaded");
report.on("loaded", function () {
const existingFilters = report.getFilters()
.then(function(response) {
const newFiltersArr = [...response, countryFilter];
report.setFilters(newFiltersArr);
});
});

How To Embed Microsoft Power BI Charts Into Your React Application

Embedded Report add filter to EmbedConfig

    var config = {
        type: 'report',
        tokenType: models.TokenType.Embed,
        accessToken: accessToken,
        embedUrl: embedUrl,
        id: embedReportId,
        permissions: models.Permissions.Read,
        filters: [filter1,filter2], //filter array here
        settings: {
            filterPaneEnabled: true,
            navContentPaneEnabled: false
           
        }
    };

Best Regards