Filter Chart using JavaScript API

[skancharla]

Hi,

I have a created a chart from desktop and integrated to our application .Now I'm trying to filter the chart with JavaScript API filters using this reference.

Downloaded the required power bi models from npm version and included the .js , .ts files. But still seeing error that pbi/models/IBasic filter is not defined.

Tried both the below ways of constructing filters but no luck. I see that for the models ,typescripting is used to which I'm new.

Any Help or direction to resolve this would be appreciated.

Thanks.

const advancedFilter = new pbi.models.AdvancedFilter({

const basicFilter: pbi.models.IBasicFilter = {
  $schema: "http://powerbi.com/product/schema#basic",
  target: {
    table: "Store",
    column: "Count"
  },
  operator: "In",
  values: [1,2,3,4]
}

[Eric_Zhang]

@skancharla

Make sure you've add the script reference in the html page.

 <script src="https://microsoft.github.io/PowerBI-JavaScript/demo/bower_components/powerbi-client/dist/powerbi.js"></script>

Also you can try below sample, which actually works in my test.

 var  Filter = {
   $schema: "http://powerbi.com/product/schema#advanced",
  target: {
    table: "Sales CountryRegionCurrency",
    column: "CountryRegionCode"
  },
  logicalOperator: "OR",
  conditions: [
    {
      operator: "Contains",
      value: "CN"
    },
    {
      operator: "Contains",
      value: "CO"
    }
  ]
}
 

var embedConfiguration = {
    type: 'report',
    accessToken: 'xxxxx',
    id: '94da70b0xxxxxx-86bb8a2b9c18',
    embedUrl: 'https://embedded.powerbi.com/appTokenReportEmbed?reportId=94da70bxxxxxx8a2b9c18',

}; 
 

var $reportContainer = $('#reportContainer');
 
var report = powerbi.embed($reportContainer.get(0), embedConfiguration);

<!--validateReportLoad incorrectly returns schema errors for valid filters #16https://github.com/Microsoft/powerbi-models/issues/16-->

report.on('loaded', event => {
  report.getFilters()
    .then(filters => {
      filters.push(Filter);
      return report.setFilters(filters);
    });
});

[skancharla]

Thanks  @Eric_Zhang. I'm able to fix the filter undefined error .But still filter is not getting applied.

Receiving below error in the console when setFilter is called.

Uncaught (in promise)  Message:"This feature is not supported for Publish To Web."

Is it anything to do with the way the report is published.

[Eric_Zhang · Accepted solution]

@skancharla

I thought you'were embedding the report via Power BI REST API. If via "Publish to web", then it may, as the message indicats, not be supported. Try via Power BI REST API instead.

 

[skancharla]

Thanks @Eric_Zhang.

I'm able to get it work with PowerBI Embedded.

[ggww]

Hi 

I used the following code and it is not working,  any suggestions? 

var report = powerbi.embed(reportContainer, config);

var filter = {
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "customers",
column: "CustomerID"
},
operator: "Is",
values: "1234" //,
};

//report.removeFilters();
report.setFilters([filter]);

thansk heaps..

[ggww]

Hi 

I used the following code and it is not working,  any suggestions? 

var report = powerbi.embed(reportContainer, config);

var filter = {
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "customers",
column: "CustomerID"
},
operator: "Is",
values: "1234" //,
};

//report.removeFilters();
report.setFilters([filter]);

thansk heaps..