apply filters to power bi report using power bi javascript api

[GouthamPamula]

I'm applying custom  filters for power bi report  using some javascript code. but filters are not applying . Im getting powerbi report on browser without any filter.

I'm following Javascript code here :

below one is sample code which iam using .

<script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/jquery/dist/jquery.js"></script>
<script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/powerbi-client/dist/powerbi.js"></script>
<script type="text/javascript">
window.onload = function () {
    var models = window['powerbi-client'].models;
const basicFilter  = {
  $schema: "http://powerbi.com/product/schema#basic",
  target: {
    table: "TableName",
    column: "ColumnName"
  },
  operator: "In",
  values: ["Jr.Software"],
  filterType: models.FilterType.Basic,
  requireSingleSelection: true
}
var embedConfiguration = {
    type: 'report',
tokenType: models.TokenType.Embed,
    id: reportId,
    accessToken: '{myToken}',
    embedUrl: 'https://app.powerbi.com/view?{-------}&pageName=ReportSection',
 permissions: models.Permissions.All,
		filters:[basicFilter],
        settings: {
            filterPaneEnabled: true,
            navContentPaneEnabled: true
        }
};
var $reportContainer = $('#reportContainer');
var report = powerbi.embed($reportContainer.get(0), embedConfiguration);
report.updateFilters(models.FiltersOperations.Add,[basicFilter])
}
</script>

<div id="reportContainer"></div>
 

i need render power bi report with filters below like:

pls can anyone suggest where i have done mistake in above javascript code .
could you please provide any links .

thanks 
Goutham pamula

[Anonymous · Accepted solution]

Hi @GouthamPamula ,

You can refer the following links to get it:

Control report filters

Addling filter using javascript API (Power BI Service)

Embed your Power BI report with predefined filters

const filter = {
        $schema: "http://powerbi.com/product/schema#basic",
        target: {
            table: "DimProduct",
            column: "ColorName"
        },
        operator: "In",
        values: ["Silver"]
    };
var config = {
              type: 'report',
              tokenType: models.TokenType.Embed,
              accessToken: accessToken,
              embedUrl: embedUrl,
              id: embedReportId,
              permissions: models.Permissions.All,
              settings: {
                            filterPaneEnabled: true,
                            navContentPaneEnabled: true
              }
};
// Embed the report and display it within the div container.
var report = powerbi.embed(reportContainer, config);
report.on('loaded', event => {
        report.getFilters()
            .then(filters => {
                filters.push(filter);
                return report.setFilters(filters);
            });

Best Regards

[GouthamPamula]

Thank you for sharing the information