LogicFlow
LogicFlow copied to clipboard
直接连接2个节点(无吸附行为)和修改边连接的节点(有吸附行为)时交互不一致
- 直接从节点A连接到B,鼠标可以在节点B内任意移动;
- 调整A -> C节点之间的边,改成A -> B,鼠标在节点B内移动的时候默认会被吸附到距离最近的锚点;
因为AdjustPoint.tsx中有如下代码,edgeModel.updateAfterAdjustStartAndEnd(params);产生了吸附交互
// 如果一定的坐标能够找到目标节点,预结算当前节点与目标节点的路径进行展示
if (info && info.node && this.isAllowAdjust(info)) {
let params;
const { startPoint, endPoint, sourceNode, targetNode } = edgeModel;
if (type === AdjustType.SOURCE) {
params = {
startPoint: { x: info.anchor.x, y: info.anchor.y },
endPoint: { x: endPoint.x, y: endPoint.y },
sourceNode: info.node,
targetNode,
};
} else if (type === AdjustType.TARGET) {
params = {
startPoint: { x: startPoint.x, y: startPoint.y },
endPoint: { x: info.anchor.x, y: info.anchor.y },
sourceNode,
targetNode: info.node,
};
}
edgeModel.updateAfterAdjustStartAndEnd(params);
} else if (type === AdjustType.SOURCE) {
// 如果没有找到目标节点,更显起终点为当前坐标
edgeModel.updateStartPoint({ x, y });
} else if (type === AdjustType.TARGET) {
edgeModel.updateEndPoint({ x, y });
}
能否让以上2种连接边的方式的交互保持一致呢?或者提供参数来控制要不要开启吸附功能。
这个先不用改吧,后面可以考虑一下,默认从锚点拖出的连线就是真实的连线,而不是直线。https://github.com/didi/LogicFlow/issues/861
这个先不用改吧,后面可以考虑一下,默认从锚点拖出的连线就是真实的连线,而不是直线。#861
这里不是指连接出来的线的样式,是指拖拽移动的时候如果在节点移动上,可能会有吸附行为产生。
直接连接节点创建的不是真实的连线,而是一个从锚点到鼠标位置的直线。这个时候没有加吸附是因为吸附了也不是真实连线后的效果。这里的交互确实可以考虑一下,例如把直接换成真实的折线或者高亮能吸附的锚点。
直接连接节点创建的不是真实的连线,而是一个从锚点到鼠标位置的直线。这个时候没有加吸附是因为吸附了也不是真实连线后的效果。这里的交互确实可以考虑一下,例如把直接换成真实的折线或者高亮能吸附的锚点。
加个参数控制调整adjust point时的吸附交互怎么样?默认还是使用吸附效果,但是可以通过参数控制取消吸附功能。
因为有时候吸附并不是一个好的体验,比如节点A连接到节点B, 需要改成A连接到节点C,如果在拖拽调整的过程中,鼠标移动路径经过了其它节点,会被吸附到其它节点上去,产生不好的体验。