API

First of all, the brush instance must be created after the chart be rendered.

import Brush from '@antv/brush';

const brush = new Brush({
  // properties
});

Properties

canvas

An instance of G.Canvas. Must be set. If use it for G2 chart, just get it by chart.get('canvas').

canvas: chart.get('canvas')

chart

An instance of G2.Chart. Set the brush target, then after brush action end, data will be automatically filtered when the filter property is true.

type

String. Set the brush type, default is 'XY', also you can set 'X', 'Y', 'POLYGON'. Case insensitive.

style

Object. It's for setting the brush style. Default value is:

{
  fill: '#C5D4EB',
  opacity: 0.3,
  lineWidth: 1,
  stroke: '#82A6DD'
}

inPlot

Boolean. Decide if the selection range is limited to the drawing area. Default value is true.

filter

Boolean. Decide if automatically filter the data, default value is decided by dragable value，!dragable. But still set by the user.

dragable

Boolean. Set whether the shape can be dragged, default is false, then filter is true.

xField

String. Set the selected x-axis field name, used to get the scale instance of the x-axis. Optional.

yField

String. Set the selected y-axis field name, used to get the scale instance of the y-axis. Optional.

onBrushstart

Function. examples

onBrushstart(ev) {
  // at the begining of the selection, you can define some properties, like chart xScale etc.
  const me = this; // On behalf of the object itself
  me.chart = chart;
}

onBrushmove

Function. examples

onBrushmove(ev) {
  // during selection
  const { data, shapes, x, y, ...others } = ev;
}

onBrushend

Function. examples

onBrushend(ev) {
  // selection stoped
  const { data, shapes, x, y, ...others } = ev;
}

onDragstart

Function. Only dragable is true.

onDragstart(ev) {
  // at the begining of the drag, you can define some properties, like chart xScale etc.
}

onDragmove

Function. Only dragable is true.

examples

onDragmove(ev) {
  // during drag
  const { data, shapes, x, y, ...others } = ev;
}

onDragend

Function. Only dragable is true.

examples

onDragend(ev) {
  // drag stoped
  const { data, shapes, x, y, ...others } = ev;
}

Function

setType(type)

used for change brush type, see examples.

2.7 KiB Raw Blame History Unescape Escape

API

Properties

Function

2.7 KiB

Raw Blame History