在 PowerBI 嵌入中单击条形图上的事件处理程序

Question

我可以使用 npm 的

power-bi-embed

包将 Power BI 报告嵌入到 Angular 应用程序中。

我有一个条形图，其中 Y 轴有计数，X 轴有区域。我如何知道用户正在点击哪个区域的栏。

我已尝试使用this文档中提到的相关事件处理程序。

export class AppComponent implements OnInit {
  title = 'powerbi-embed';

  reportConfig: IReportEmbedConfiguration = {
    type: 'report',
    embedUrl: '',
    tokenType: models.TokenType.Aad,
    accessToken: '',
    settings: {
      panes: {
        filters: {
          expanded: false,
          visible: false,
        },
      },
      background: models.BackgroundType.Transparent,
    },
  };
  @ViewChild(PowerBIReportEmbedComponent)
  reportObj!: PowerBIReportEmbedComponent;
  eventHandlersMap = new Map([
    [
      'loaded',
      () => {
        const report = this.reportObj.getReport();
        report.setComponentTitle('Embedded report');
      },
    ],
    ['rendered', (event: any) => console.log('Report has rendered:', event)],
    [
      'error',
      (event?: service.ICustomEvent<any>) => {
        if (event) {
          console.error(event.detail);
        }
      },
    ],
    ['visualClicked', (event) => console.log('Visual clicked:', event)],
    ['pageChanged', (event) => console.log('Page chnaged:', event)],
    ['buttonClicked', (event) => console.log('Button clicked:', event)],
    ['commandTriggered', (event) => console.log('Command triggered:', event)],
    ['dataHyperlinkClicked', (event) => console.log('Hyperlink clicked:', event)],
    ['dataSelected', (event) => console.log('Data selected:', event)],
    ['dataHyperlinkClicked', (event) => console.log('Hyperlink clicked:', event)],
    ['info', (event) => console.log('Tile clicked:', event)]
  ]) as Map<
    string,
    (event?: service.ICustomEvent<any>, embeddedEntity?: Embed) => void | null
  >;

  constructor() {}

  ngOnInit() {
    this.embedReport();
  }

  embedReport() {
    this.reportConfig = {
      ...this.reportConfig,
      ...vairables,
    };
  }
}

每次点击图表时我都会得到以下详细信息

我只能从中获得相关信息，即哪个页面、哪个报告以及哪种图表。不是我点击的数据点？

技术上可行吗？我是否缺少一些事件处理程序？

Answer 1

按照 Naren Murali 的建议，我尝试为

dataSelected

事件添加事件处理程序。它有效。

EventHandler 钩子

['dataSelected', (event) => this.handleDataPointClick(event)],

控制台.log