框选 SelectionSelect

import LogicFlow from '@logicflow/core';
import { SelectionSelect } from '@logicflow/extension';
import '@logicflow/extension/lib/style/index.css'

LogicFlow.use(SelectionSelect);

开启

lf.openSelectionSelect();

// 1.1.0新增用法
lf.extension.selectionSelect.openSelectionSelect();

关闭

lf.closeSelectionSelect();
// 1.1.0新增用法
lf.extension.selectionSelect.closeSelectionSelect();

默认状态

默认是否开启框选功能，受到页面是否允许拖动画布影响。画布可以拖动与选区不能同时存在。

const lf = new LogicFlow({
  container: document.querySelector('#app'),
  stopMoveGraph: true,
})

如果stopMoveGraph为true，也就是不允许拖动画布，那么默认则可以进行框选。

如果stopMoveGraph不为true, 也就是允许拖动画布，那么默认则不可以进行框选。

大多数情况下，我们期望允许拖动画布，当用户点击拖拽面板后才开启选区。请参考拖拽面板插件

设置选区灵敏度

• 默认需要框选整个节点才选中节点
• 默认需要框选边的起点、终点才选中边

可以调用插件方法setSelectionSense来重新设置

参数	默认值	描述
isWholeEdge	true	是否要边的起点终点都在选区范围才算选中
isWholeNode	true	是否要节点的全部点都在选区范围才算选中

用法：

lf.extension.selectionSelect.setSelectionSense(false, true);

示例