Search code examples
diagramzoominggojs

GOJS second diagrams's zoom issue


I have two GOJS diagrams on a same page. one is primary diagram. It gets data on page load and displays the nodes. and it also has a search to find path between nodes.
Search takes source node and destination node. then on search action, the second diagram only displays the nodes involved in search and their links.

I am using mouse wheel for zoom in and zoom out.

mainDiagram.addDiagramListener("InitialLayoutCompleted", function (e) {
    e.diagram.toolManager.mouseWheelBehavior = go.ToolManager.WheelZoom;
});

primary diagram has no issue. but the second diagram's zoom does not work. Following is the code for my second diagram.

var myPathDiagram = _go(go.Diagram, "policyPathDiv",
        {
            initialContentAlignment: go.Spot.Center, 
            layout: _go(go.LayeredDigraphLayout,
                    {direction: 0}),
            autoScale: go.Diagram.UniformToFill,
            maxSelectionCount: 1,
            "undoManager.isEnabled": false,
            hasHorizontalScrollbar: false,
            hasVerticalScrollbar: false,
        });

then tools manager setting

 myPathDiagram.addDiagramListener("InitialLayoutCompleted", function (e) {
     e.diagram.toolManager.mouseWheelBehavior = go.ToolManager.WheelZoom;
 });

Second diagram gets the data on search action with following code.

myPathDiagram.model = new go.GraphLinksModel(nodes, links);

Everything is right except zoom on second diagram. keyboard shortcut ctrl + and ctrl - also doesn't work for second diagram.

I tried many things, but so far i am not able to make the zoom work on second diagram. any suggestion please...


Solution

  • Don't set Diagram.autoScale if you want the user to scale (a.k.a. zoom) the diagram.