import { Chart } from '@antv/g2';

const chart = new Chart({
  container: 'container',
});

chart
  .data(temperatures)
  .encode('x', 'month')
  .encode('y', 'temperature')
  .encode('color', 'city')
  .call((chart) => chart.line())
  .call((chart) => chart.point());

chart.interaction('legendFilter', true);

chart.render();

chart.emit('legend:filter', {
  data: { channel: 'color', values: ['Sports', 'Strategy'] },
});

chart.emit('legend:reset', {});

chart.on('legend:filter', (e) => {
  const { nativeEvent, data } = e;
  if (!nativeEvent) return;
  console.log(data);
});

chart.on('legend:reset', (e) => {
  const { nativeEvent } = e;
  if (!nativeEvent) return;
  console.log('end');
});