79 Star 445 Fork 108

GVPantv / G6

 / 详情

定义注册边报错如下

待办的
创建于  
2021-04-07 19:50
                G6.registerBehavior('click-add-edge', {
                    getEvents() {
                        return {
                            'node:click': 'onClick',
                            mousemove: 'onMousemove',
                            'edge:click': 'onEdgeClick' // 点击空白处,取消边
                        };
                    },
                    onClick(ev) {
                        const node = ev.item;
                        const graph = this.graph;
                        const point = {
                            x: ev.x,
                            y: ev.y
                        };
                        const model = node.getModel();
                        let sourceAnchor;
                        let targetAnchor;
                        if (this.addingEdge && this.edge) {
                            // 第2次点击
                            // 获取锚点的坐标
                            let array = new Array();
                            // 此时只有4个锚点 只需要传递四个即可
                            for (let i = 0; i < 4; i++) {
                                array.push(node.getLinkPointByAnchor(i))
                            }
                            // 计算锚点坐标与当前鼠标点击坐标的距离 找到最小的坐标点
                            targetAnchor = vm.getLastPoint(ev, array);
                            graph.updateItem(this.edge, {
                                target: model.id,
                                targetAnchor: targetAnchor,
                            });
                            this.edge = null;
                            this.addingEdge = false;
                            vm.refreshView()
                        } else {
                            // 第1次点击
                            // 获取锚点的坐标
                            let array = new Array();
                            for (let i = 0; i < 4; i++) {
                                array.push(node.getLinkPointByAnchor(i))
                            }
                            // 计算锚点坐标与当前鼠标点击坐标的距离 找到最小的坐标点
                            sourceAnchor = vm.getLastPoint(ev, array);
                            this.edge = graph.addItem('edge', {
                                source: model.id,
                                target: point,
                                sourceAnchor: sourceAnchor,
                                style: {
                                    stroke: "grey",
                                    endArrow: {
                                        path: G6.Arrow.triangle(5, 5, 5),
                                        d: 5,
                                        fill: "#7A67EE"
                                    }
                                }
                            });
                            this.addingEdge = true;
                        }
                    },
                    onMousemove(ev) {
                        const point = {
                            x: ev.x,
                            y: ev.y
                        };
                        if (this.addingEdge && this.edge) {
                            this.graph.updateItem(this.edge, {
                                target: point
                            });
                        }
                    },
                    onEdgeClick(ev) {
                        const currentEdge = ev.item;
                        // 拖拽过程中,点击会点击到新增的边上
                        if (this.addingEdge && this.edge == currentEdge) {
                            graph.removeItem(this.edge);
                            this.edge = null;
                            this.addingEdge = false;
                        }
                    }
                });

报错如下图

评论 (0)

icanci 创建了任务
icanci 关联仓库设置为antv/G6
展开全部操作日志

登录 后才可以发表评论

状态
负责人
里程碑
Pull Requests
关联的 Pull Requests 被合并后可能会关闭此 issue
分支
开始日期   -   截止日期
-
置顶选项
优先级
参与者(1)
5278818 canci 1583284681
JavaScript
1
https://gitee.com/antv/g6.git
git@gitee.com:antv/g6.git
antv
g6
G6

搜索帮助