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

const chart = new Chart();

chart.coordinate({
  transform: [{ type: 'fisheye', focusX: 0.5, focusY: 0.5 }],
});

chart
  .point()
  .data({
    type: 'fetch',
    value: 'https://gw.alipayobjects.com/os/antvdemo/assets/data/bubble.json',
  })
  .encode('x', 'GDP')
  .encode('y', 'LifeExpectancy')
  .encode('size', 'Population')
  .encode('color', 'continent')
  .encode('shape', 'point')
  .style('fillOpacity', 0.3)
  .style('lineWidth', 1)
  .scale('size', {
    type: 'log',
    range: [4, 20],
  });

chart.render();