You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
66 lines
2.0 KiB
66 lines
2.0 KiB
import { Path } from '@antv/g';
|
|
import { pointsToPath } from '../utils/path';
|
|
import { BrushSelect, getCursorPoint } from './brush-select';
|
|
/**
|
|
* <zh/> 套索选择交互
|
|
*
|
|
* <en/> Lasso select behavior
|
|
* @remarks
|
|
* <zh/> 用不规则多边形框选一组元素。
|
|
*
|
|
* <en/> Select a group of elements with an irregular polygon.
|
|
*/
|
|
export class LassoSelect extends BrushSelect {
|
|
/**
|
|
* Triggered when the mouse is pressed
|
|
* @param event - mouse event
|
|
* @internal
|
|
*/
|
|
onPointerDown(event) {
|
|
if (!super.validate(event) || !super.isKeydown() || this.points)
|
|
return;
|
|
const { canvas, graph } = this.context;
|
|
this.pathShape = new Path({
|
|
id: 'g6-lasso-select',
|
|
style: this.options.style,
|
|
});
|
|
canvas.appendChild(this.pathShape);
|
|
this.points = [getCursorPoint(event, graph)];
|
|
}
|
|
/**
|
|
* Triggered when the mouse is moved
|
|
* @param event - mouse event
|
|
* @internal
|
|
*/
|
|
onPointerMove(event) {
|
|
var _a;
|
|
if (!this.points)
|
|
return;
|
|
const { immediately, mode } = this.options;
|
|
this.points.push(getCursorPoint(event, this.context.graph));
|
|
(_a = this.pathShape) === null || _a === void 0 ? void 0 : _a.setAttribute('d', pointsToPath(this.points));
|
|
if (immediately && mode === 'default' && this.points.length > 2)
|
|
super.updateElementsStates(this.points);
|
|
}
|
|
/**
|
|
* Triggered when the mouse is released
|
|
* @internal
|
|
*/
|
|
onPointerUp() {
|
|
if (!this.points)
|
|
return;
|
|
if (this.points.length < 2) {
|
|
this.clearLasso();
|
|
return;
|
|
}
|
|
super.updateElementsStates(this.points);
|
|
this.clearLasso();
|
|
}
|
|
clearLasso() {
|
|
var _a;
|
|
(_a = this.pathShape) === null || _a === void 0 ? void 0 : _a.remove();
|
|
this.pathShape = undefined;
|
|
this.points = undefined;
|
|
}
|
|
}
|
|
//# sourceMappingURL=lasso-select.js.map
|