Forum Discussion

skancharla's avatar
skancharla
Advocate II
9 years ago
Solved

Filter Chart using JavaScript API

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]
}

 

Need Help
  • Eric_Zhang's avatar
    Eric_Zhang
    9 years ago

    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.

     

6 Replies

  • Eric_Zhang's avatar
    Eric_Zhang
    Microsoft Employee
    9 years ago

    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's avatar
      skancharla
      Advocate II
      9 years ago

      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's avatar
        Eric_Zhang
        Microsoft Employee
        9 years ago

        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.