G2 图表 点击获取当前数据（Axis 事件）

G2 Axis 事件 点击坐标轴文本获取数据

图形 Element 上的事件

为了帮助用户更加清晰的使用事件前缀（name），我们在这里列出 G2 默认支持的所有的事件前缀（name）：

• element：所有的 geometry 的 element 都支持的事件前缀
• line: 折线图支持的前缀
• area: 面积图支持的前缀
• interval: 柱状图、直方图、饼图 等支持的事件前缀
• point：点图、气泡图等支持的前缀
• polygon：方块图等支持的前缀
• schema：k 线图、箱型图支持的事件前缀
• edge: 边支持的前缀

chart 通过事件 element:click 点击柱状图 是可以拿到 data 数据的

chart.on('element:click', (ev) => {
  console.log(ev, 'ev')
});

​ 下面是可以拿到的数据

也可以通过拿到柱状图当前点击的单条数据

chart.on('element:click', (ev) => {
  const lineElement = ev.target.get('element');
  const datas = lineElement.getModel().data; // 单条数据
  console.log(datas, 'evs')
});

而类似 通过点击侧边的却不能通过 ev 去拿到data数据

Axis 事件

• axis-label：坐标轴文本的事件前缀
• axis-line：坐标轴轴线的事件前缀
• axis-tick：坐标轴刻度线的事件前缀
• axis-title：坐标轴标题事件前缀

可以通过以下 delegateObject 对象来访问 拿到对应数据的id 和数据

chart.on('axis-label:click', (ev) => {
      const target = ev.target
      const delegateObject = target.get('delegateObject')
      console.log(delegateObject, 'evs')
});