hover-anchor-active.ts
1.79 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
/*
* @Date: 2023-10-27 09:29:59
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-02-20 14:53:35
* @FilePath: /vue-flow-editor/src/behavior/hover-anchor-active.ts
* @Description: 文件描述
*/
import $ from 'jquery';
export function hoverAnchorActive(G6) {
G6.registerBehavior('hover-anchor-active', {
getEvents() {
return {
'anchor:mouseenter': 'onEnter',
'anchor:mouseleave': 'onLeave',
'node:mouseenter': 'onEnterNode',
'node:mouseleave': 'onLeaveNode',
}
},
onEnter(e) {
const anchor = e.item;
const group = anchor.getContainer()._cfg.parent
if (!!group) {
group.keyShape.showAnchor(this.graph)
anchor.setState('active-anchor', true)
}
},
onLeave(e) {
const anchor = e.item;
const group = anchor.getContainer()._cfg.parent
if (!!group) {
anchor.getContainer()._cfg.parent.keyShape.hideAnchor(this.graph)
anchor.setState('active-anchor', false)
}
},
onEnterNode(e) {
const item = e.item;
// 打开预览模式不显示锚点
if ($('.preview-container').parents('.el-overlay').is(':visible')) {
item.hideAnchor(this.graph);
} else {
item.showAnchor(this.graph)
}
},
onLeaveNode(e) {
try {
const item = e.item;
// TEST: 注释掉鼠标离开时隐藏当前锚点，可以配合单击显示锚点使用。
item.hideAnchor(this.graph);
} catch (e) {
console.error(e);
}
},
})
}