Node or part of infinite width

GoJS
1

How to add a node/part of infinite width?

My code for adding a part is as follows:

myDiagram.add(
	    $(go.Part, "Auto",
	        $(go.Shape, "Rectangle", 
                 { 
                   width: 55,  // Need to have infinite width
                   height: 45 
                 })
	     ));
2

The simple answer is “no”, as you quickly discovered.

But if you could describe why you need an infinitely wide part, perhaps we can find an alternative solution.

3

My requirement is to create a rectangular box which extends from -infinity to +infinity, or in other words, when i drag the diagram either sides, i shouldn’t see the either sides of the rectangle, but only the upper and lower side should be visible every time from -infinity to +infinity.

4

You might be able to get such a result using the Diagram.grid if you are not already using it for something else.

Another possibility is to implement a “ViewportBoundsChanged” DiagramEvent listener that moves and resizes a node so that it always appears to cover the width of the viewport. GoJS Legends and Titles -- Northwoods Software

5

Using “Static Parts” i make the nodes static, i.e now node is not moving at all.

But, after making this node static, if i want to make it scroll vertically only, how can i achieve this?

Currently, i am using “Diagram.grid” for creating timeline as in this topic:

So, how can i use “Diagram.grid” for this kind of node (Vertical scroll only).

OR, Is it possible to have a HORIZONTAL LINE of INFINITE Length?

6

When setting the part’s position, keep the Y value the same instead of following the Diagram.position.y value.

7

Hey @walter, Happy New Year !! :)

I tried to keep the Y value same, but still am not able to scroll the “static part”.

Code is as follows:

myDiagram.addDiagramListener("ViewportBoundsChanged", function(e) {
  var dia = e.diagram;
  dia.startTransaction("fix Parts");
  // only iterates through simple Parts in the diagram, not Nodes or Links
  dia.parts.each(function(part) {
    // and only on those that have the "_viewPosition" property set to a Point
    if (part._viewPosition) {

    	partYposition = part.position.y;
        part.position = dia.transformViewToDoc(part._viewPosition);
    	part.position.y = partYposition;

        part.scale = 1/dia.scale;
    }
  });
  dia.commitTransaction("fix Parts");
});

Could you please suggest, what is wrong here!

8

Rather than answering your specific questions, I have created a new sample that demonstrates a timeline editor that is somewhat similar to what I think you are asking for: Basic Day/Hour Infinite Timeline

You’ll need to modify it for your own purposes.

9

@walter, Thanks a lot for your support. That will help a lot. Thank You!