Closed yobett closed 1 year ago
一个chart中包含多个view,这些view的x轴是相同的,如何让这些view同步进行平移/缩放呢? 我基于示例 https://g2.antv.vision/zh/examples/candlestick/candlestick#k-and-column 做了点修改(代码 https://gist.github.com/yobett/da2f2298dc102ced8ca4926e7924a512 ):
import DataSet from '@antv/data-set'; import { Chart, registerInteraction } from '@antv/g2'; registerInteraction("drag-move", { start: [{ trigger: "plot:mousedown", action: "scale-translate:start" }], processing: [ { trigger: "plot:mousemove", action: "scale-translate:translate", throttle: { wait: 50, leading: true, trailing: false }, }, ], end: [{ trigger: "plot:mouseup", action: "scale-translate:end" }], }); fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/candle-sticks.json') .then(res => res.json()) .then(data => { // ... chart.scale({ time: { type: 'time', key: true, sync: true, // ... }, // ... }); // ... const kView = chart.createView({ region: { start: { x: 0, y: 0 }, end: { x: 1, y: 0.7 }, }, limitInPlot: true }); // ... const barView = chart.createView({ region: { start: { x: 0, y: 0.7 }, end: { x: 1, y: 1 }, }, limitInPlot: true }); // ... kView.interaction("view-zoom"); kView.interaction("drag-move"); barView.interaction("view-zoom"); barView.interaction("drag-move"); chart.render(); });
做的修改如下:
问题如下:
有什么简便方法能让多个view在1个轴(或2个轴)方向同步缩放和平移呢?
重复 #3473
一个chart中包含多个view,这些view的x轴是相同的,如何让这些view同步进行平移/缩放呢? 我基于示例 https://g2.antv.vision/zh/examples/candlestick/candlestick#k-and-column 做了点修改(代码 https://gist.github.com/yobett/da2f2298dc102ced8ca4926e7924a512 ):
做的修改如下:
问题如下:
有什么简便方法能让多个view在1个轴(或2个轴)方向同步缩放和平移呢?