将悬停事件添加到mxGraph中的顶点

时间:2014-11-03 17:14:00

标签: javascript javascript-events hover mxgraph

有没有办法处理顶点上的悬停事件?我没有在mxEvents或任何示例中看到任何相关内容,例如mouseenter,mouseleave,mouseover等,所以我假设没有。 (还有其他狡猾的解决方法吗?)

1 个答案:

答案 0 :(得分:4)

hoverstyle示例演示了如何实现此功能。此特定代码与问题相关:

        // Changes fill color to red on mouseover
        graph.addMouseListener(
        {
            currentState: null,
            previousStyle: null,
            mouseDown: function(sender, me)
            {
                if (this.currentState != null)
                {
                    this.dragLeave(me.getEvent(), this.currentState);
                    this.currentState = null;
                }
            },
            mouseMove: function(sender, me)
            {
                if (this.currentState != null && me.getState() == this.currentState)
                {
                    return;
                }

                var tmp = graph.view.getState(me.getCell());

                // Ignores everything but vertices
                if (graph.isMouseDown || (tmp != null && !
                    graph.getModel().isVertex(tmp.cell)))
                {
                    tmp = null;
                }

                if (tmp != this.currentState)
                {
                    if (this.currentState != null)
                    {
                        this.dragLeave(me.getEvent(), this.currentState);
                    }

                    this.currentState = tmp;

                    if (this.currentState != null)
                    {
                        this.dragEnter(me.getEvent(), this.currentState);
                    }
                }
            },
            mouseUp: function(sender, me) { },
            dragEnter: function(evt, state)
            {
                if (state != null)
                {
                    this.previousStyle = state.style;
                    state.style = mxUtils.clone(state.style);
                    updateStyle(state, true);
                    state.shape.apply(state);
                    state.shape.reconfigure();
                }
            },
            dragLeave: function(evt, state)
            {
                if (state != null)
                {
                    state.style = this.previousStyle;
                    updateStyle(state, false);
                    state.shape.apply(state);
                    state.shape.reconfigure();
                }
            }
        });