angularfrontendsyncfusionej2-syncfusion

How to make autoscrolling with angular ej2-syncfusion diagrams


I have grid where I can make nodes. On those nodes I have 4 buttons to add new node on each side of node

this square

So what I wanna do is when I add new node make screen to be centered to this this node.

I tried next ways:

         if(direction === NodeDirection.BOTTOM)
            diagram.scrollSettings.verticalOffset += (node.height / 2);
          else if(direction === NodeDirection.TOP)
            diagram.scrollSettings.verticalOffset -= (node.height / 2);
          else if(direction === NodeDirection.LEFT)
            diagram.scrollSettings.horizontalOffset -= (node.width / 2);
          else if(direction === NodeDirection.RIGHT)
            diagram.scrollSettings.horizontalOffset += (node.width / 2);

Problem with that way is that after diagram.refresh() screen reverse result of above piece of code, for example, if I wanna go right, I will go right,on needed lenght, but then it seems like screen centered on opposit side(it`s like mult on -1) or if I go down I will go back to the root node

Next, I visit documentation and saw autoscrolling, but i had no result with this like NO RESULT, i tried this and many options more:

this.scrollSettings = {
      scrollLimit: 'Infinity',
      canAutoScroll: true,
      autoScrollBorder:{
        left: 10,
        right : 10,
        top: 10,
        bottom: 10
      }
}

Also I saw, that there's event ScrollChange, but I have no idea how to set up it and so on.


Solution

  • I resolved my issue while I were just searching for some methods and suprisingly found something:

          diagram.scroller.bringToCenter(new Rect(node.offsetX, node.offsetY, node.width, node.height))