Is there anyway shall we dynamically maintain grid cell height when more events dragged on to a particular grid cell using GOJS

Is there anyway shall we dynamically maintain grid cell height when more events dragged on to a particular grid cell using GOJS

What do you mean by that? It would help if you showed some before and after screenshots along with some markings to say what you would like to be different.

I am providing two screen snippets event1 and event2. In event1 screen snippet; I could show two events for resource T012; In event2 screen snippet I could show 3 events for the same resource T012 but third event is falling with in the boundary of resource T013 which not right; In the above scenario how do I maintain grid cell height dynamically when I have to show 3 events parallel for a particular resource without exceeding grid cell boundaries (means event should not fall under the space of another resource).

Best Regards
Venkat

Hi Alter,

Shall I control Grid cell height dynamically across the board with a GOJS; when more events occupied in the same grid cell as I described above.

Best Regards
Venkat

Are you using the TableLayout extension? Or did you start with one of the SwimLanes or SwimBands samples? If you want to increase the height of the “T012” row, how is that row implemented in your app?

TableLayout will automatically size the rows and columns to fit the are occupied by Nodes that are assigned to each cell.

If “T012” is implemented as a Group with a Placeholder, and if all of the Nodes in that row are added as members of the group, then the height of the group would automatically fit all of the member nodes.

Hi Walter,

I am using GridLayout and not allowing to size events in a grid cell when I drop 3 events on a grid at runtime.

layout: $go(go.GridLayout, { isInitial: false, isOngoing: false })

Best Regards
Venkat

Well, maybe using TableLayout will provide a solution.

Hi Walter,

Does TableLayout will provide same look and feel of GridLayout?

Best Regards
Venkat

Look and feel is completely independent of the Diagram.layout.

Examine the Table sample, Table Layout, and decide for yourself.

Hi Walter,

I would need GridLayout look and feel and Tablelayout kind of functionality like automatically size the rows and columns to fit the are occupied by Nodes that are assigned to each cell but unfortunately gojs not providing above mentioned features.

Best Regards
Venkat

As I said, there is no “look and feel” for any Layout. Layout is only responsible for positioning nodes, and perhaps for routing links.

“Look” is entirely determined by the visual tree of GraphObjects used in each Node and in each Link, especially considering the particular properties that are used for each object, such as each Shape or each TextBlock.

“Feel” is entirely determined by the behavior that is implemented by the CommandHandler and by the Tools and by the event handlers specified on each GraphObject.

GoJS does provide all of the features that you need to implement the “look and feel” that you want.

Hi Walter,

This is what my understanding after reading your post; I could implement tabularlayout with gridlayout look and feel along with the bellow features
draggingTool.gridSnapCellSpot": new go.Spot(0, 0.25),
“draggingTool.gridSnapCellSize”: new go.Size(setting.daylyX / 24, setting.gridH),
“resizingTool.isGridSnapEnabled”: true,

Correct me if my understanding is wrong.

Best Regards
Venkat

I don’t really know what your requirements are, so I cannot say. Sorry. But using grid snapping might be reasonable.

Hi Walter,

Here bellow is my sample code; How do I increase grid cell height dynamically when I drag 3 events into one grid cell using Grid Layout with GOJS?

First, I would use the Debug version of the library, go-debug.js, and I would carefully look at the console output to see if there are any errors I should be fixing.

Second, do you know how to handle this issue when just dropping a single node onto the diagram?

Third, I assume you already know about setting Diagram.grid’s Panel.gridCellSize. You might consider using the methods Point.snapToGrid or Point.snapToGridPoint, in order to move nodes to new positions due to the changed grid cell size.

Hi Walter,

In my requirement is each resource is associated the multiple events; each resource and associated events represent swim lanes. Is there anyway would I increase that particular swim lane row size when more events dragged into that respective grid cell ?.

“Grid” Panel only draws uniformly sized cells, whose size is set by Panel.gridCellSize.

So you cannot use that mechanism to draw cells with nonuniform size.

Hi Walter,

In future do you have any plan to support my requirement? Currently your competitors supporting this feature.

Best Regards
Venkat

Precisely which features are you asking about? There are several samples that demonstrate what I think you’re asking for:

  • Table Layout (I think this is the closest to what you are asking for)
  • Swim Lanes (although that sample only lets the user manually resize the breadth of the lane)
  • Kanban Board (shows automatically extending the height of all of the columns as nodes are added to a column)
  • Layer Bands using a Background Part (although TreeLayout does not normally support multiple nodes in the same layer/band)

I do not understand why you have been so fixated on using the Diagram.grid panel and GridLayout, when those will not give you what you want.