angular-materialcytoscape.jscytoscapedagre

Add scroll bar to mat tab based on the content size


I have a cytoscape graph on a material tab. I have a button that makes graph larger. I would like to add a scroll bar when the graph is larger.

Here is the stackblitz: https://stackblitz.com/edit/angular-68qptm?file=src%2Fapp%2Fshow-customers%2Fshow-customers.component.html

Click on graph and click on large and you will graph becomes larger but I do not see any scroll bar in the x-axis.

I am trying to add scroll bar as the content becomes larger.


Solution

  • I don't know how you can add a scroll bar. I think it might be nasty to achieve such a thing because the size of the graph canvas stays the same when you zoom in/out or pan.

    But I believe navigator extension might be useful.

    Below is a small gif of how you can use navigator extension You can see that at the bottom left there is a small map or navigator. enter image description here