How to detect drop on elements on one level down

GoJS
1

I have a diagram as shown in Fig.

BPMN.png999×720 50.2 KB

When decorative element is added in the diagram and then user tries to do drag -drop of “Task” & “Gateway”
the mousedrop event doesn’t get raised for the group elements (which are below the decorative element)

How one can achieve same ?
For decorative node the template is defined as below -

> BPMNMileStoneDiagramManager.prototype.getShapeNodeTemplate = function () {
>     var current = this;
>     var palscale = 1;
>     var nodeTemplate =
>         current.goObj(go.Node, "Auto",
>             { selectionAdorned: true, resizable: true, zOrder: -1, layerName : "decoration" },
>             new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
>             new go.Binding("desiredSize", "size", go.Size.parse).makeTwoWay(go.Size.stringify),
>             new go.Binding("zOrder", "zOrder"),
>             {
>                 toolTip:
>                   current.goObj(go.Adornment, "Auto",
>                     current.goObj(go.Shape, { fill: "#FFFFCC" }),
>                     current.goObj(go.TextBlock, { margin: 4, text: "Tool Tip text" }, new go.Binding("text", "text").makeTwoWay())
>                     ),

>                 doubleClick: function (e, node) {
>                     var tb = node.findObject("TEXT");
>                     if (tb !== null) {
>                         if (tb.text == "") tb.text = "____";
>                         e.diagram.commandHandler.editTextBlock(tb);
>                     }
>                 }
>             },

>             current.goObj(go.Shape,
>                 { fill: "transparent", stroke: "black", strokeWidth: 1, minSize: new go.Size(75, 75) },
>                 new go.Binding("fill", "", current.fillColorConverter.bind(current)),
>                 new go.Binding("stroke", "", current.borderColorConverter.bind(current)),
>                 new go.Binding("strokeDashArray", "strokeDashArray"),
>                 new go.Binding("strokeWidth", "strokeWidth"),
>                 new go.Binding("figure", "figure")),

>             current.goObj(go.TextBlock,
>                 { name: "TEXT", margin: 5, editable: true }, 
>                 new go.Binding("text").makeTwoWay(),
>                 new go.Binding("font", "font"),
>                 new go.Binding("stroke", "", current.textColorConverter.bind(current)),
>                 new go.Binding("alignment", "textAlign", go.Spot.parse)
>                 )
>         );
>     return nodeTemplate;
> }
1 Like
2

Well, previously My groups nodes were transparent and are below the “decorative” layer i.e. “SwimLane”

My layer orders was -

“Swimlane”
“Decorative”
“”
“Foreground”

Since they have transparent color, I changed the layer to default i.e. “”. My drop operations are working as expected.
But when my “Decorative” node is as shown in fig. then not able to select same for resizing for moving.

Also for Group nodes selectable is set to false.
Additional information - The decorative node, is separate node , where as the group element are child of one big node(Pool) and event , gateway, task are child nodes (member of ) for the group where they are dropped.
When I click on the groupnode, the outermost “Pool” gets selected since selection for groupnodes is disabled.

Can you provide solution/suggestion for same ?

Tried other things also - And seems with original approach only, I should be able to dectect if drop happen on my “Decorative” element, then using some code, I should be able to check if drop happen on diagram canvas or any group element and execute required code … Can you provide info on same … ?

3

I don’t think I understand what your situation is. Would setting GraphObject.pickable to false on your decorative nodes accomplish what you want?