[Fixed] How to select child vertex in one click on mxgraph?

Issue

I have nested vertices and I want to select child vertex on my first click to the child.

Right now when I clicked on a child vertex it selects parent vertex first.

Parent vertex selected first:
Parent vertex selected first

For selecting child vertex I have to click again on the child.

Child vertex selected after double click:
Child vertex selected after double click

How can I select child vertex on my first click?

Solution

I solved the issue by overriding the getInitialCellForEvent function.

mxGraphHandler.prototype.getInitialCellForEvent = function(me)
{
    var state = me.getState();
    return (state != null) ? state.cell : null;
};

The original was like this. I removed the if part which retrieves the topmost cell.

/**
 * Function: getInitialCellForEvent
 * 
 * Hook to return initial cell for the given event. This returns
 * the topmost cell that is not a swimlane or is selected.
 */
mxGraphHandler.prototype.getInitialCellForEvent = function(me)
{
    var state = me.getState();
    
    if ((!this.graph.isToggleEvent(me.getEvent()) || !mxEvent.isAltDown(me.getEvent())) &&
        state != null && !this.graph.isCellSelected(state.cell))
    {
        var model = this.graph.model;
        var next = this.graph.view.getState(model.getParent(state.cell));

        while (next != null && !this.graph.isCellSelected(next.cell) &&
            (model.isVertex(next.cell) || model.isEdge(next.cell)) &&
            this.isPropagateSelectionCell(state.cell, true, me))
        {
            state = next;
            next = this.graph.view.getState(this.graph.getModel().getParent(state.cell));
        }
    }
    
    return (state != null) ? state.cell : null;
};

Leave a Reply

(*) Required, Your email will not be published