G2 4.0 后所有的交互都是基于交互语法进行拼装，详细的说明参考 Interaction 的概念 ，这里介绍 Interaction 的使用。
你可以通过 Chart 上的两个接口来添加和移除交互：

  • chart.interaction(name, [cfg]) 添加或者修改交互
  • chart.removeInteraction(name) 移除交互

使用 Interaction

直接使用

  1. chart.interaction('tooltip');

覆盖部分交互环节

可以覆盖任何环节的触发和反馈，交互环节参考 交互语法组合

  1. chart.interaction('tooltip', {
  2.     start: {
  3.       trigger: 'interval:click',
  4.     action: 'tootip:show'
  5.   }
  6. });

移除 Interaction

  1. chart.removeInteraction('tooltip');

内置的 Interaction

为了便于用户的使用，G2 在 Chart 中内置了几种交互：

  • tooltip：鼠标在 chart 上移动时显示提示信息
  • legend-active：鼠标移动到图例选项时，图例项高亮，对应的图形高亮
  • legend-filter：分类图例的勾选
  • continuous-filter: 连续图例的过滤

但是一些场景下需要移除掉默认的交互，例如你想要的 legend 勾选不是过滤数据而是过滤图形时，则需要移除掉 legend-filter

  1. chart.removeInteraction('legend-filter')
  2. chart.interaction('legend-visible-filter')

支持的 interaction 列表

每个 interaction 的定义参考 交互列表

支持的 Action

注册 Interaction

在 G2 的命名空间上提供了注册的方法：

  1. G2.registerInteraction(name, defs);

以 tooltip 的交互为例：

  1. registerInteraction('tooltip', {
  2.   start: [{ trigger: 'plot:mousemove', action: 'tooltip:show' }],
  3.   end: [{ trigger: 'plot:mouseleave', action: 'tooltip:hide' }],
  4. });

更多

更多交互语法的使用参考：