Displaying parts of a dataset

Question

I got a dataset with Temperature values for different cities. For the visualisation of these values i'm using ngx-charts. The dataset contains subsets for munich, berlin and stuttgart. Is it possible hide a certain subset when clicking on it ? For example the three sets are plotted using a line chart. Selecting stuttgart hides stuttgart, so that only munich and berlin are displayed.

Answer 1

The chart emits click events, so you can modify your data based on that.

In your template, use the select output from the chart:

<ngx-charts-line-chart  
  [results]="data"
  (select)="select($event)">
</ngx-charts-line-chart>

In your component, implement the select method:

select(item) {
  console.log('Item clicked', item);

  // filter your data object here based on the data in item
  this.data = [...this.data.filter(i => {
    return i.name !== item.series;
  })]
}