Scrolling a node vertically into central view

I have a simple function that gets called if a node has an attribute of centreMe. This works fine and centres the node (as near as the centre can be given the height/width of the container and the actual location of the node withing it).


            function centreMe(node) {
                //TODO: check if we want to centre me!
                myDiagram.centerRect(node.actualBounds);
                //myDiagram.select(node);
            }

My issue with this is that in some instances of my flow chart, I just want to scroll the chart vertically upwards such that the chart appears to move upwards and not sideways. Sometimes clicking a yes/no on an option doesn’t make sense to horizontally shift the chart sideways as this visually and physically adds effort for a user interacting with the end flowchart.

Ideally I’ve missed some sort of
myDiagram.centerRect(node.actualBounds, ‘x’);
myDiagram.centerRect(node.actualBounds, ‘y’);

or there’s a suggestion on other options for this… (

  • perhaps to calculate the viewport height,
  • half it (=y)
  • get the x/y of the node (?) (=x)
  • centre on the x,y

)

I suggest you just modify the Y component of the Diagram.position. Here’s the definition of Diagram.centerRect:

Diagram.prototype.centerRect = function(r) { var vb = this.viewportBounds; var midpt = r.center; midpt.x -= vb.width / 2; midpt.y -= vb.height / 2; this.position = midpt; };
You can adapt this code appropriately. You’ll need to allocate a new Point if you want to modify either the X or the Y value. (Rect.center returns a new Point.)