I am making a diagram/flowchart web app and I finished the majority of the work only a couple of things remain.
I am trying to implement a way to zoom in and out the container (similar to how lucid chart does it) and also give the ability to pan the container.

For example, if there are no more spaces left in the container the user just pans to whichever direction they please, more space would be available. The things that I have now are a container containing nodes that are positioned absolutely. These nodes I can drag and position in whatever way I choose. There is a bug that happens when I move the nodes to a position which overflows the container. The node would get stuck there and I can only move it to a position that overflows the container more and I can’t pull it back.

I am no way an advanced javascript programmer, in fact I only began web development this year, so please give a clear and easy to learn/understand answer. And if the approach is of an expert level please provide sources for me to study .

Also, if you’re confused on what I am talking about you could visit lucid chart or any diagramming app and the functions that I talked about would be present