Problems with Pool and Swimlanes

Hi,

I have some problems with my code:

(1) When I drag any Lane up to red bar, it is down to the bottom. How Can avoid this?

(2) The original locations of nodes are:

“key”:“A”, “location”:“51 247”
“key”:“B”, “location”:“293 151”
“key”:“C”, “location”:“466 56”

but when the diagram is loaded and I do myDiagram.model.toJson() I get:

“key”:“A”, “location”:“51 466”
“key”:“B”, “location”:“293 279”
“key”:“C”, “location”:“466 93”

the location property has changed in “y-coordinate”. I put isInitial:false and isOngoing:false in Lane groupTemplate, but error persists. How can I fix this?

(3) I want the footer section be the final of the resizing of all Lanes. How can I do this?

Regards,

Make the PoolLayout.comparer function smarter to make sure the first and last lanes are always compared that way.

Sorry, but I do not understand your answer

My urgency is the point (2). I need help to solve it. thanks

If you set Layout.isInitial and/or isOngoing on both of the Group.layouts, did you also do so on the Diagram.layout?

originally I put that properties only in the Lane layout like the Swimlane sample

but, If I set that properties on:

  • Lane layout => Nodes are disordered
  • Lane layout & Pool layout => Lanes disappears and nodes are disordered
  • Lane layout & Pool layout & Diagram layout => Lanes disappears
  • Lane layout & Diagram layout => Lanes are disordered and nodes too
  • Pool layout => Lanes disappears and nodes are disordered
  • Pool layout & Diagram layout => Lanes disappears and nodes are disordered
  • Diagram layout => Lanes are disordered and nodes too

:confused:

If you really care about the ordering of the lanes, and if you don’t really care about the locations of the lanes, I think you should add a property to each lane or pool data object that indicates its order (call it “order”?), and you should delete the “location” property on the data and the TwoWay Binding of it.

Then you can update the GridLayout.comparer function to use that data.order property. That also handles any header or footer lanes that you always want to be first or last.

But you will then need to change the behavior of DraggingTool so that it also sets the data.order property for the dragged lanes/pools. You can do that in the “SelectionMoved” and “SelectionCopied” DiagramEvent listeners: set the data.order property for each lane and each pool based on its current Y location, and then call the relayoutDiagram function, as the SwimLanes sample already does.

Is this a bug? or is there something I am doing wrong in my code? I have guided of the swimlane example

I don’t think that is a bug in the Swim Lanes sample – that’s just how that sample was designed and implemented.

but, why Layout.isInitial and isOngoing properties doesnt work in Lane layout?

They probably do work, but maybe you didn’t set them on the right Layout. Hard to say.

I’ve set that properties in all combinations of layouts (post#5) and I get different errors :confused:

Please provide a complete but concise sample that demonstrates the problem. Strip out everything that is unrelated to the problem. Tell us what you got (what we need to do to reproduce the problem) and show us what you expected.

Why are you setting Layout.isInitial and Layout.isOngoing?

the complete code was always in the first post and the problem with Lanes is point (2) (first post too)

code:

situation
(2) The original locations of nodes are: (search “test data” in js code)

“key”:“A”, “location”:“51 247”
“key”:“B”, “location”:“293 151”
“key”:“C”, “location”:“466 56”

but when the diagram is loaded and I do myDiagram.model.toJson() I get:

“key”:“A”, “location”:“51 466”
“key”:“B”, “location”:“293 279”
“key”:“C”, “location”:“466 93”

why y-coordinate was changed (is relative to Lane)?

thanks.

Your code does not follow my suggestion that you get rid of the “location” data property and substitute it with an “order” property, along with changes to PoolLayout.comparer and the “SelectionMoved” and “SelectionCopied” DiagramEvent listeners.

Still, if you really want to use explicit locations and Binding on Node.location, and if you really want to disable layout invalidation by setting Layout.isInitial to false, then you had better supply proper values for each data.location property. If you don’t and if its Layout does not get a chance to run to give the node a real location, it won’t have a real location, so it won’t be visible anywhere.

I’ve fixed the issue #2 setting the location property in Pool and Lanes directly in test data

http://jsfiddle.net/cs24/4sy9k5r8/4/ :grinning:

but I need help to solve issues #1 and #3

(1) When I drag any Lane up to red bar, it is down to the bottom. How Can avoid this?

(3) I want the footer section be the final of the resizing of all Lanes. How can I do this?

Regards,

Look at how the GridLayout.comparer function is defined in Swim Lanes

Make sure that your “footer” section sorts last.

Thanks! GridLayout.comparer function was the solution. That solve the issue #1 :smile:

How can I solve the issue #3?

Regards,

Perhaps I have an incomplete understand of what your requirements are for #1 and #3, but if you implemented the comparer function correctly for your app, it should have addressed both #1 and #3.

Hi,

issue#3 is: I want the footer section be the final of the resizing of all Lanes. How can I do this?

In the initial sample:

If I resize any Lane the others appears behind the footer and cross it down. The footer should be restrict the resize of all Lanes