Drop Node over Link/Node not with mouse pointer

Hi,
In this example Flowgrammer, the function will be like after dragging a node from palette and It’s only possible to drop a link or node if the mouse pointer is palced on node or link.

Is that possible to drop over node when the node dragover/dropped on another node in all palces not only with mouse pointer.

Are you asking about ways of adding and linking nodes without the user drag-and-dropping from the Palette to the main Diagram?

If so, then yes, you can do what you want. But you need to know exactly what you want users to do, and what that means, and under what circumstances.

For example, look at the State Chart sample, State Chart. When the user selects a node, there is a button shown in the selection Adornment that creates a new node and draws a new link from the selected node to the new node.

Other examples of this include Grafcet Diagrams and Selection Adornment Buttons.

No. I am asking about after dropping a node on link and then link gets splitted. This is only possible if the mouse pointer is over the link.
I need to know Is this possible to split a link if I drop a node over the link not with mouse pointer

Sure, but that sample only lets the user specify which node to drop on which link when they drag it using the mouse or finger.

If you are asking about how to do it programmatically, look at the implementation in that sample. Notice how the Link.mouseDrop event handler is implemented by the dropOntoLink function. Now that function is called after the new node already exists in the diagram, due to the drop having occurred. You may need to create the node yourself by calling Model.addNodeData and then Diagram.findNodeForData.

dropOntoLink function will be called only when we place mouser pointer on that link. Let me tell you clearly,

In the first image you can see that I am trying to drop a node on link but I am not able to drop.

In the second image you see that I am able to drop only after the mouse pointer placed on link.

mouseDragEnter, mouseDragLeave, mouseDrop all the functions will be called only after the mouse pointer touches link(like image2).

So, My Question is Can I drop new node on link and make the link split when new node actually touches link(like image 1)?

Even I have tried Custom Dragging tool methods doDropOnto&doDragOver all these works after the mouse pointer touches the link(like image2). I need to drop a new node on link like image1 shows.

Ah, so that is what you mean. A picture is worth a thousand words - Wikipedia

You’ll need to replace the implementation of the “ExternalObjectsDropped” DiagramEvent listener with one that calls Diagram | GoJS API to find all of the Links that intersect with the just-dropped Node(s). If there is more than one, you’ll need to decide how to choose. If there are none, you’ll need to decide what to do. Once you have a targeted Link, call dropOntoLink. You can also delete the setting of Link.mouseDrop, since that would duplicate the behavior for a fraction of the cases.

Thanks for your reply.

I have one doubt, If I have used ExternalObjectsDropped listener and then what about link highlighting on drop (like in image 2)?

Yes, what about that highlighting? It’s implemented by the two mouseDrag… event handlers on the Link.

Another thing is dropping a node on link is not only from external diagram(Palette) but also node dropping in that diagram itself(if node in that diagram placed on link and then it also should do same splitting)

You can implement that if you want, although I don’t think that’s well-defined in general.

Diagram | GoJS API is only finding the nodes. That function not finding links.

How are you calling Diagram.findObjectsIn?

I was writing a custom dragging tool which extends go.DraggingTool.

In that class, I am overriding two methods DraggingTool.doDropOnto, DraggingTool.doDragOver.

In those methods I am calling diagram.findObjectsIn as:
this.diagram.findObjectsAt(portPt,
function(x) {
if(x.part !=null && x.part instanceof go.Link ){
dropOntoLink(diagram,x.part)
}…)

for portPt I have given like diagram.selection.first().actualBounds

You really shouldn’t be causing side-effects in either of the functional arguments to findObjectsIn. Look at the resulting collection to decide what to do.

And you certainly do not want to call dropOntoLink in doDragOver.

From that collection it always returns count 0.

Is there any possible ways to call findObjectsAt/findObjectsIn

First, are you using the debug library and checking for warnings and errors?

I just tried this, and it worked well to find overlaps with Links:

    var overlaps = e.diagram.findObjectsIn(myBox.actualBounds,
      function(x) {
        var part = x.part;
        if (part instanceof go.Link) return part;
        return null;
      },
      null, true);
    console.log(overlaps.count);
    overlaps.each(function(l) { console.log(l.toString()); });