视图之间的联动方式

[pearmini]

G2 交互机制

不同视图之间的联动方式。

开始使用

案例链接：https://observablehq.com/d/fe66c3674143ccce

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

const focus = new Chart();
focus.render({
  type: 'area',
  width,
  data: appl,
  height: 360,
  clip: true,
  encode: {
    x: 'Date',
    y: 'Close',
    color: 'steelblue',
  },
});

const context = new Chart();
context.render({
  type: 'area',
  width,
  height: 90,
  data: appl,
  encode: {
    x: 'Date',
    y: 'Close',
    color: 'steelblue',
  },
  axis: { y: false },
});

focus.on('zoom:end', (event) => {
  const { position } = event;
  context.dispatch('brush:move', { position });
});

context.on('brush:end', (event) => {
  const { selection } = event;
  focus.action('area', { type: 'dataFilter', selection });
});

API

• chart.on
• chart.dispatch
• chart.action

[pearmini]

#4946