根据 C3 图表中选择的区域显示过滤后的数据 - Angular

我的代码是https://codesandbox.io/s/late-forest-cuwf7 https://codesandbox.io/s/late-forest-cuwf7

我有 2 个文件：app.component.html 和 app.component.ts

我显示一张图表，其中 1 属于一个位置，1 属于另一个位置。

我需要的是显示属于图表中位置区域的单击位置的特定记录。比如说，如果我点击钦奈地区，我需要显示钦奈哪个位置的记录

我尝试使用 c3 的 onclick 函数来实现相同的目的。在 onclick 内部，filteredData 是根据位置过滤数据的变量。单击后，我能够在控制台中记录filteredData，但我在用户界面中看不到相同的内容。

您能帮忙将此过滤后的数据绑定到 UI 吗？

使用箭头函数引用当前对象

  ngAfterViewInit() {
    let value = JSON.parse(JSON.stringify(this.resultData));
    this.chart = c3.generate({
      bindto: "#chart",
      data: {
        onclick: (d, element) => {
          this.filteredData = value.filter(record => record.location === d.id);
          console.log(this.filteredData);
        },
        json: [_.countBy(this.resultData, x => x.location)],
        type: "pie",
        keys: {
          value: _.uniq(_.pluck(this.resultData, "location"))
        }
      }
    });
  }