How to open a context menu on left click?


I want to show a menu when the user left-clicks on a node. I used the ContextMenuTool because it is very much like what I want, except using the left click instead of the right. How can I do that?

Thanks in advance,

Jany Belluz

Before asking, I tried it that way:

// Node template
$(go.Node, {
  click: (event, obj) => {
    const node = obj.part;
    const menu = $(go.Adornment, ...);
    node.diagram.toolManager.contextMenuTool.showContextMenu(menu, node);

But my problem is that the next click on the diagram does not hide the context menu. When I click on another node, then the context menu moves to that new node. There is no way to get rid of it once it’s on the screen.

That’s a good try, and you correctly realize that there are more events that need to be handled than just the initial click. That is what the ContextMenuTool is for.

But we make it easy: just call CommandHandler | GoJS API. Set the node’s GraphObject.contextMenu in the template.

    contextMenu: $(go.Adornment, ...),
    click: (e, node) => e.diagram.commandHandler.showContextMenu(node);
  . . .);

By the way, if you declare an event handler on an object, that object will be passed as the second argument.